How to Remove Subscribe to: Posts (Atom) Link at the bottom of Blogger Template

A blogger who read my blog, send me an email and ask that how to remove “Subscribe to: Posts (Atom)” link at the bottom of his blogger template. So I thought that it is good to post article about “how to remove “Subscribe to: Posts (Atom)” link at the bottom of the blogger template because some bloggers have this problem. So if you need to remove this “Subscribe to: Posts (Atom)” link, follow the instruction below.


1. Go to Template

2. Click edit HTML tab

3. Click Proceed tab

4. Click on "Expand Widget Templates"

5. Find below code ( Help )

<b:include name='feedLinks'/>

6. Now delete that code

7. Save your Template

Now view your blog :-)       

    View full article here                                                                                     

How to create Automatic Jump breaks on home page with post summery and image thumbnail

Adding Automatic Jump breaks to blogger template is very easy than adding Jump breaks to each post manually. I found a little script than can grab a little summery of your post and a predefined size thumbnail to create smaller posts with read more button. Most new blogger templates already have installed this script or some thing like this. But if you are customizing a basic blogger template, you will need this script to do that. 

This is very simple. First open your blog and Go to Template and Click on Edit html button as shown in this image. Click on proceed on next window. 
Now click on "Expand widget templates" check box and search for </Head> Read How to search Specific code in Blogger template. Now paste the following code Before / Above </Head> tag


<script type='text/javascript'>
var thumbnail_mode = "no-float" ; 

summary_noimg = 575;

summary_img =475;

img_thumb_height = 200;

img_thumb_width = 200;

</script>
<script type='text/javascript' src='http://bloggerblogwidgets.googlecode.com/files/auto_readmore_blogger.js' > </script>



You can change those blue color values as you like. First one is the length of the text summery if you don't have an image on your post. second number is the text length if you have an image on your post to use as a thumbnail on the home page with your summery. Third and fourth numbers are the width and height if the thumbnail you are going to show in your home page with your text summery. IF you have larger or smaller images than this size you given the code those images will be changed to this size when creating thumbnails. 



Now find <data:post.body/> on your code and replace it using the following code


<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span>
</b:if> </b:if>

You can change the Blue color text as you wish. you can add "Continue reading" or "More details" it will be shown as your Jump break text.  Now save your template and go to home page to see how your script working. change summery length and image size as you want. 

View full article here

Share this Buttons Installation to Blogger Tutorial | Share this Social button Widget

Share this social sharing button set is a very famous widget among bloggers. because it is customization supported, Easy to install, Few different styles and support for the all popular Social media services. Unlike other social sharing button widgets you don't have to copy and paste long code sets and customize your template. share this button web site has scripts to install their widget to Blogger wordpress jumla and lots of other web development interfaces. As you can see in this image there are different types of gadgets and they have a floating share buttons set also. you just have to do few clicks and your blog will have a professional looking social sharing button set in a minute. now lets start creating this button set.

First go to the Offial site of Share this Buttons Widget. http://www.sharethis.com/

Now click on Get the Button link. you will be redirected to the next page. Now you have to select the platform you are going to add this button set. select blogger and click on NEXT: Step 2. Pick a Style link at the bottom of the page. 

Now you can select the design for your widget. There are three types of styles. select widget style and click Next step button. Now you can select which buttons do you want to use in your sharing button widget. Basically you can use Facebook like or share button. Google 1+ Button. Digg, Stumbleupon and Twitter.  Choice is yours select buttons and change their order.

You can change your button order and wanted buttons on Selected services box. if you want to remove a button then move your mouse pointer over it and click on the remove button. you can drag and drop other buttons from the boxes at right side. Now click on the next button. it will ask you to login or just get the code without registering. Registration is free and if you are a registered user you can read stats by loggin in to share this account likeGoogle Analytics. but this will only give you the stats for social button widget.  If you don't want button stats just click on the skip link at the top right corner of the pop up window. 


Now they will show you two types of the widget. read info and choose your favorite and click on the get code button. If you have a popup blocker installed, It will block the add gadget window. specially Google chrome. you will see a little icon showing that chrome has blocked a popup window at the end of the address bar. click it and allow it to appear. Now give a name to your widget and add it as a normal widget to your blog.


If you want to remove this widget. Just find that widget on your template and remove it. Easy as that. no more hard coding and template editing.

Backup your Blogger Theme | Blogger template Backup

Keeping backups of your templates is very important when you are going to customize your theme. Blogger has a simple template backup and restore feature. In this post we are going to learn how we can backup and restore blogger themes. 

Remember when you download your template you don't get your posts or images included in your blog. your backup only contains the HTML and CSS codes related to the theme of your blog. it might be few kilobytes. But it will keep your widgets and widget codings in the downloaded backup file. Now lets see how we can backup our blogger template.

If you are using the old blogger interface go to Dashboard and click on the design button under your blog. Then it will open the page elements tab. click on the Edit html tab next to page elements tab and click on "Download Full Template" link as shown in the picture. 

If you are using the new blogger interface, go to blogger dashboard and select  Template menu option from your blog.

Now you will see the Backup/Restore link at the top right corner. click it and select "Download Full Template" Button to download the template file.


Read this article to learn how to restore your Backups or upload a new blogger theme 

View full article here

How To Create Special Lists on Blogger and HTML codings

Lists are often used in many web sites. Creating lists is very easy. In this post we are going  to learn how to create a list in blogger and how to customize it with HTML codes. First lets see how we can create a list using blogger and how to customize it using the HTML mode and how to create a list only from using HTML. 

First put your cursor on the place you wanted to add the list and click Insert Bullet list button. It is the same button as Microsoft word. Now you will see the first item of the list has been created. If you want to read more about lists and how to create numbered lists read this post. We create Bullet lists in html using the <UL> tag and create menu items using the <LI> tag. Look at the following code and it's result below.

<ul>
<li>This is</li>
<li>A Bullet</li>
<li>List</li>
</ul>

• This is
• A Bullet
• List

Now lets see how we can customize these lists with html mode. You can use alphabet letters instead of dots in bullet lists. then we have to change the first line of the code like this. 

<ol type="A">   Starts a numbered list, using capital letters. you can use "simple a" as the type to create the list using the simple letters

<ol type="i">   Starts a numbered list, using  small roman numbers


<ol type="I">   Starts a numbered list, using  capital roman numbers

View full article here

How to Create Numbered lists Using Blogger And Html Codes

In this post we are going  to learn how to create a numbered list in blogger and how to customize it with HTMl codes. Creating a numbered list is very easy. If you are familiar with Microsoft word and other text editing softwares, it is the same way to create lists in blogger too. There are few options you can use if you are using HTML mode. in addition to these options you can specify at which number the list should start and the number format also.

Now on we are posting our tutorials on new blogger interface. If you are not familiar with it, then click here to read the main content on the new blogger interface. 


Open a new post and hit Numbered list on the tool bar.


Now you will see the first number as 1. Type the first value and press enter then blogger will automatically add the second number. enter the text and press enter again. keep doing it until you finish your list. When you finished creating your numbered list press Enter button twice to stop adding numbers and start typing normal paragraph again. 


Now lets see how we can customize our number list using the Edit Html section. You can see the html and compose mode buttons on the left side of the new post tool bar in new blogger view. In html we call numbered lists as Ordinary lists. we use <OL> tag to create a numbered list and <li> tag ( List Items ) to add the numbered list. look at the following code and the result of that code. you can create that list using only the html code.



<ol>
<li>This</li>
<li>Is a</li>
<li>Numbered list</li>
</ol>

1. This 
2. Is a 
3. Numbered list

Think if you want to break the numbered list on the 3rd item and add a little information under it and start the list after the paragraph with number 4. then you can use this code when starting the list again. 


<ol start="4">


Now your second numbered list will start from number four. Try numbered lists with changing options like colors fonts with html and compose mode

View full article here

Search Place of a Code in Html or a Place of a Specific Word in a Web page

This trick is very important to all internet users. This is useful to find a special word in a web page. you can find any word in your browser using this trick. When you editing your blogger template or blog post this search tool becomes very handy. 


This trick works with all internet browsers. All you have to do for activate this little search gadget is to press F key while holding control key  CTRL + F . now your browser will open a little search box from a side. type exact word or phase to search it on active web page or tab.


This is useful when you are editing links on a web page or Editing a blogger template.

View full article here