24 March 2010

How to adjust height and width of Blogger Header?

αвнєєѕн asked me - hii drraman, when i add image to the title of my blog, this drop down menu bar will be disappeared, why this happend , plz tel me ur kind suggestion...and help me....

So adjusting height of the header will solve the above problem.

22 March 2010

How to Show Adsense Ads Only on Homepage or Post pages on Blogger

Now that you have learned how to place adsense ads in between your blog posts some of you may want to show adsense ads only on blog homepage or blog post page only. Here is a easy trick to do this.

Go to Dashboard > Layout > Edit HTML > Expand Widget Templates.

19 March 2010

Popular Posts or Most Commented Posts widget for blogger (new version)

Many of the Bloggers want to show their users list of the Most Popular posts on their blog.Many such "Popular Posts" widgets have been available for Wordpress blogs but there was none available for Blogger blogs.

Recently one such widget have been devised for Blogger.It is based on the number of comments each post gets.So,the most commented post will be the Most Popular Post of your Blogger Blog.

Live Demo

My previous Popular Posts widget was based on Yahoo Pipes and it is not working now. But never mind. Today we have a fully working step by step procedure for it.

12 March 2010

Five elegant 2 column blogger tempolates

Piano-Black



Designed by - BloggerFAQs / Mono Lab


Features -It's a beautiful 2 column template with right sidebar.

Download

06 March 2010

Recent Posts widget (new version with Spy effect)

Recent posts hack is always popular with bloggers. As we already have two versions of it.

1. Simple Recent Posts widget using feeds

and

2. Recent Posts with Image/Photo Thumbnail Widget

Here is the next version of Recent Posts widget with image thumbnails. But interestingly it includes a Spy Effect. This widget is not only elegant but also very easy to add to blogger.

The Demo is already present on free-blogger-help.blogspot.com/


5 beautiful One column Blogger Templates

Design Studio


Designed by - BloggerThemes
Download




Minicard


Designed by - Blog and Web / Blue Anvil

Download



QuickPic



Designed by - BloggerThemes / Quick Online Tips

Download



Visiting Card


Designed by - Blogger Mastering / Premium Themes

Download



The Antagonist


Designed by -     Insight your Blogger  

Download

03 March 2010

Numbered Page Navigation hack for Blogger (New & Error free)

Few bloggers has some problems with previous Page Navigation script. Now here is a completely new and error free script for Numbered Page Navigation(i.e. Panigation) for Blogger.  Specially thanks to Abu Farhan for this new script. As I already stated Page navigation allows us to number blog pages(1, 2, 3 ....) like those of a book. This replaces the 'newer' and 'older' post links and give users/visitors an ability to go to the deep into your blog.

Live Demo of Page Navigation hack.

So let's add this elegant hack to your blog.
STEP 1 - Adding CSS Style

Go to Blogger Dashboard > Layout > Edit HTML. Always Download Full Template for Backup. Do NOT click on Expand Widget Templates. Now look for
]]></b:skin>

Now add following code ABOVE it.

.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #999;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd;
}

.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
border:1px solid #888;
background: #ccc;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666;
text-decoration: none;
}

This is a one style code. But you can choose your suitable one. All styles are created by Abu Farhan.

CSS Style

  1. Style 1
  2. Style 2
  3. Style 3
  4. Style 4
  5. Style 5
  6. Style 6
Demo of Above Styles

  1. Style 1
  2. Style 2
  3. Style 3
  4. Style 4
  5. Style 5
  6. Style 6


STEP 2 - Adding JavaSript

Look for
</body>

And add following code ABOVE it.

&lt;script type='text/javascript'&gt;
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
&lt;/script&gt;
&lt;script src='http://scriptabufarhan.googlecode.com/svn/trunk/pagenaviv202-min.js' type='text/javascript'&gt;&lt;/script&gt;

Here you can change Prev and Next Text.

var postperpage=7;
var numshowpage=4;

Postperpage : How many Posts you want to show on one Page of blog.
Numshowpage : how Many number will show in Your page Navigation

e.g. If you want to show 5 posts per page then change var postperpage=7; to var postperpage=5;

Save your Template.


STEP 3 - Label Fix (Customization)

Again go to Blogger Dashboard > Layout > Edit HTML. This time Click on Expand Widget templates.
Look for

'data:label.url'

And replace it with

'data:label.url + &quot;?&amp;max-results=7&quot;'

Again here you have to change 7 to 5 if you want to show 5 posts per page.

Save your template and view your blog.

UPDATE
When you want to add the link similar to given below, directly into the template

http://www.blogger-help.com/search/label/2%20Column%20Templates?&max-results=6

You will get following error:

The reference to entity "max-results" must end with the ';' delimiter.

To solve this error just

replace & with &amp;

Similar hack
Numbered Page Navigation hack with Scroll

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More