D.C.R.U.S.T Murthal: Template

Showing posts with label Template. Show all posts

Monday, 30 July 2012

Changing Your Sidebar Font & Size

Ahh! I did it. When i was trying to change the sidebar of my upcoming template i changed the sidebar font. It looked hard but when i peeped in the template code once, i ultimately knew how to change the sidebar font. I thought i will share this trick with my lovely visitors.

Generally the default font of almost all templates is Arial. But always arial doesn't looks good. To meet our template requirements we need to change the font as letters matters much to us, but the style of those letter matters even more. So here it is for all of you. Be sure you read this carefully. So here we go then;

Login to your blogger account.
And be forwarded to design>Edit Html.
Search for this block of code or similar one;

.sidebar {
color: $textColor;
line-height:1.3em; 
}

Now it's turn to modify this code. Add the below code to the above one;

font-family: times;

After adding it should look like this one;

.sidebar {
color: $textColor;
line-height:1.3em; 
font-family: times;
}

If you want to change the size of font of sidebar then make the code like this;

.sidebar {
color: $textColor;
line-height:1.3em; 
font-family: times;
font-size: 150%; 
}

Here;

Change "times" into your desired font name.
Change "150" into your desired size. Instead using percentage you can use pixel also to define the size.

Now click on save template and you are done.

Now you are done changing your sidebar font and size. I hope it will work for you as it has worked fine for me too.

If you have any thing to say then immediately comment below. We are waiting for your comments.

ENJOY!!

Monday, 16 July 2012

Place Your Ads Below Post Title

Best Placement Of Ad

Many people wish to make more money than they earn. In fact every body does. But everybody don't. It depends upon the number of blog visitors (impressions) and clicks. It also matters on the position of the ads. Eg: Putting the adsense ad below the post is likely to get less clicks then that of ads lying above the post. So to get high CTR to day I am going to teach you how to place an add below the post title of your blog.

It's not hard at all. Just you need to create a new add and add it. So are you ready. Let's proceed then;
According to many advertising network placing ads below post title is an excellent trick to earn more clicks. It is illustrated by the heat map at left.
Here we go;

1. Creating An Add

For placing add you need to create an add first.
Create an add. It's usually better to create a new one so that you can track it properly.
For best result create an add of size 300x250 (medium rectangle) or 336x250 (large rectangle).
After creating the add get the code of it.
Copy the add code.
Encode the code of that add by using this tool to escape special characters. If you directly implemented then blogger won't accept it.
Copy that escaped code.

2. ADDING THE ADD CODE

After you have encoded your ad code it's ready to be implemented.
Be forwarded to your dashboard.
Go to design>Edit Html.
Tick the expand widget templates check box.
Look for the following code in your template;

<data:post.body/>

After you have found the above code then paste your escaped ad code above (before) it.

By doing this ad will appear on blogger posts and pages. If you want to make it appear on posts only then;

Paste your code like the way below;

<b:if cond='data:blog.pageType == &quot;item&quot;'>
 ESCAPED CODE GOES HERE
</b:if>

The conditional tag (line 1 &3) will make your ads visible on posts only.

Hope this will work for you.

CHEERS!!

Adding Yahoo Smileys on Blogger Posts and Widgets

Their is no obligation to tell that you all know about yahoo. Since it is the most famous messenger and it ranks 4th on the basis of it's pageviews and users. Everybody knows about yahoo features. On of the famous feature of yahoo is the smileys. It's very good to see and works on all computers without installing any software.

Today in this post i will be teaching you the way to add yahoo smileys on blogger posts and widgets. It's quite simple as it won't take time. You Just need to add two codes one CSS and another Javascript. So here we go;

1. ADDING CSS CODE

Log in to your blogger account.
Be forwarded to your dashboard.
Go to design>edit Html.
Find the below code in it;

]]></b:skin>

After you find this code paste the below code immediately before (above) it.

<!-- Yahoo Smileys on Posts and Widgets by Blogging Sentral Code Start-->
img.bhsmly {
    height: auto !important;
    vertical-align: middle !important;
    width: auto !important;
    border:0px !important;
}
<!-- Yahoo Smileys Code End by Blogging Sentral-->

2. ADDING JAVASCRIPT CODE

Now it's turn to add the java script code. See for this code once again.

]]></b:skin>

Add the below code just after it;

<!-- Yahoo Smileys Script on Posts and Widgets by Blogging Sentral -->
<script src='http://yahoo-simileys.googlecode.com/files/yahoo%20simileys%20by%20blogging%20sentral.js' type='text/javascript'/>

Now save the template and you are done.

By this you can make smileys visible to your blog. Just enter the shortcut of it that you used to enter in IM . For eg: for a happy face the code is ":)". Like this each smileys have it's own shortcut. If you don't know then here are some of the smileys. Hope this adds taste to your blog.