25+ Best Free Premium Blogger Templates

Blogger is one of most popular blogging platform and there are thousands of blogger templates out there that you can easily find using Google but it is a time taking and a hard job to select a nice and high quality template, that's why in this post, we have selected 26 best, beautiful, useful, awesome, optimized, responsive, SEO friendly and premium blogger templates for you and we hope you might need any one of it.

GoGreen Free Premium Template



Demo More Info/Download

Cricket Mag Blogger Template



Demo More Info/Download

Videoism Blogger Template



Demo More Info/Download

WebDepot Blogger Template



Demo More Info/Download

Folio Blogger Template



Demo More Info/Download

Retina Blogger Template



Demo More Info/Download

Pakistani Mag Blogger Template



Demo More Info/Download

WebMag Blogger Template



Demo More Info/Download

Metro Classic Responsive Blogger Template



Demo More Info/Download

Al-Islamic Blogger Template



Demo More Info/Download

Timeline Magzine Blogger Template



Demo More Info/Download

AndroidMag Blogger Template



Demo More Info/Download

Creative Gallery Blogger Template



Demo More Info/Download

Geeks Gadget Blogger Template



Demo More Info/Download

Twitter Blogger Template



Demo More Info/Download

Metro UI Blogger Template



Demo More Info/Download

News Magzine Blogger Template



Demo More Info/Download

MaxMag Responsive Blogger Template



Demo More Info/Download

Blogism Blogger Template



Demo More Info/Download

MegaMag Blogger Template



Demo More Info/Download

Dazzling Designer Blogger Template



Demo More Info/Download

Hi-Tech Technology Blogger Template



Demo More Info/Download

Diffuse Magzine Blogger Template



Demo More Info/Download

Damn-LOL Blogger Template



Demo More Info/Download

Apollo Blogger Template



Demo More Info/Download

We hope you will get your desired blogger template from this selected list and we will keep it update as new free or premium templates released. If you have any query regarding theme installation, feel free to comment or contact us.

Remove Link From Post Titles For Blogger

Hello Again,

         Removing the link from post titles from post page is a good thinking because it is there for nothing, if some one do click on it, it will redirect to the same page, which doesn't seems a professional work, so better to remove link from  post titles when we are at the post page. It is also too easy to do this just follow the few steps below to do it.

• Login to Blogger Dashboard
• Click on the blog, and then click "Template" tab
• Click on "Edit HTML"
• Find the Following code

<b:if cond='data:post.url'>
<a expr:href='data:post.url'>
<data:post.title/>
</a>
<b:else/>
<data:post.title/>
</b:if>

• And Replace it with the following code

<b:if cond='data:post.link'> <a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<data:post.title/>
</b:if>

• Finally Click on "Save template"

If you have any query, you can ask in the comments below. Thanks

Navigation With Arrow Keys For Blogger

Now your users can navigate through your posts using the arrow keys, and you don't need to more putting Older and Newer Post buttons, and it is very easy to add the arrow keys navigation system to your blog.

This widget is very simple, you can check live demo on this page. If you press the "Right arrow key", it will redirects you to the Older post of our blog and if you press the "Left arrow key", it will redirect you to the Newer post of our blog. And don't worry if you are writing some thing on Text area field, it will not redirect you anywhere by pressing arrow keys.

Now how to add this widget to blogger blog, Click below to install the widget

Add this you to your blogger blog and enjoy the navigation with arrow keys, and also share it with your friends. If you have any query, you can ask in the comments below

Submit Sitemap To Google Webmaster Tools For Blogger

Google Webmaster Tools is great place to get the organic traffic, organic traffic is traffic comes from Search engines. it helps you in indexing your blog or site and improves crawling rate. It is good your blog or site SEO to submit your sitemap to Google.

Many blogger users don't know how to submit sitemap to Google Webmaster Tools, and some of blogger users which have submitted their sitemap are suffering from seeing "26 URLs submitted". Follow the method below to Submit all URLs your site contains.

• Go to Google Webmaster Tools
• Sign in to your account, Select the blog whose sitemap you want to submit
• Click on the "Sitemaps"

• Click the "Add/Test Sitemap" button at the top right corner
• A small box appears there. Put the following code in the field

atom.xml?redirect=false&start-index=1&max-results=500

• Finally Click on "Submit Sitemap"
• Refresh the page and get excited to see your upto 500 URLs submitted.

Note: If your blogger blog has more than 500 posts, then you need to submit another sitemap, but with a little change in code. See the example carefully below to understand the change.

atom.xml?redirect=false&start-index=501&max-results=1000

Don't forget to share it your friends too, so they can also able to submit their sitemaps. And if you have an question you can ask in the comment below. Happy Blogging! 

Send Short Post To Feedburner Subscribers For Blogger

In default, our full posts delivered to the feedburner email subscribers, but webmaster don't want to their subscribers to reader post in the email and to lose their traffic from email subscribers.

Now what you need to do to make it like it only send title and short description, follow the process below to do it.

• Login to Blogger Dashboard
• Select a blog, Click on "Setting" tab 
• Now click on "Others" tab
• Under Site feed, In Allow Blog Feed
• Select "Short"

• All Done. Enjoy the visitors from emails.

If you have any query, you can ask in comments below. Greets

Create Custom 404 Error Page For Blogger

A 404 error page is shown when user clicked on a broken link or try to navigate to a link manually. either the post has been deleted or have a typo mistake in the URL. It is good for our blog SEO to provide a good response in our 404 error page, and fortunately blogger is allowing us to have a custom 404 error page.

You can have two options for 404 error page, one is redirect the broken link page automatically to your blog Home page or other is showing them a sweet message on 404 error page.

1. How to Redirect 404 error page automatically to Home page

• Navigate to Blogger Dashboard
• Click on a blog
• Go to "Setting" tab, and then go to "Search Preferences" tab
• Under Errors and redirections, In Custom page not Found, Click "Edit"
• Paste the below code

Sorry, the page you were looking for in this blog does not exist. You will be redirected to homepage shortly.

<script type = "text/javascript">

BSPNF_redirect = setTimeout(function() {

location.pathname= "http://bloggergiant.blogspot.com/"

}, 5000);

</script>

• Note: Change the http://bloggergiant.blogspot.com to your blog Home page, and you can set 5000 to 0 to redirect immediately
• In last click "Save Changes" 

2. How to create a custom 404 Error page with a sweet message

• Navigate to Blogger Dashboard
• Click on a blog
• Go to "Setting" tab, and then go to "Search Preferences" tab
• Under Errors and redirections, In Custom page not Found, Click "Edit"
• Paste the below code

<font size='5'>Page Not Found!</font><br /><br />

 <img alt="404 Error page" border="0" height="202" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiQ-c1QGmj3RKl2PDjlSOR6f1l8JYvlYV3c2WJI9m8LqSihCaMiiZwYz97vbXfZzTy0-ehJT7jsznwiNSROa9TedLmv3tvhZSP5diFHsa9YUgzb2V_oSuNZATmdyqbXIfWLCmPGyRrafg/s400/404_error_page.jpg" title="" width="400" /><br /><br />

<strong>Oops ! Looks like you either clicked a broken link or a Page that does not more exits </strong>

 <br /><br />

<b><u>Other things to try:- </u></b><br /><br />

Go to our<a href="/">Home Page</a>, or use menus or links to navigate to our blog.<br /><br />

Report the Problem to us by <a href='mailto:bloggergiant@gmail.com'>Clicking Here</a>

• Note: Change the bloggergiant@gmail.com to your email.
• Now Click on "Save Changes".
• Live Demo

If you have any query, you can ask in the comments below. Thanks

Remove Home And Older Post Links For Blogger

As you can see the Newer Post, Home and Older Post links in the picture shown above, these links are not good for navigation because the main Home link is already present in the header and others links are not attract the user to go your blog's older or newer post. We are suggesting you to better use Related Post With Thumbnails For Blogger rather showing these Newer Post, Home and Older Post links. These links are also not to decrease your bounce rate too.

Now how to remove Newer Post, Home, Older Post links, this can be done easily just by putting a CSS code in your HTML code. Follow the steps below to Remove these links:

• Go to Blogger Dashboard
• Click the blog in which you want to remove these links
• Click on "Template" tab, and then click on "Customise"
• This will open Blogger Template Designer, Click on "Advance" tab
• Put the follow CSS in the Custom CSS box

 #blog-Pager {
display:none;
}

• Click on "Apply to blog"
• you can check your blog post and its removed

We will glad to listen you feedback. Thank you

Remove LinkWithin Link Attribution For Blogger

As we shared the method to install Related Posts With Thumbnails For Blogger that is widget by LinkWithin, and it contains a link attribution of Linkwithin in their widget, and all of the site or blog owner must not like to give a back link to their site, so here is an easy to to avoid the attribution link from the widget.

All you need is to add a small line of CSS to your site or blog.

#linkwithin_logolink_0
{display:none;}

Now how to add this CSS to Blogger blog, follow the steps below:

• Go to Blogger Dashboard
• Select your blog in which you want to add this CSS
• Now go to Template tab, Click on "Customise"
• On Blogger Template Designer, Click on "Advance"
• and put this CSS in the Custom CSS box
• and Click "Apply to Blog"
• All Done.

If you have any query, you can ask in the comments below. Thanks

Related Posts With Thumbnail Widget For Blogger

Related posts is a must have widget for every blog or site, related posts are shown below every post and with thumbnail they definitely attract more traffic and decrease the bounce rate. Related posts also increase the page views of your blog or site. Again we are suggesting you not to use any custom related posts widget because it might not optimized, rather use the one we have selected for you from some best related posts widget providers, that is LinkWithin.

LinkWithin is a free and easy to install widget, no signup required to get the widget. LinkWithin widget loads fast widget codes are stored on LinkWithin server, and it also blends with your blog or site design. LinkWithin increase the pages views, engage your readers and gives you more traffic.

Follow the steps below to install LinkWithin Related posts with thumbnails:

• Go to site LinkWithin
• All you need to put your email, blog Link, platform and width
• Note: For platform select "Other"
• and in last click on "Get Widget!"
• See the screen shot below:






then copy the code. And paste in below code

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

• Now go to Blogger Dashboard
• Click on the blog in which you want to add this widget
• then go to template tab and click on "Edit HTML"
• now search for the following code

<body

•  Now put the above code just below the body tag in your blogger template.
• You have got the Related Posts with thumbnail widget

Update:If you want to remove the back link of LinkWithin and Check out to Remove LinkWithin Link Attribution 

If you have any query you can ask in comments below, it will be our pleasure to help you out. Thanks 

Recommended For You Widget For Blogger

AddThis made this very easy for us to add "Recommended For You" widget for Blogger, because it released with AddThis Smart Layers and we already shared the method to implement Smart layers to your site or blog. To view the demo go to down and in the right corner you will see what is recommended for you.

The purpose of writing this post is that Smart Layers load at home page on blogger that is what we don't want to Recommended for you widget to load, so follow the steps below to add "Recommended for you" widget to post only.

• First of all go to AddThis Smart Layers
• put "ON" What's next and make sure all other are "OFF"
• then click on "Generate Code"
• then copy the code. And paste in below code

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

• Now go to Blogger Dashboard
• Click on the blog in which you want to add this widget
• then go to template tab and click on "Edit HTML"
• now search for the following code

<body

•  Now put the above code just below the body tag in your blogger template.
• You have made it.

If you have any query you can ask in comments below, it will be our pleasure to help you out. Thanks 

Social Media Sharing Buttons Widget For Blogger

Social Media widget is an essential tool for every blog or site, it is simply a widget that allows user to share the blog post to social media profiles, if you search for Social Media Widget, you will find a lot sites and blogs offer you free social media widget, some of them will give you their own made social media widget (I am in favour with them) but some of them will give you only code to put in blog and enjoy, using that type of widget like copying and pasting can't be suitable for any site or blog because we don't know it is optimized or not or how much bandwidth it take while loading our page. So we will suggest you only go for the widget which sites really owns. We had already discuss about the AddThis in last post and we are suggesting you to use AddThis Social Media widgets because it gives you optimized and trusted widgets that really work, it increase traffic and engagement with social media.

AddThis Social Media widget includes different types of social media sharing buttons widget you see in the picture below:

Now the main point is how to get this, Follow the process below to get any one of these social media widgets.

• Go to AddThis Share Buttons
• Sign-in or create a new account
• Select the one you would like to add to your site or blog
• and then click on "Grab It"
• Paste the code in body tag of your site or blog.
• All Done! Enjoy.

If you have any query you can ask in the comments below. Thanks

AddThis Introduces New Smart Layers

First of all let me share you some information about AddThis, AddThis is a web's largest social infrastructure and analytics platform, they are working for publishers to personalize and socialize their sites or blogs since 2006. They are making good improvements to their tools, APIs and service to make it powerful and easy to use for advertisers, publishers and brands.In worldwide almost 14 million sites are using AddThis social plugins and analytics.

Now let's come to the point that is AddThis has recently introduces "Smart Layers: Personalizing The Web" They are ensuring us that be using their new product AddThis Smart layers we can drive up to 3x traffic, site engagement and followers. AddThis Smart Layers are multiple tools in one piece of code with personalized features, mobile ready and easy to install that shows the smartness of Smart layers. AddThis Smart Layers includes Share, Follow, Recommended content and What's Next.

Now how to get these smart features to your site or blog, It is an easy task to get the AddThis Smart Layers, follow the steps below:

• Go to AddThis Smart Layers
• Put your social media profiles URLs of Facebook, Twitter, LinkedIn, Google+ and etc
• And Click on "Generate Code" 
• By giving your email address, you can get free analytics reporting on your site's Smart Layers
• Copy the code and paste it in Body tag of your site or blog
• and Enjoy

If you have any query you can ask in the comment below.

Facebook Embed Post For Blogger

Facebook has launched a new social plugin named Embedded posts which allows you to share status update, photos and videos to your blog or site. Embedded posts work as like YouTube and Twitter embed work. You can embed those Facebook post which are set to public.

Facebook announced embed post with a status update of The Biritish Monarchy which is about the Royal baby as a sample.

Now the real thing, how to embed a Facebook post on your site or blog. If you go and search for this picture which Facebook used in announcement of embed post, you will not find the Embed post option there because Facebook is slowly rolling it out to public pages and profiles. Only some of well known site/blog like Mashable, Bleacher Report, The Huffington Post and etc get this feature till now. But don't worry still you can make embed post of your Facebook page/profile status update. Follow the process to embed a Facebook post.

• Go to any Facebook public post and copy the URL
• Note: You can get the URL of any status by clicking on date of the post and then copy it
• Now go to Facebook social plugin Embedded Post
• There you see "Creating an Embedded Post"
• Paste your URL in "URL of story" field
• Wait for your URL to get loaded
• Finally click on "Get Code".
• Now paste the code in your post.

See the Demo below:

If you have any query regarding Facebook embed post, you can ask in comments below. Thanks

Google+ Comments For Blogger

As we have already shared with you in last post here that blogger has announce the Google+ comment system for blogger, which socialize your blog and reach to a great audience.
We are writing this post because a lot of blogger who are using custom templates are unable to tweak the Google+ comment system. follow the steps below to get rid of it.

• Go to http://blogger.com and login to your dashboard
• Click on your blog and then click on Google+ tab
• And then click on get start, and switch to Google+ profile
• And then come back to Google+ tab
• Tick the “use Google+ comments on this blog”

Now if you are you using the one of default blogger templates, voila! you did it. But for those who are using custom blogger template, there are two ways to enable it.

1. The Short cut 

• Go to your Dashboard and click the Template tab
• Now first you must backup your template and then click on Edit HTML
• Click on Revert widget templates to default button
• Select the Blog1 widget form the list and then click on Revert selected widgets.

The Short cut will definitely work for you but it depends on your luck that it changes your other customization of template or not. so best of luck for the short cut. If it changes your customization, still no need to worry because we already have backup of the template. Just restore it and follow the second method.

  2. The Giant

• Go to your Dashboard and click the Template tab
• Click on Edit HTML
• Now search for the following code

<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data="post" name="comments"/>
</b:if>

• and replace it with this

<b:include data='post' name='comment_picker'/>

Note: Replace the both under pagetype Static and item. Enjoy. If you have any query you can ask in comments below. Thank you

Blogger Improvements in 2013

Let’s review the blogger for the changes came in 2013, we were cover here the official changes came in blogger in 2013. It will help us to get benefits of changes which blogger done for us or we can say whatever blogger is doing it will definitely help us to improve our blog.
Let’s start here:

1. Useful improvements to blogger template HTML editor

In 2013 blogger announce the very useful improvement to blogger template HTML editor which attracts you to utilize the enhancements that blogger made. If you can play with HTML, CSS and JavaScript then you can make your templates as you would like to see it. In new HTML editor there is line numbering, syntax highlighting, auto-indentation and code folding just like in our lovely Dreamweaver. You can now move the date underneath the title of the post through new HTML editor, to do so you can check out the official blog post here.
\


2. Google+ comments to Blogger

Comments are very important for a blog, so blogger did a very good job here by allowing us comments using our Google+ profile. This features let you blog connected with the audience. You need to enable the feature from blogger dashboard to allow Google+ users to comment. Follow the steps below to enable the Google+
• Go to http://blogger.com and login to your dashboard
• Click on your blog and then click on Google+ tab
• And then click on get start, and switch to Google+ profile
• And then come back to Google+ tab
• Tick the “use Google+ comments on this blog”
• And build your audience. Tweak Google+ comments on custom template
  


3. Some Major updates to blogger

• Two improvements to the Google+ Followers widget for Blogger
• Wikipedia gadget is added to blogger gadget gallery
• Contact us form official widget is added to blogger that can be found in more gadets tab and now don’t need to use other online forms

Do Subscribe

We are starting this blog with this post because by subscribing you will get the blogger tutorials which cover the basic and important steps you needed to start a new blog on blogger. And you will also get the updates of this blog to learn blogging.

Follow by Email