How to Change CS:S Background and Font

Arguably one of the best FPS games ever developed. Maps like Dust2 set the standard for all to follow.

How to Change CS:S Background and Font

Postby JasonPowers on Tue Dec 29, 2009 9:35 pm

Image

Below is a step by step process that will allow you to change your background and font as shown above. PowersGaming is NOT responsible for anything that goes crazy as you attempt this; we highly suggest you READ THIS WHOLE ARTICLE before you proceed to make sure you've comfortable making these changes. As always, it's a good idea to BACK UP everything first. ;)

1) Find The Image You Want to Use: Hop on over to Google Images or w/e and find a pic you like. Size matters; particularly if you have a large widescreen monitor. But even if you don't, your image will always look better when you begin with one that's high quality. So, in Google Images, hit "show options", and then click on "Larger than" and go at least 6MP (it was necessary to go 8MB for a Samsung 30" widescreen monitor). The pic you want to use should be large in size (We used this size: 3504 x 2336), but also around 2MB. Don't use something that's 417k; it's just too grainy and pixellated. This same size, or close to it, worked well on a Samsung 19" monitor.

In your image, your subject should work within the configuration of the CS:S background. By that, we're referring to the positioning of your subject. The images used above worked nicely, tho it was necessary to flip them horizontally to get the subject's head on the other side of the background. FotoChop was used for this.

2) Convert Your Image: First thing you'll need to do is add a folder for your image in your Source directory. In your "materials" folder, create a folder called "console":

Image

Now, you're going to convert your image to a .vtf file. To do this, you'll need to download a .vtf editor. We choose This One. Download and install your editor, and open the software. On the left side of your editor, where it says "File System", find your image, and double click on it. The editor will prompt you to choose a resize method. Choose "Nearest Power of 2". The size we choose in those three images above (3504 x 2336) worked well because they're each a power of 2. What that means is 3504 is 1168 x 3, and 2336 is 1168 x 2. So it resizes nicely. Hit "OK". It will take some time to edit that large image, so be patient. Once your image comes up, click on "File", then "Save As", name the file "background01" and save it in the "console" folder you made earlier. NOTE: For widescreen monitors, like a 30", name the file "background01_widescreen":

Image

Image

Now double click on your Source icon and see if your new background comes up. If it doesn't work, rename your .vtf file. Depending on the size of your monitor, it will either be named "background01.vtf", or it will be "background01_widescreen.vtf". There should only be ONE .vtf file in your console folder. If it comes out a bit "pixelated" or fuzzy, then the jpeg you used is not the correct size for the vtf software to convert; you'll either have to find a more perfect size, or "crop" it in FotoChop.

3) Choose a Font: If you want to use an existing Font, skip this and go to #4. If you need a font, go Here and find the one you like. In that site, you can type the words, "CounterStrike:Source" in the box that says, "Custom Preview", hit "Submit", and see exactly what your font will look like. Now, save your font in the folder below (make sure to unzip it):

Image

4) Move Your Font: In your "cstrike" folder, you should have a "resource" folder. If you don't have it, create it. DRAG your font into this "resource" folder, and pay attention to what the font gets named. For instance, we used a font called, "Home Remedy". When we dragged that font into our "resource" folder, it was renamed, "HomeRem". This is important later on:

Image

5) Find Your "ClientScheme.res" File: If you already have a "resource" folder, see if you have the file, "ClientScheme.res". If you do, skip this and go to #7. If you do not have this file, we're going to find it and extract it to your resource folder.

Image

6) Locating and Extracting Your "ClientScheme.res" File: The "ClientScheme.res" file is located in your "steamapps" folder, inside a file called "counter-strike source shared.gcf". That file is too large (1.63GB) to open with Wordpad, Adobe, or anything else. You'll need to download and install some software to open it from this site, then go to your "steamapps" folder and open your "counter-strike source shared.gcf" file with the GCFScape software you just downloaded/installed:

Image

In the window that opens next, open the "cstrike" directory, then open the "resource" folder, and locate your "ClientScheme.res" file, and Extract it to the "resource" folder in your "counter-strike source" directory:

Image

Image

7) Edit your "ClientScheme.res" file with Wordpad: Now you can go into your resource folder (where you just put that "ClientScheme.res" file), and open it using wordpad:

Image

Scroll down about halfway to "ClientTitleFont". Next to "name" is the logo font. You need to replace "Counter-Strike Logo" with the name of your font. After the // change cslogo.ttf to your font's file name (ie HomeRem.ttf). NOTE that this is the same name as in step #4.

Image

Notes:
"tall" under "name" is the point size of your font, bigger values will make it bigger, smaller with make it smaller.
"weight" under "tall" is bold, the bigger the value, the thicker the letters, and vice-versa.
To change it back to default, you can either delete ClientScheme.res or if you changed other things in there you want to keep, just change everything back to what it was.
You can find your fonts in C:/WINDOWS/Fonts or Control Panel>Fonts...

Scroll all the way down to the bottom. There's a section called "CUSTOM FONT FILES"; this tells CS:S where the fonts are so it can load them, otherwise it will either show the default, or use what is probably Arial. Anyway, now you need to add an extra line to the list. Simply put the next number in the list, followed by the path to the font. BE CAREFUL NOT CHANGE ANYTHING OTHER THAN ADDING ANOTHER NUMBERED LINE:

Image

Now, click File>Save and you're done! (If it prompts you for a save location, save it to the Resource folder as ClientScheme.res, replace if it asks.) When you open up CS:S the logo should be in the font you chose. If it isn't, make sure your font has capital letters in it and make sure you got the file names correct.
User avatar
JasonPowers
Site Admin
 
Posts: 573
Joined: Thu Aug 14, 2008 11:49 pm

Re: How to Change CS:S Background and Font

Postby JordanPowers on Wed Dec 30, 2009 12:21 pm

Looks cool, I like the font and the woman!
Image
User avatar
JordanPowers
Site Admin
 
Posts: 280
Joined: Thu Aug 14, 2008 3:31 pm

Re: How to Change CS:S Background and Font

Postby JasonPowers on Sun Jan 10, 2010 1:46 pm

Hope this is easy enough for you guys to follow; post up any questions you might have here in this Forum. ;)
User avatar
JasonPowers
Site Admin
 
Posts: 573
Joined: Thu Aug 14, 2008 11:49 pm


Return to Counter-Strike : Source

Who is online

Users browsing this forum: No registered users and 1 guest

cron