Non-standard fonts in Blogger for blog design. Beautiful calligraphic font on Blogspot, Blogger

Good day, dear readers. Today I want to talk about one of the ways to install a non-standard Cyrillic font on your site. This method suitable for any site, including blogs on Blogger. This method has been successfully used on many English-language sites, and is actively used in premium WordPress and Joomla themes.

Because Since most of my readers blog on Blogger and WordPress, I'll show you how to install a custom font on those blogs. At the same time, the method described for Blogger is suitable for absolutely any site. And for WordPress there is a ready-made plugin. But I do not advise you to scroll the article to the relevant descriptions, because. to configure the plugin, you will need all the knowledge about this method.

I think on this moment this is one of the most popular ways to install a non-standard Cyrillic font on the site, firstly, because of the ease of installation, and secondly, because of the support of different browsers.

Have I intrigued you enough? It's time to move on to the details.

So, this method is called Cufon. It was invented by one developer - Simo Kinnunen. First, he created a special file that needs to be connected to the site. Secondly, he created a generator that turns any font into JavaScript.

The method itself is simple to disgrace, and later you will see it. The most difficult thing here is exactly the search for the required font. And I am sure that many of you who are not active users graphic editors, such as PhotoShop, simply have no idea what font to load into the generator and where to get such a font. This is what I decided to talk about in more detail.

It is no secret that a certain set of fonts is installed on any computer, in the same Word and other programs. We can also independently install new fonts on our computer, including in any program. To do this, we just need to type the phrase in any of the search engines download cyrillic fonts and make sure the fonts we found are in .ttf format.

After downloading the font you like in .ttf format, you can install it on your computer by simply opening it.

Or select the Install command using the right mouse button. After this procedure, the font will be displayed in all programs installed on the computer, where it is generally provided. Those. no further action is required. The described method is guaranteed to work in Windows 7.

Installing absolutely any Cyrillic font on the site in three steps

So, we have become the owner of a beautiful non-standard Cyrillic font and want to install it on our site. What are our actions?

Step 1

We go to the Cufon website - cufon.shoqolate.com.
Click on the link in the menu - Download. The script page opens. We just copy all the code, paste it into notepad and save it with the .js extension. For my readers, I have prepared a ready-made file, you can download it to your computer.

Be careful, as of the date of writing the post on July 26, 2011, the version of the script is 1.09i. It is this version now at the link above.

Uploading the script to the hosting. Anyone who blogs on Blogger should already know where to upload a third-party file (), I use Google sites for this.

Step 2

We return to the Cufon website to the Generator tab. Before us is a page with many settings. To be honest, I didn’t go into absolutely all the settings, but during the experiments I tried different ones, and I always got the desired result.

But in any case, I have prepared some screenshots with basic settings to draw your attention to important points.

As you can see, there is a separate loading window for each type of font:

• regular font
• bold font
• normal italics
• bold italic

I didn’t fully understand why this was so, but I loaded it exactly where the description maximally characterized my font.

For example, the screenshot shows the loading of a handwritten font. He is slanted and quite well-fed :).

Next, the field with the license agreement is highlighted. You must check the box and thereby confirm that the font you are uploading is allowed to be used on the web by the developer of this very font. Here the question is delicate, unfortunately, among the large variety of different fonts on the Internet, we ourselves do not know exactly which font we can use and which not. Therefore, this item is entirely on your conscience.

Next screenshot.

1. In the first field, we indicate that we want to display uppercase and lowercase letters, as well as numbers and punctuation.
2. The second field is checked by default, I have not tried to remove it.
3. In the third field, be sure to select the Cyrillic and Russian alphabets.

I highlighted one line in blue - those who generate the font for WordPress put a tick here.
And the last settings.

1. I didn’t write anything in the first box, but I think the field is useful from the point of view that if you specify the domains on which the font will be used, it simply won’t work on other domains.
2. I understand that in the upper field we are talking about what font size will go by default. You can agree to the setting, or you can refuse by checking the box. Personally, I tried in different ways and I was satisfied with both options. I think it also depends on both the font itself and the idea of ​​the template designer. The next item in window 2, the generator itself recommends turning it off, provided that you are going to use a small font size. If possible, it is better to put the last checkmark, because. thanks to this setting, the generated file is smaller, which will undoubtedly affect the loading of the font for the better.
3. And finally, an agreement with the terms of use of the generator.

As a result, we get another file, which is also uploaded to the hosting.

Step 3

The only thing left is to specify in the site template files before the closing tag code like this:

As you can see from the code, we are applying the font to the h1 heading tag. Thus, you can specify any other tag so that it displays our Cyrillic font.

You can also specify not a tag, but an identifier:

But that is not all. If you want to use several different fonts on one site at once, then for all new fonts we go through Step two and specify them all:

If you are not sure about the correct spelling of your font, then open the corresponding generated file from step 2 and find the information you need.

The one highlighted in blue is the name of the font.
So, on one of my test blogs, it was originally like this.

And it became like this:

How to Install a Custom Cyrillic Font in WordPress

For WordPress users, it's still much easier. Of course, you can go all the way described and the font will also work, but there is also a ready-made plugin called All-in-One Cufon. You can download the plugin both from the developer's website and directly in the blog admin panel.

Installing the plugin. Activate. Go to plugin settings. At the very top are two warning messages.

The first is that you should create a cufon-fonts folder in the wp-content/plugins/ directory. To do this, connect via FTP or go to the hosting control panel and create a new folder in the plugins folder called cufon-fonts. After that, the first message disappears.

The second message says that you must place the generated font file in the created folder, the same file that we get in Step 2. We load the file and the message disappears, while the font appears in the settings below, which the plugin now "sees".

Do not forget to check the box next to the font that you are going to use in the template. But the font is not working yet. Below is the Cufon Code field, in which we must specify which tag our Cyrillic font should be applied to. In this case, you need to specify a bare code, without any other designations.

replace("h1");

By the way, it is worth saying that if you have installed WordPress theme with an already non-standard font, while it does not have a Cyrillic spelling, then you need to:

1. Install the All-in-One Cufon plugin.
2. Install the generated font.

You do not need to enter the Cufon Code in the field below, as a rule, this code is already written in the template. If you want to install another font, in addition to the existing one, then such an entry will need to be made, as I wrote in the examples above.

A very important note.
If you have optimized the headings in the template according to my articles - and then you should be extremely careful. If you remember, on all pages except the main one, the blog title is in the tag (in link). You need to assign an id or class to this tag, for example:

And then your Cufon code should be like this: