Showing posts with label Blogger Template. Show all posts
Showing posts with label Blogger Template. Show all posts

Sunday, June 7, 2009

How To Add A Search Box For Your Blog

Simple - add the Search Box as a gadget in the "Layout" tab of the Blogger dashboard. It's the latest addition to the gadget list. You have the option to search:-

1. your blog
2. the pages you've linked to
3. the Web


.

Tuesday, February 3, 2009

How to Change Case of Text

For some reason, Blogger forces all text into upper case.

I use the "Minima" template of Blogger. To turn off this setting, go to the sub-tab of "Edit HTML" of the "Layout" tab and delete, or comment out, the following statement:

text-transform:uppercase

in corresponding sections of the template.

To comment out the statement, insert "/*" at the beginning of the statement and "*/" at the end of it, like this:

/*text-transform:upprecase*/

For the text of the title, look for the following block of codes:

#header h1 {
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
}

Delete the statement "text-transform:uppercase;" or change it to "/*text-transform:uppercase;*/".

For the title description perform the change at #header .description (

For the sidebar, at h2 (

For the footer of the post, at .post-footer (

For the comment page, at #comments h4 (

For the footer of comment, at #comments-block .comment-footer (

For the profile, at .profile-data (

For the profile link, at .profile-link (


Press Ctrl-F to search for the relevant keywords within the codes.

Click "Save Template" to save your changes.

For the font family, style (bold or italic), and size, you can change it at the sub-tab of "Fonts and Colors" at the "Layout" tab.


.

Wednesday, January 21, 2009

How To Customise The Widths Of The Blogger Template

While trying to test the various positions and sizes of Adsense unit around the blog, I needed to customise the width of my main column to accommodate the Banner format (468 x 60) of Adsense unit.

I was using standart Minima, which is a 2-column template with the default width of 410 for the main column, which is not long enough to display the whole ad unit.

To customise the widths of the Blogger template:

1. Log in to Blogger.

2. At the Dashboard, click Layout.

3. Within the Layout tab, click "Edit HTML" to open the editor window.

4. Do all the necessary backup.

5. Change the required width values of the following sections: #header-wrapper, #outer-wrapper, #main-wrapper, #sidebar-wrapper, #footer. Click Ctrl+F to find the keywords within the code.

I changed the width of the main column with adjustment as follows:

At #header-wrapper - width: 688px
At #outer-wrapper - width: 688px
At #main-wrapper - width: 468px (note: the width of the Adsense unit in Banner format)
At #sidebar-wrapper - width: 202px
At #footer - width: 688px

Note that the widths of the #header-wrapper, the #outer-wrapper, the #footer (688) are bigger in value than the total of the widths of #main-wrapper and #sidebar-wrapper (668). The difference (20) represents the spaces between columns. This will keep the overall design of the blog in proportion.

Adjust the widths according to your requirement, with the above-mentioned guideline in mind.

6. To see the effect of the changes, click "Preview".

7. If the result is satisfactory, click "Save" to save the changes.


.