High Quality Most Popula blogger templates 2013

If you’re looking for free and best blogger templates which were released in 2013 then here is an article which is composed of some of the best blogger templates which are very beautiful. While some of these templates have adopted the design from WordPress themes, the others are standing high as they represent themselves uniquely. The blogger templates which I’m sharing through this article are freely available over the internet and I’m only making a good list out of it. These templates will definitely improve the design of your blog.

High Quality Most Popula blogger templates 2013

Template By MBT

Live Demo DOWNLOAD 

 

Template design by Labnol

Live Demo DOWNLOD

 

 MaxMag Responsive Blogger Template

DEMODOWNLOAD

CopyBlogger Template V2.0

DEMODOWNLOAD

Blogism Blogger Template

DEMODOWNLOAD

  

Artarius Blogger Template

DEMODOWNLOAD

Metro BTK V2 – Impressive Blogger Template

DEMODOWNLOAD

Loved these blogger templates? Share your experience through the comments below. PS – Please make sure that you don’t remove footer links. Respect the developers who have released these themes for free. 

Posted By Unknown10:40

3

Continue Reading

Most Beautiful New Islamic Blogger Template 2013

Template Name: Al-Islamic Blogger

Platform: Blogger / Blogspot

Release date : 20, April 2013

License : Creative Commons Attribution 3.0

DownloadPreview

Al-Islamic is a purely religious blogger template dedicated to the whole Muslim community that believes in that the Holy Prophet Mohammad PBUH is the last prophet of Allah. While creating this template, we tried our best to use decent and religious colors and pictures so that it does not mislead anyone in any case. This theme is partially responsive and works pretty well on all key browsers like Google Chrome, Firefox and even Internet Explorer. This template is ideal for Islamic and religious websites.

Features of Al-Islamic Blogger Template: 

1. Nivo Image Slider: Featured content sliders are now considered as the core element of a website. Keeping that in mind, we have added a decent Nivo Image slider in this theme. This slider is extremely lightweight and hardly causes any slowness in the blog.


2. Islamic Blogger Template: The gigantic collection of blogger themes has quite a few Islamic themes, so considering this fact our team has decided to create a large collection of Islamic theme especially for those Muslims who love to endorsee their religion. 


3. Light-weight Social Share:  In this theme, we have also added modest social share options. It is not elegant, but it does looks beautiful with large cluster of your content.


4. Multi-drop down menu: We also incorporated a Multi drop down menu in this theme. To provide more flexibility, we have not used any jQuery file. In fact, everything works on CSS.


5. SEO-Friendly: This theme is absolutely wonderful for search engines. This theme has the highest search engine optimization score. The speed of this template is 92 out of 100 according to Google Speed insights. 

More Features: Magazine Style, brownish color scheme, threaded commenting system, three Columns footer, Timeline Style Template, 2 column template and much more

From the Designer's Desk:

We hope this theme would help my Muslims brothers to grow the roots of Islam through this Template. We have added almost all gadgets, so there is no need to do lots of editing. If you liked this template, then do share it with your friends.

Posted By Unknown10:09

4

Continue Reading

Best Related Posts Widget For Blogger

There have beens posts on many popular blogs related with the Related Posts Widget for Blogger. I have seen many users were upset after installing the Related Posts Widget in Blogger. Most of the Related Posts Widget makes the load time of the blogs lengthier, So despite of increasing the page views the reader gets frustrated and goes away there by losing a reader and the mentioned page views. Even if you are using a cheap high speed internet also you wont get any benefit because the script for loading the Related Posts is the culprit, it takes time to load especially if you are having a lot of related articles. So here is a Related Posts Widget for Blogger which loads pretty Faster (won’t slow down your blog loading) which i also uses in my own blog ………

Special Thanks to Debajyoti Das From RealTrix for informing me about this wonderful widget.Simply adding a Related Posts Widget in blogger wont create a good impression. So you need to add a nice css code to suit your blog only then a reader will be impressed by the widget and he/she will consider reading the related posts. Before going to explain how to add the Fastest and Perfect Related Posts Widget for Blogger, let me explain the Advantages of using the Related Posts Widget in Blogger. Readers who just need the code for it can skip this section.
But you should definitely read this if you don’t know what the related posts for blogger can really do.

Advantages of using a Fast Loading Related Post Widget for Blogger

1) The Related Posts Widget Really Helps you to get more Page views on You Blog.
2) Your blogs visitors won’t leave quickly and they will stay for more time on your
blog.
3) The more the page views you get the more is the Ad impression in your website and you
will get more CTR (Click Through Ratio) So you will make More Money with Adsense and similar Advertising Programs. So making money online will become more easier for you. You need to work less to get more money online.
4) The

Related Posts Widget

in you website will help the readers to navigate through your website, so they wont get confined to a single post.
5) The

Related Posts Widget

really help when people reach specific posts in your website especially through search engines. They will then be able to discover more contents in your website and they will get impressed, and whats more if you other posts are also too good then the reader will get impressed soon and there are chances for you to get a valuable subscriber for your blog.
I hope now you have got a idea what the Really Related Posts Widget in your Website or Blog can Really Do. Now lets see

how you can add related posts widget in blogger.

There are two sections one for Beginners and one for Advanced Users.
I hope that you got what i meant.

Adding the Related Posts Widget in Your Blog (For Beginners)

Adding the Related Posts widget in blogger is an easy task.
1)

Backing up your Blogger Template

At first go to the ” Layout ” Tab in blogger and then click the ” Edit Html ” option. and Click on Download Full Template and your Current Template Will be downloaded. So we have created a back up of your blog now. In case if any thing goes wrong you can upload this file and restore your blog to previous state.
2) Now the real process starts. Click the button below to

Add the Related Posts Widget to your sidebar of your blog

3) No need to enter the title for it because it will be shown automatically as ” Related Posts “.
4) Now the Related Posts Widget will be added to your blog’s sidebar. If you want it to be shown below the Post then drag it to below ” Blog Posts ” and click on ” Save ” (important!).
5) Now just open any of your posts in your browser (not the front page of your blog. You can see the Related Posts showing up there.

Here is My Related Posts Widget in Action

If you are satisfied then this is it. If you need to squeeze some more from it then read on…..

Adding or Showing the Related Posts Widget below the Blog Posts / Any Where in the blog (For Advanced Users)

If you are an Advanced Blogger, then you may want to show the Related Posts widget any where in the blog
Before Reading the following steps add this following piece of codes in your template first.
Go to end of your template or search for the following in your template.

</body>
</html>

Now add this codes just above them so that it looks like this after you have added it.

<script src=’http://www.google.com/jsapi’/><script src=’http://amalroyamal.googlepages.com/CUrelated.js’ type=’text/javascript’/>
</body>
</html>

1) If you want to show the related posts just below the blog posts.
Search for

<data:post.body/>

in your blog template and add this code just below it.
It will look like this after you have added.

<data:post.body/>
<div id=’related_posts’/>

2) You need to add only this simple piece of code to show Show the Related Posts widget Any where in Your Blog.

<b:if cond=’data:blog.pageType == &quot;item&quot;’>
<div id=’related-posts’>
<div id=’related_posts’/>
</div>
</b:if>

Thats it you can now successfully show the related posts widget in your blog.
If you want to add style to it then here is a nice css code for you.

#related-posts {float : left;width : 580px;margin-top:20px;margin-left : 5px;margin-bottom:20px;font : 11px Verdana;margin-bottom:10px;}#related-posts .widget {list-style-type : none;margin : 5px 0 5px 0;padding : 0;}#related-posts .widget {list-style-type : none;margin : 5px 0 5px 0;padding : 0;}#related-posts .widget h2, #related-posts h2 {color : #940f04;font-size : 20px;font-weight : normal;margin : 5px 7px 0;padding : 0 0 5px;border-bottom:1px dotted #666;}#related-posts a {color : #054474;font-size : 11px;text-decoration : none;}#related-posts a:hover {color : #A91B33;text-decoration : none;}

Now if you have a doubt’s and suggestion’s related with

Adding the Related Posts Widget for Blogger,

Posted By Unknown11:20

3

Continue Reading

Add Floating Social Media Sharing Buttons To Blogger

The Floating Social Media Sharing is a very popular widget on all the top blogs, being a very good way to increase the number of times your posts get shared on Twitter, Facebook and other social networks. It has some of the following functions: Facebook Like, StumbleUpon, Twitter Share, Digg This, Google+ and RSS Feed Icon and each of them comes with a live counter. You can add more sharing buttons or social bookmarking icons later if you wish.

How to add the scrolling social bookmarking bar

1. Go to Layout
2. Click on Add A Gadget link
3. From the pop-up window, scroll down and select HTML/Javascript
4. Copy the code below and paste it inside the empty box.
5. Save the gadget.

The code to copy-paste (updated!):

<!-- floating share bar Start helplogger.blogspot.com--> <style type="text/css"> #pageshare {position:fixed; bottom:5%; margin-left:-721px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;} #pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;} .fb_share_count_top {width:48px !important;} .fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;} .FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;} .FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;} </style> <div id='pageshare' title="Get this from Helpblogger.com">
<div style="margin-left:8px;"><div class='sbutton' id='like' style='margin: 5px 0 0 5px;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script><fb:like layout='box_count' show_faces='false'></fb:like> </div></div>
<br /><div class='sbutton'><a class='twitter-share-button' data-count='vertical' data-via='Helplogger' expr:data-counturl='data:blog.url' href='http://twitter.com/share' rel='nofollow'>Tweet</a><script src='http://platform.twitter.com/widgets.js'; type='text/javascript'></script>
<br /><div class='sbutton' id='su'> <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script> </div> <div class='sbutton' id='digg' style='margin-left:3px;width:48px'> <script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script> <a class="DiggThisButton DiggMedium"></a> </div> <div class='sbutton' id='gplusone'> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <g:plusone size="tall"></g:plusone></div><br/><a href='http://feeds.feedburner.com/helplogger' rel='nofollow' target='_blank' title='Subscribe To Our Rss Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUyHz8IptO08xbjDtJmmpNgpkL4ZFg569yPtYOur6Pk7_PjhnsubktcZd935OVoNGGru6MnqxLuYx1seqb6OsKdUu6-naMBzPJXkonwFVaeQJ98zbvLUYXErysf9Yq6VKu3XAk2owoRayz/s1600/icon_rss_reader.png'/></a><div style="clear: both;font-size: 9px;text-align:center;">Get <a style="color: #3399BB;" href="http://helplogger.blogspot.com/">widget</a></div><!-- Do not remove this link --> </div> <!-- floating share bar End --></div>

Customization:

• Vertical alignment - Change the value of bottom in code line 3. The code positions the button relative to the bottom of your browser window. To fix the distance even when window is resized, specify the value in px (pixels) instead of %.
• Horizontal alignment - Change the value in red of margin-left. Negative value pushes the button to the left of the main blog column, positive value pushes it to the right. Increase or decrease the value based on your needs.
• Twitter setting - Replace Helplogger with your Twitter username
• Replacing and removing buttons - You can replace existing buttons with your own. Each button is represented by this code: <div class='sbutton'> BUTTON CODE HERE </div>
• RSS Feed - Change the text in blue with the url address of your RSS feed.

Enjoy :)

Posted By Unknown09:47

2

Continue Reading

Expandable Recent Comments Widget For Blogger/Blogspot

This Expandable Recent Comments is a very accessible widget that can be collapsed or expanded through user interaction, so that now, we don't have to click on the commenter or post title link in order to see the content of a comment.

The expanding content can be shown or hidden by clicking on the plus/minus icon or by pressing the "Show all" or "Hide all" button at run time. 

How To Add The Expandable Recent Comments Widget to Blogger

Step 1. Log in to your Blogger dashboard and go to Layout > Click on "Add a Gadget" link

Step 2. From the pop-up window, scroll down and click on the HTML/JavaScript widget

Step 3. Copy and paste this code inside the empty box:

<style type="text/css" media="screen">
.row-aa {        background: #f2f2f3; }
.row-bb {        background: #F8F5F1; }
.row-div { 
  margin:0px;
  padding:5px;
}
.comment-header {
  font-size:0.9em;
//  border:1px solid #E0E0E0;
//  background-color:#F3F3F3;
  padding:4px;
  margin-top:10px;
  margin-bottom:5px;
}
.comment-box {
  margin:0px;
  padding:0px;
  font-size:0.9em;
  height:500px;
  overflow:auto;
}
.comments1  { 
//  background: #F3F3F3;
  padding:3px;
  border-left:1px dashed #A6A6A6;
  color: #888888;
  font-style: italic;
  padding-top:4px;
  margin-bottom:5px;
}
.comment-footer {
  text-align:center;
  font-size:0.9em;
  padding:4px;
  margin-top:5px; 
}
</style>

<div style="text-align: center" class="comment-header"><input class="comment-button" id="commshowall" type="button" onclick="if (this.value == &#39;Show all&#39;) { unfold_all(this); this.value=&#39;Hide all&#39;; } else { fold_all(this); this.value=&#39;Show all&#39;; }" style="width:8em;font-size:1em;font-family:Verdana,sans" value="Show all" /></div>

<div class="comment-box">
<script type="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/expandable-recent-comments.js"></script>
<script type="text/javascript"  src="http://helplogger.blogspot.com/feeds/posts/default?start-index=1&max-results=999999&alt=json-in-script&callback=showrecentposts">
</script>
<script type="text/javascript"  src="http://helplogger.blogspot.com/feeds/comments/default?start-index=1&max-results=999999&alt=json-in-script&callback=showrecentcomments">
</script>

</div>

Note: Replace http://helplogger.blogspot.com with your blog/site address.

Step 4. Save your widget and you're done!

Enjoy :)

Posted By Unknown09:43

3

Continue Reading