Minggu, 22 Mei 2011

How to change Font on blogger Template

Author : Djendral's Jack


Posted: 18 May 2011 03:31 AM PDT
How to change Font on blogger Template – If you use a template from other people’s design, then there will be some part of template that you don’t like, maybe the fonts. The fonts in question probably the font type, font size, font style, etc.
fontIt’s quite easy to change the font on blogger template, the basic of CSS font has been discussed in Blogger Tutorial previous posts, so please to read it first for easier to understanding about CSS font.


Change Font on Template Designer

If you are using the officially provided template by the blogger through Template Designer feature, then it will be so easy to change the font, you just need to clicking on the menu provided. Here’s how to change the font via template designer:
Login → Design  → Template Designer

On the Template Designer page, change the menu to Advance mode. Here you can change the font as you like. If you’ve done, don’t forget to click APPLY TO BLOG button which on right top.
advanced template designer

Change Font on Edit HTML Menu

In other case if you use your own design template or using free blogger template. You must change the font manually on your CSS template code. Please note that each template was made different from each other, therefore the following description won’t be exactly the same with the template code you used.
Here's how to change the font through CSS code which on Edit HTML menu:
Login → Design  → Edit HTML

To keep things that are not in want, you should to backup your template by clicking Download Full Template.
All you have to do is look for the similar code to the following codes:
font-family: “Arial”, Tahoma, Verdana;
or
font-size: 12px;
or
font-weight: bold;
change font on blogger template
Remember! These codes position might be spread and in more than one code. Then you just replace the Value of the font Property, if you don’t understand, please read the previous posts. If you’ve changed the font code, click SAVE TEMPLATE to finish.

Hopefully useful, altought I’m sure the writing may seem difficult to understand for those who still a newbie in the world of blogging.
How to change Font on blogger Template is a post from: Blogger Tutorial for beginners

Another useful blogger tutorials:
Posted: 18 May 2011 01:32 AM PDT
fontBasic of CSS Font – Let’s take a moment to learn CSS code, this time is about Fonts. Font settings through CSS are always used in each template whether blogger template or other web template. Font setting here includes the font type setting, font size and so forth.

CSS Properties

In CSS there are terms named Property and Value. Note the CSS code below:
body { background:#8f8e8e; color:#000000; font-family:Arial, Tahoma, Verdana; font-size:12px; }
Let’s take color :#000000; code as sample. Color is a Property and #000000 is a Value. Property is a CSS code that has been standard or has been set in CSS, while Value is a value assigned for particular property. Property and Value are separated by a colon ( : ), and to split one property with another are with semicolon code ( ; ).

CSS Font Properties

In fonts, there are several properties that can be used. The following table are the font properties and their description:
PropertiesDescription
fontArrange all font properties in one declaration
font-familyFont type setting for specific text
font-sizeFont size setting for specific text
font-styleFont style setting for specific text
font-variantSpecifically setting whether a font will be displayed in small-caps or not
font-weightSpecifies the weight of a font

Font-Family Property

Font-Family property is to set the font type for a text. Several font types which often used for the blogger template are Times, Arial, Tahoma, Verdana, Georgia, TimesNewRoman, Sans-serif, and so on.
The Value of font-family are usually written in 3 font types and separated with the commas   ( , ), for example:
font-family: “Arial”,Georgia,TimesNewRoman;
font-family:”Times”, Tahoma, Verdana;
font-family:”Georgia”, Arial, Verdana;
Seen that one among the 3 types of letters which were written are given two quotes ( ” ” ). Those are the font types selected, and the rest are as reserve, if the first font can’t be opened by the visitor’s browser then the next font will be used.

Font-Size Property

Font-size property is used to adjust the font size. There are many values that can be used for the font size property. The following are table Value for the font size property and the descriptions:
ValueDescription
xx-smallAdjust the font in xx-small size
x-smallAdjust the font in extra small size
smallAdjust the font in small size
mediumAdjust the font in medium size. This is the default font size
largeAdjust the font in large size
x-largeAdjust the font in extra large size
xx-largeAdjust the font in xx-large size
smallerAdjust the font size smaller than the main element
largerAdjust the font size larger than the main element
lengthSet the font in a fixed size in units of px, pt, cm, etc
%Adjust font size based on the percentage of the main element
inheritSpecific font size inherited from the main element

The more often used is the length that is in units of pixels (px), points (pt), cm, em, and so forth. For example:
font-size: 12px;
Font-size property is often used to distinguish the size of headings (h1, h2, h3, etc), or paragraph. Suppose
h1 {font-size: 20px}

Font-Style Property

Font-style property is used to determine the style of the font. Font style only has 3 Values those are normal, italic, and oblique. The most often used is the italic style. The sample code is
font-style:italic;

Font-Weight Property

There are many values of font-weight properties, but the most widely used is to make writing bold printing. Example
font-weight:bold;
For more info about CSS Font, you can read at W3 School.
Basic of CSS Font is a post from: Blogger Tutorial for beginners

Another useful blogger tutorials:
|

0 komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)

Powered byEMF Form Builder
Report Abuse