How does one define a font to use for WindowBlinds.

Originally posted on

I find a lot of users having problems with how fonts are defined in a WindowBlinds skin. It’s quite simple once you understand it how it’s done.

WindowBlinds bases on the premise that most of the skins use just a small number of font variants but use them in a number of places, meaning that one font setting will be used in a number of places like a push button, a tab, a status bar.

A font setting in SkinStudio is called “font preset” and is a set of font name, size and formatting as well as its shadow settings. When you think of it in the terms of any word processor a font setting is not different from “styles” used e.g. in Microsoft Word. And they are equally as useful! in contrast to MSStyles where you define the font for every control or its sub style in WindowBlinds you only define it a few times and then use them in multiple places.

What’s better… if you decide to change the font in a style, do it only once for the style and WB will change it everywhere the font is used! Let me show you how it’s working on a sample skin for a push button.

Every control section has a font setting (at least one) in most cases grouped in the “Fonts” subgroup in its section section.


selection one of the attributes in the group allows you to select one of the preselected fonts from the bottom combo box as shown in the above picture. Now what if you want to edit the preset and change it?

You can simply press the “Edit this font” button as in this figure:

and SkinStudio will take you to the appropriate section.

But this will change all the elements that use the preset! So if you only want to change it in this one situation or only this one control, you need to create a new preset. You can do this by either pressing the “Add new font” that will create a new default “Arial” font preset or you can choose the “Duplicate this font” that will create a new font preset identical to the one that is currently selected. Obviously you will choose the second option if you want to make the font slightly different, e.g. bold-ed for pressed state or slightly bigger or smaller. Both options will also automatically assign the newly created font preset to your selected control/attribute.

One nice thing which is probably not known by even some advanced artists is that WB will try to be smart if you won’t assign all of the fonts. For instance you can assign only the Normal font and WB will use that for all states. Now if you choose to assign another font for pressed state you only define this new state and WB will use the “pressed font” for pressed state and the “normal font” for all the rest. the fonts marked as (WB 3x) are only there for compatibility with already discontinued WindowBlinds 3 versions as some skins from the old days still use them, but there is no need to define those.

Now that you have a new preset defined it would be a good idea to modify it to your liking. If you select the attribute using the said font preset and press the “Edit this font” button SkinStudio will take you straight to the font.

Now if you have the “Font – face” attribute selected – SkinStudio will provide you with a convenient font editor in the lower panel. It’s a good idea to define the “Font name” attribute to something that is descriptive for you. It’s your “style name” speaking in the MS Office nomenclature again and it will be displayed in the combo box while you’ll be selecting the presets for your controls.

You may wish to explore and experiment the “Shadow” subsection as a homework :)

There are more fonts to WindowBlinds that are not defined in this very way like titlebar fonts. Those are defined in their respective sections.

The other type of fonts are the system fonts. Those are the fonts that you can define for the “classic” look in the Display Properties as you’ve been able to do since Windows 95.

WindowBlinds allows you to define those fonts in the skin as well in a sepearta place although in a very similar way.

The skin can define all 6 system fonts in the same way. The presets are defined in the same way although they do not share the same preseyts pool as the regular fonts preset.but rather attach their sections below the “Miscellaneous”->”Fonts for classic widgets” section.

Now as I have suggested in one of my previous articles it’s best to define the font size in negative values for the size of those fonts:

If you use the classic widget fonts referenced from section “Miscellaneous”->”Fonts for classic widgets” and defined as subsections to the section, make sure you specify the font sizes in negative values. Should you fail to do this, all kind of bad things may happen. Firefox will look bad. Outlook 2003 will most probably have problems and applications are liable to have some of their fonts blown out of the proportion.

But as we’ve investigated with danilloOC, probably the best idea would be not to define them at all as they tend to cause problems with some cross platform apps like OpenOffice or Firefox which does not seem to know how to handle the Windows fonts properly. Your experiences may be different though or the application may have been improved since then, but be sure to check it out before you publish your skin.

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)

This entry (Permalink) was posted on Monday, September 26th, 2005 at 6:38 pm and is filed under Skinning, SkinStudio, WindowBlinds. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response , or trackback from your own site.