Best 2 Know

The Ultimate Blogging Resource

Tag: Blogger Hacks

How to show 10 posts instead of 5 posts in blogger

We all always tried to show more recent Posts but we always failed because bloggers Feed Widget it only shows 5 posts only but today I m going to tell you how to show 10 recent posts or more in stead of  5 on blogger . for this you just have add a simple JavaScript. So now lets get Started.

Follow the Following steps:
1. Login in to your blogger dashboard .
2. Click on the layout Link.
3. Click on Add a Gadget Link.
4. Then Select HTML/JavaScript Add .
5. Paste the Following code and your Done.

<script src=’http://best2know.googlecode.com/files/Recent%2010%20Post%20instead%20of%205.js’ type=’text/javascript’ />
<script>
var numposts = 10;
var showpostdate = false;
var showpostsummary = false;
var numchars = 100;
</script>

<script src=”http://YOURBLOG.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp”></script>

<br />
<div class=”clear”></div><p style=”text-align:center;”><a href=”http://www.best2know.info/2010/04/how-to-show-10-posts-instead-of-5-posts.html” title=”Grab this wiget” target=’_blank’><b>Grab this Widget</b></a></p>

In the Above code change the YourBlog.blogspot.com with your link of your site or of your custom domain.

And if you want to show more than 10 posts then change the number which is highlighted in red color to the number of how much posts you want to show

How to Show sidebar or widgets only on Home page or Post page

Hi to all of you today after many days i am making an article i am making this because my next post will be depended on this trick. So you have seen many blogs with showing some widgets only at homepage and some at posts page hows it possible you might have think its to easy.

1. Login in your Blogger Dashboard.
2. Then Click on Layout.
3. Click on Edit HTML.
4. Click on Expand Widget Templates.

Now Find for the widget you want to show only on homepage or post page only . if you have added any title for it then search for the title.

Just below that widget id link, You can see a b:includable tag like this..

<b:includable id=’main’>

Then Just Below it add this code to Display it only on homepage :

<b:if cond=’data:blog.url == data:blog.homepageUrl’>

To display it only on Post page add :

<b:if cond=’data:blog.pageType == “item”‘>

To Display it on any specific page then add :

<b:if cond=’data:blog.url == “Blog Post URL“‘>

Now Replace the Word in Green colors with the link.

Now we have to close b:if tag

so now before </b:includable> add this code:

</b:if>

Thats All it Enjoys friends and Wait for the Next post by me That will So much Splendid

Set as Homepage Link for bloggers

Now a days you see many leading sites with link displaying Set as Homepage. this is an good think to do with if your visitors make your site as an homepage whenever they open the browser your page will display as well as it will increase you blogs rank.


How to add this Link?
1. You can add it by selecting the Add HTML/JAVASCRIPT.
2. By Putting in the Body tag.
You have to put the Following code:

<a href=”#” onclick=”this.style.behavior=’url(#default#homepage)’;this.setHomePage(‘http://riteshsanap4u.blogspot.com‘);”>Click here to make Tips and Ticks your default homepage</a>

the Text Shown in red color is the text you have to put for diplay. and the text in Green color is the Link of your site.

Theme Request or Template Request

There are many great WordPress themes available for you. If you want a theme for your blogger template, you can request it here. Every job has its price. I only need $10 donation after I do my job. Please use the format as stated below:

Theme title:
Author:
Download link:
Demo link:
Email:


I’m not selling the templates but want people to appreciate my work. Thanks.

Read More hack for Blogger with automatic Thumbnail creator script

You have seen many a times the Read More Widget made by Hackosphere was very popular but was not able complete most of needs.

1. Major Problem
we have to add this code always.


Type your summary here
<span id=”fullpost”>
Type rest of the post here
</span>

2. This feature can be available only for future posts.

That is if you already have 50 posts in your blog and then after that you are adding this hack to your template then you need to add the above tag in each and every previous 50 posts to make this hack working. But it’s a tedious process.

3. Can’t create Thumbnails automatically

This hack can’t create automatic thumbnails for posts.

Now a new version has been developed by my blogger friends. I would like to share that new version of read more hack with you all.

Read More hack with automatic Thumbnail creator script

This hack has overcome all the drawbacks of the previous version of read more hack. This hack is developed by Blogsphera . ( Translated version ).

Let’s see the installation instructions :

Adding the Javascript

To add the javascript files to the header , first login to your blogger account. Then navigate to Layout section of your blog and then move to EDIT HTML sub tab and check ” Expand Widget Templates ” option in the edit html page.

There search for this tag : </head>

Now place the following code above that tag </head> :

<SCRIPT type=’text/javascript’> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 500; summary_img = 400; img_thumb_height = 130; img_thumb_width = 281; </SCRIPT> <SCRIPT src=’http://www.smashingtips.com/wp-content/uploads/2009/05/read-more.js’ type=’text/javascript’/>

Then Add This Code
search for this tag  <p><data:post.body/></p> or <data:post.body/>
Now replace that whole tag with the code below :

<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<p><data:post.body/></p>
<b:else/><DIV expr:id=’&quot;summary&quot; + data:post.id’><p><data:post.body/></p></DIV> <SCRIPT type=’text/javascript’>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</SCRIPT> <div style=’clear: both;’/> <div style=’border:0px;padding-top:5px;;float:right;text-align:right;’><span class=’readon’><a expr:href=’data:post.url’ rel=’bookmark’><img src=’http://i422.photobucket.com/albums/pp302/bloggeracs/ReadMore.png‘/></a></span></div>
</b:if>

You can now preview your template and then save it.

Customizing The code 

Now let us see how to customize the code to suit your style :

  • var thumbnail_mode = “no-float”;

    • By default i have selected no-float. That the image will be unformatted. If you want the thumbnail to be shown only on left use the option ” float ” instead of “no-float”.

  • summary_noimg = 500 ;

    • This code will decide how much characters must be shown in the post if that post doesn’t contain any images. I have selected 500 characters.. you can customize it to suit ur template.

  • summary_img = 400 ;

    • If the post contains image , then this code will decide how many characters must be shown in that post. Change the number of characters to be shown to suit your template.

  • img_thumb_height = 130;

    • This tag decides the height of the thumbnail to be shown in the post. Vary the number 130 to suit your template.

  • img_thumb_width = 281 ;

    • This tag decides the width of the Thumbnail image to be shown

Adding read more image 

The author of this hack haven’t included any read more buttons in this hack. But I have modified the code and have included a image to link to the full post.


http://i422.photobucket.com/albums/pp302/bloggeracs/ReadMore.png

If you want to change the image then replace the url of the image with your own image

or if you don’t need any read more button , then replace the code in final step to this one :

 <b:if cond=’data:blog.pageType == “item”‘>
<p><data:post.body/></p>
<b:else/><DIV expr:id='”summary” + data:post.id’><p><data:post.body/></p></DIV> <SCRIPT type=’text/javascript’>createSummaryAndThumb(“summary<data:post.id/>”);</SCRIPT> <div style=’clear: both;’/><div style=’border:0px;padding-top:5px;;float:right;text-align:right;’><span class=’readon’><a expr:href=’data:post.url’ rel=’bookmark’>Read More…</a></span></div>
</b:if>

 change the tag in red to suit your style.


source :http://www.techieblogger.com/

How to send content summary only for my feedburner subscribers via email?

Many of the blogger in the world uses Feedburner which is now associated with google and its leading nowadays. You have subscribed to some of the sites you like you see that some of them show only short post How do they do that ? its very simple just follow below Steps:

  1. Log in to your blogger dashboard 
  2. Click on setting link / button
  3. Click on Site Feed
  4. Click on drop arrow and Select Short Instead Of Full 
  5. Click on Save.

Enjoy All the Fun this will increase your page views and Rank too.

Add TwitThis on your Blogger template and drive more traffic on your website

TwitThis is an easy way for people to send Twitter tips messages about your blog post or website. This tutorial illustrates a simple way to add a TwitThis link on each post of your Blogger template. I suggest you to try it because it’s very useful and drive a lot of traffic on your website if you have a good Twitter network.


To add TwitThis on your Blogger template you can using the code you can find here.
That code uses JavaScript. If you want use a simpler way to add it use this alternative.



HTML Code

  1. login to your blogger dashboard
  2. Click on Layout

    preview :
     

  3. Click on Edit HTML

    Preview :

  4. Check Expand Widget Templates

    Preview :

  5. Then add the Below Code Were You Want (This Code Will Only Display Link)

    <a expr:href='”http://twitthis.com/twit?url=” + data:post.url + “&amp;title=” + data:post.title’>Twit This!</a>

    Note : Copy and paste the code exactly how it is in the box above! Don’t remove spaces!

  6. Save Your Template

If you Want To Display With Image Use This CSS Code

If you like my TwitThis link (), add this class in your CSS file and use it in the previous link:



Add the below Code  Before ]]></b:skin>

.share-twitthis{
background:url(http://tinyurl.com/ay2jsc) 10px top no-repeat;
padding-left:42px;
font-size:11px;
line-height:18px;
}

Then add this code where you want it to Display

<div class=’share-twitthis’><a expr:href='”http://twitthis.com/twit?url=” + data:post.url + “&amp;title=” + data:post.title’>Twit This!</a></div>

Thats All Enjoy !

Total Posts and Total Comments Widget

Hello to all the blogger users today i m going to tell you how add an Total Post and Total Comment Widget

Total Post Widget Tells your visitors the post that are having been published to your blog and also shows that how many comments have been done to your blog so it can encourage to other people to comment on your blog

    
Q:   1.Is it difficult to install this hack ?
    A: No its so simple that you have to just add an HTML/JAVASCRIPT widget

  1. First login to your Blogger Dasboard .
  2. Then Click on Layout.
  3. Then click on add HTML/JAVASCRIPT.
  4. Add Below Code to it :

    <script style=”text/javascript”>

    function numberOfPosts(json) {
    document.write(‘Total Posts: <b>’ + json.feed.openSearch$totalResults.$t + ‘</b><br>’);
    }

    function numberOfComments(json) {
    document.write(‘Total Comments: <b>’ + json.feed.openSearch$totalResults.$t + ‘</b><br>’);
    }

    </script>

    <script src=”http://Your-Domain-Name/feeds/posts/default?alt=json-in-script&callback=numberOfPosts”></script>

    <script src=”http://Your-Domain-Name/feeds/comments/default?alt=json-in-script&callback=numberOfComments”></script>

  5. Then Just Put Custom domain name for Example : www.yoursite.com or yoursite.com
  6. For Blog URL for example. riteshsanap4u.blogspot.com
  7. Just Click on Save Button

Your Total Post and Total Comments Widget is ready