Tags: Collections / Widgets

4 Best Social Subscription Widgets for Blogger

- No Comments

Social media plays an important role in building our readership and in generating traffic to our blog. It helps your visitors to easily connect with you on social networks. You can easily notify your visitors about your upcoming posts and notifications, because in this modern era everyone uses social networks for connecting with friends, family and for business too. If you're a blogger then its important for you to increase your social appearance. The best way for increasing your social activity is by using Social Subscription Widgets. Social Subscription widgets are one of the best way for increasing your loyal readers. These widgets are important for increasing your social activity and appearance. We've shared many social subscription widgets and today in this article we're going to share a collection of 4 best social subscription widgets.

4 Best Social Subscription Widgets for Blogger

1- Social Subscription Widget for Blogger

This widget has a clean and stylish design. With its beautiful layout, it shows four icons for your social networks i.e. Facebook, Twitter, Google Plus, RSS and a beautiful Email Subscription box.
Click Here to Install this Widget.

2- Social Subscription Widget V2 for Blogger

This widget has a flat design including flat social media icons and an email subscription box. With its eye catching colors it will surely attract your visitors. Click Here to Install this Widget.

3- Social Subscription Widget V3 for Blogger

Here's another social subscription widget with a simple design. With its simple and clean design, this widget fits in every blog. Click Here to Install this Widget.

4- Flat Social Subscription Widget for Blogger

This is a flat design widget with its eye catching colors and layout, you can use it anywhere you want and due to its flat design this widget will surely make your visitors to click on it. Click Here to Install this Widget.

Which one you liked the most? Share your feedback in the comments section below.

Tags: Widgets

Add a Simple Recent Comments Widget to Blogger

- 283 Comments

Recent comments widget is used to display your recent blog comments in your sidebar or footer. Comments are the most important part of any blog/website. Comments shows the popularity of a blog and also plays an important role in interacting with your visitors. Your visitors can turn over your feedback and can demand you queries using this comments feature. If you want to inspire your visitors by showing your recent comments then the recent comment widget will help you to do this. The Recent Comments Widget will inspire your blog visitors to post a comment on your blog. So, today we are going to share a simple recent comments widget for blogger.

Add a Simple Recent Comments Widget to Blogger

First of all Log in to your Blogger Account >> Select a Blog >> Layout >> Click Add a Gadget and select HTML/JavaScript gadget from the list of gadgets. Now copy the below code and paste it in the HTML/JavaScript Box.

<script type="text/javascript" src="http://yourjavascript.com/1054173112/recentcomment.js"></script><script style=text/javascript >var a_rc=5;var m_rc=false;var n_rc=true;var o_rc=100;</script><script src=http://blogolect.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script><span id=rcw-cr><a href=http://www.blogolect.com/2014/09/add-simple-recent-comments-widget-to-blogger.html>Recent Comments Widget</a></span><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px SOLID; padding-top: 7px!important; padding-bottom: 7px!important;} #rcw-cr {font-family: Arial,Tahoma;font-size:9px;padding-top:7px;display:block;} </style>

Hit the Save button and you're done
Congratulations: You've successfully added a recent comments widget to your blog.

From Editors Desk

We hope this article may have helped you in learning Ho to Add a Simple Recent Comments Widget to Blogger. Share it with your friends and don't forget to subscribe us!

Tags: Widgets

Add Flat Social Subscription Widget to Blogger (Update)

- 4 Comments

Social media plays an important role in building our readership and in generating traffic to our blog. It helps your visitors to easily connect with you on social networks. It helps you in interacting you with your visitors, they can easily ask you questions or you can post all your updates to notify everyone that what you are going to do next. Whatever, social media drives massive traffic to your blog and adding a social subscription buttons to blogger blog is the perfect way for promoting your blog on social media. But you have to choose the right buttons for your blog. Your first priority should always be Facebook, Google+, Twitter, Pinterest and RSS for social subscription widget. All these social networks, play well in circulating your content over a wide range of visitors. So today we're going to share a metro style social subscription widget, this widget contains four buttons i.e. Facebook, Twitter, Google Plus and RSS.

Adding Metro Style Social Widget To Your Blog

Step 1. Go to Blogger Dashboard >> Layout >> Add A Gadget >> And choose HTML/JavaScript From the list of Gadgets
Step 2. Now add the following code in the HTML/JavaScript Box

<div class="metro-social">
<li><a class="fb" href="http://www.facebook.com/USERNAME"></a></li>
<li><a class="tw" href="http://www.twitter.com/USERNAME"></a></li>
<li><a class="gp" href="https://plus.google.com/XXXXXXXXXXXXXXX"></a></li>
<li><a class="fd" href="http://feeds.feedburner.com/FEED ADDRESS"></a></li>
</div>
<style>
/*Metro UI Social Profile Widget v2.0 by Tech Prevue Labs
Web link to gadget code:
Distributed under license CC BY-NC-ND 3.0 INT
Please keep license information intact while using this widget*/
.metro-social{width:285px}
.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}
.metro-social .fb,.tw,.gp,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}
.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}
.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:140px;height:70px}
.metro-social .gp{background:url(//goo.gl/oT0kF) no-repeat center center #da4a38;width:140px;height:69px}
.metro-social .fd{background:url(//goo.gl/ncoLY) no-repeat center center #e9a01c;width:282px;height:69px}
.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}
.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}
.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}
.metro-social li:hover .fd{background:url(//goo.gl/JFGqn) no-repeat center center #e9a01c}
</style>
<br />

Customization:

Replace USERNAME with your Facebook username

Replace USERNAME with your Twitter username

Replace XXXXXXXXXXXXXXX with your Google + profile ID

Replace FEED ADDRESS with your RSS Feed address

Step 3. Hit the Save Template button and you're done

From Editors Desk

We hope this article may have helped you in adding a metro style social subscription widget to your blog. Share this widget with your friends and don't forget to subscribe us!

Tags: Widgets

Add Social Media Icons to Blogger Sidebar

- 4 Comments

Social networks play an important role in building our readership and blog traffic. Social media is a great way for promoting your blog and for increasing your traffic/visitors. If you want to become a successful blogger then it's important to be active on social networks. Social media is the only place where you can easily interact with your visitors. You can use social networks for your blog promotion, blog updates and for blog notifications. But all this will be possible only if there is an option for your visitors to join you on social networks and the solution is to add social media icons widget to your blog. So, today in this tutorial we'll show you that How to Add Social Media Icons to Blogger Sidebar.

Add Social Media Icons to Blogger Sidebar

First and foremost log in to your Blogger Account >> Select a Blog >> Go to Layout >> Add a Gadget and select HTML/JavaScript gadget from the list of Gadgets. Copy (Ctrl + C) the below code and Paste (Ctrl + V) it in the empty widget box

<style>
#sidebar-subscribe-box{width:317px;padding:3px 0}
.sidebar-subscribe-box-wrapper{background:transparent repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:0px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}
a.social-icons{margin-right: 5px;height:50px;width:45px;}
a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);}
</style>

<div id="sidebar-subscribe-box">
<div class="sidebar-subscribe-box-wrapper">
<br/>
<a class="social-icons" href="https://www.facebook.com/blogolect.official"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhGOShQdLPHWwO-T8jDg7tIpoVW0VeO65zXelYlOb8Mvub-UWLQaWady5QZT0qavR4Pi0qgvGvZ-oK4d7yUICwHPt7K8UADOQJgzEgz7Xap7WcYHm-aaB8zegsdBZxyvcxH2vWz_vm9yEE/s1600/facebook.png" /></a>
<a class="social-icons" href="https://www.twitter.com/blogolect"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEidtjNSzVOl__WeddSCCQs7gWowuCP4NMz7bSUADdYn0ariqrJk29AwnyjrEfAwqekZu23VE7GZWkB4dP4cKkt2UAXTES3X99Edm-qVidVt2ZCH90PVfdMhcDqvPtDhzFX_c6GVC9in0tVt/s1600/twitter.png" /></a>
<a class="social-icons" href="https://plus.google.com/+zohaibliaqat"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNb789cQDYx14MrSZxnqbzZv7zS0I3EE7-Y1iA2VJgt4Qajm-h8a6jgaTh8E6ZUx6Asjz3O9yfjD4vofErYeh-5KH93kkFtOQB1nn1Ey_EKoYLgmTzDr8Ih_Yxl7fWLU27jZx_K8g2bNag/s1600/google+.png" /></a>
<a class="social-icons" href="http://feeds.feedburner.com/blogolect"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjma1G8GB031u3T0CgUJ3NVQTl3hHBeTjOtr-ho80V4OCbzcv1ecbPEJqhQQ9go8JqvKX0gZiE2ADZDdPlHVr_d9xR9V8rsxSrUN3vQlsC0WNSwqB6VOY518tNCE04W-u9dPv3VLnuoRIJf/s1600/rss.png" /></a>
<a class="social-icons" href="http://www.pinterest.com/blogolect"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmwGGA4Gwu29HS-DhUSdQSnkXpXrb4AFbyYc9_PzDLQj2BD3yg8nO5RMhlwvPsiOYImeueJ-Yb6giWI18Vw1gHSIrQwzB9oo44Brsob1aIyx0eJ_uS5JWO2Pna_a2SRy8LUoA5nY9tFVmv/s1600/pinterest.png" /></a>
</div></div>

Customization:

Replace https://www.facebook.com/blogolect.official with your Facebook Fan page URL

Replace blogolect with your Twitter Username

Replace https://plus.google.com/+zohaibliaqat with your Google+ Account URL

Replace http://feeds.feedburner.com/blogolect with your RSS feed URL

Replace http://www.pinterest.com/blogolect with your Pinterest Account URL

Hit the Save Button
Congratulations: You've successfully added social media icons to your blogger blog.

From Editors Desk

We hope that this article may have helped you in adding social media icons to your blog. Share this widget with your friends and don't forget to subscribe us!

Tags: Widgets

Add a Beautiful Search Box to Blogger

- 1 Comment

Having a search box on your blog is always recommended. Search Boxes are the most essential element of a blog, allowing your visitors to dig and find content. Search boxes help your readers to search for content that you've published on your blog and to easily get that they're looking for. Search boxes also increase your traffic as your readers will find their desirable content easily by using the search widget.Today we're going to share a beautiful search box for your blogger blog, this search box shows an icon and on clicking it the search box opens with a beautiful transition. So, just follow the below steps to add this widget to your blog. Before adding this widget to your blog, use our HTML Editor tool to see how it looks. Go to HTML Editor tool page >> Paste the widget code in it and press the Preview button.

Add a Beautiful Search Box to Blogger

<style>
.bgt-search-field {
background-color: transparent;
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPekdoJ73mokBQwo5Y0RQbZ7Nh2b80GV3iwFIHxwoucS4Z5F2539ZJFZHhPZliQ8dTCvxNU-nG0CqxYrElOhXZOn9CW2b5H5U2oYmAsWm_dDiQNuQLZKaHrAe4pTGh-tP9G1JvtkNRu5s/s24/search-icon.png);
background-position: 5px center;
background-repeat: no-repeat;
background-size: 24px 24px;
border: 2px solid transparent;
cursor: pointer;
height: 37px;
margin: 3px 0;
padding: 0 0 0 34px;
position: relative;
-webkit-transition: width 500ms ease, background 500ms ease;
transition: width 500ms ease, background 500ms ease;
width: 0;
color: #000;
font-family: trebect;
font-weight: bold;
}
.bgt-search-field:focus {
background-color: #2aa4cf;
border: 2px solid #2aa4cf;
cursor: text;
outline: 0;
width: 290px;
</style>
<form action='/search' id='search' method='get'>
<input class='bgt-search-field' name='q' placeholder='Search this Website...' title='Click to Search!' type='text'/>
</form>

Hit the Save Button
Congratulations: You've successfully added this search box to your blog.

From Editors Desk

We hope that this article may have helped you in adding a beautiful search box to your blog. Share this widget with your friends and don't forget to subscribe us!

Tags: Widgets

5 Important Blogger Widgets Everyone Must Use

- 10 Comments

Widgets and plugins play a great a role in our blog design and development. Only template is not necessary for a blog, widgets are also part of our blog for making our blog more functional and user friendly. There are hundreds of widgets available on the web such as popular posts widget, email subscription boxes, social sharing widgets, recent posts widget etc. Each widget plays its own role and has its own benefits. But there are some important widgets and i think that without those widgets you can't increase your appearance and traffic. So, below I'm going to share those widgets which are important and everyone must use.

Email Subscription Box/Widgets

Almost every blogger knows the importance of Email Subscription widget. Email subscription boxes are the best way to collect your visitors/readers and provide them your latest updates directly to their inbox. There are many email subscription widgets you can use. That can be implement in header, sidebar and below/above posts to attract more subscribers.
Email Subscription Widgets by Blogolect:
Simple Flat UI Email Subscription Widget for Blogger
Flat UI Email Subscription Box For Blogger
Simple Email Subscription Widget
Simple Email Subscription Form V2 Widget For Blogger
Email Subscription Widget V3 for Blogger
RSS Email Subscription Form Widget For Blogger

Social Subscription Widgets

Social Subscription widgets are one of the best way for increasing your loyal readers. These widgets are important for increasing your social activity. These widgets help people to connect with you on social networks. So, it's important to implement social subscription widget to your blog.
Social Subscription Widgets by Blogolect:
Social Subscription Widget For Blogger
Add Metro Style Social Widget In Blogger
How To Add Social Subscription Widget In Blogger
Social Subscription Widget V2 For Blogger
Email Subscription Widget V3 for Blogger

Social Sharing Widgets

Social media is a critical factor for the success or failure of your blog. You can boost up your visitors with the help of social media. You can make your blog successful by using social networks like Facebook, twitter and Google +. Here comes the concept of social sharing buttons. You might have seen social sharing buttons of different styles on many blogs. These social sharing buttons are very important for a blog. With the help of these buttons your visitors can easily share your great content on their profiles and this will also help you to increase your blog traffic.
Social Sharing Widgets by Blogolect:
Add AddThis Floating Share Buttons to Blogger
How To Add Floating Social Media Sharing Buttons To Blogger
5 Websites for Adding Social Sharing Buttons to your Blog

Search Box

Having a search box on your blog is always recommended. Search Boxes are the most essential element of a blog, allowing your visitors to dig and find contents. Search boxes allow your visitors search for the content that they are looking for. Basically search boxes are just like search engines that searches for the content that you've published on your blog and having a search form on your blog can save readers a bunch of time.
Search Boxes by Blogolect:
Add 9 Beautiful Search Boxes to Blogger
How to Add Google Custom Search Engine to Blogger
Add a Simple Search Box Widget to Blogger

Displaying related posts is a smart way for keeping your blog visitors around. When someone reads your article and after completing he might leave your blog directly but what if we bring him on another blog post, then related posts widget is the best way. Related posts widget display related posts for the particular user and keeps you visitors around.
Related Posts Widget by Blogolect:
Related Posts Widget with Thumbnails and Summary for Blogger

From Editors Desk

We hope that this collection may have helped you in choosing some important and useful widgets for your blog. Share this collection with your friends and don't forget to subscribe us by email. Enjoy Blogging :)

Tags: Widgets

How to Add Google Custom Search Engine to Blogger

- 41 Comments

Today we're going to discuss about Adding Google Custom Search Engine to Blogger. Most of the blogger templates comes with built-in search boxes and you might have observed that these boxes are incapable of displaying relevant results because their factor of finding results is not good. The reason is that those searching widgets doesn't searches the whole blog(each and every word) they work on the basis of post titles. The best solution is to use Google Custom Search Engines (CSE) that are extremely efficient in digging in to your posts and displaying it to your visitors. If your website has thousands of pages with huge data and you find it difficult to set the perfect navigation then the Custom Search Engines is the best way that will help your visitors to navigate easily just by searching the article that they are looking for. Furthermore you can easily integrate your Google AdSense Ads to your Google custom search box, which will increase your revenue for every click made on the search results. Google Custom Search also provides you an option to customize your search box, even you can change the layout of search results and more. So let's create and install Google Search Boxes for your Blog.

How to Add Google Custom Search Engine to Blogger

First and foremost go to https://www.google.com/cse/ and click Create a custom search engine button. Enter your Blog Address in "Sites to Search" field, pick up a Search engine name and hit the Create button.

Now click on Get Code button, a code will appear copy that code and go to your Blogger Dashboard >> Layout >> Add a Gadget >> Select HTML/JavaScript gadget from the list of gadgets >> Paste that code in the empty widget box and hit the Save button.

You can also customize the look of your search box to customize your search box click Edit Search Engine >> Look and Feel and choose your layout, themes and thumbnails style.

Congratulations: You've successfully added your custom search engine to blogger.

From Editors Desk

We hope this tutorial may have helped you in learning How to Add Google Custom Search Engine to Blogger. Share this post with your friends and don't forget to subscribe us.

Tags: Blogger Tricks / Plugins / Widgets

Add Pinterest Pin It Official Image Hover Button to Blogger

- 7 Comments

If you're a blogger, you might have noticed the "Pin It" buttons that appears on mouseover. Pinning an image is now easier due to these buttons. These hover buttons make it easy for your blog visitors to pin your image to their Pinterest boards.When you move your mouse cursor over an image on a blog, a Pinterest logo pops up with a Pin It text prompting you to “Pin” the image to your Pinterest boards. The person who pressed the Pin It button can now see that image on their dashboard and it also link back to your blog. I find pinterest a great way for generating traffic to my blog and i also recommend you to add this button to your blog. Pinterest has its own official "Pin it" hover button which you can add to your blog/website and today in this tutorial we'll show you that How to Add Pinterest Pin It Official Image Hover Button to Blogger.

Add Pinterest Pin It Official Button to Blogger

How to Add Pinterest Pin It Official Image Hover Button to Blogger

First and foremost log in to your Blogger Account >> Select a Blog >> Template and click Edit HTML. Click inside the template code area and use Ctrl+F to search a code and search for the following tag.

</body>

Now copy (Ctrl+C) the below script and paste (Ctrl+V) it just above/before the </body> tag

<script type="text/javascript" data-pin-hover="true" src="//assets.pinterest.com/js/pinit.js"></script>

Hit the Save Template button and you're done.

From Editors Desk

We hope this tutorial may have helped you in learning How to Add Pinterest Pin It Official Image Hover Button to Blogger. Share this post with your friends and don't forget to subscribe us.