MatrixAdapt | Logiciel de gestion d'Entreprise, Création et référencement des sites web

seo Google +1 button and Badge for Blogger 2013

Seo Master present to you:

Google's new GPlus +1 button for blogger,that lets to share your blog with like minded people across the world. Blogger introduces two Google+ gadgets (+1 Button and Google+ Badge) .Google+ button is almost same as Facebook Like button.Unlike the Google+ button appears below the post,the gadget is specific to your blog.Google+ gadget allows your visitors to recommend your blog and able to share on their circles.
Here i am going to show how to add this gadgets..

Sig in to your Blogger
Go to Layout and click Add Gadget

Take +1 button or Google+ Badge as you need
If you take Google+ badge give page ID

Thats all....

2013, By: Seo Master

seo How To Add Google+ Comments Widget To Blogger 2013

Seo Master present to you:

Blogger has recently introduced Google+ Comments for Blogs.As Facebook had released Facebook Comment Box for Bloggers,contrary Google+ has also introduced new comments widget i.e Google+ Comment Widget For Blogger.Actually Comments helps you to inspire the new entries of your blog.As far Comment is Consider we can called it half meeting with your Blog readers.However Google has just made few improvement for Bloggers i.e now you can simply add your Google+ Comment widget to Blogger.And the most amazing thing is that we can enable this widget from Our Blog Dashboard,Once it is enabled then enjoy different comments from users.

Features Of Google+ Comments Widget

As the Author of the Blog or Admin of the Blog you will receive visitors Comments
Comments can be done by those who has Google+ Profile or Page
It is very easy to navigate and friendly Comment widget
When someone comments on the shared link(i.e from Google+) this widget will fetch that Data(comments) and will show it in Blogger Comments Area.

How To Add Google Plus Comments Widget To Blogger

Go To Blogger.com
Sign in to your Blogger Account
Now Click On Google+ (at the right side)
Now a Another page will appear,there select "use Google+ Comments on this Blog",it will be as shown in the below screen shot

And that's it
Enjoy Google+ Comment Widget in Your Blog

Note:-

It will show this Option in those Blogs which Email Address is attached to the specific blog.In simple words it will work with the blog which you own and you have to full access of your blog and email address.

How To Remove Google+ Comments Widget To Blogger

Actually i applied this Comment widget,but it is not as interesting as the blogger old One Comments Default widget.So i removed it,Now how to remove this its very simple follow the below steps.

Go To Blogger Dashboard
Now Click On Google+ at the right side
Now Unchecked "use Google+ Comments on this Blog",it will looks like as shown in the below screen shot

So What's Up:- Did You Like the New Widget ? How was the Article ? Feel free to ask any question,Stay Blessed,Happy Blogging :)

2013, By: Seo Master

seo How To Add Related Posts Widget With Thumbnails To Blogger 2013

Seo Master present to you:

Time to boost your blog page-views,here is incredible hack via which you can show the related posts to blog article below every Blog post,along with beautiful thumbnails.The data for related posts are fetched from Blog Labels and different posts.Applying this hack will help you to host your visitors with great luxury,as a result he will remain long time on your blog seeing different interesting related articles.

Live Demo

How To Add Related Posts Widget With Thumbnails To Blogger

Go To Blogger Dashboard
Click On template and Then Click On edit HTML
Now Search for </head> Tag
Now Copy the below script and paste it above </head> Tag

<b:if cond='data:blog.pageType == "item"'> <style type='text/css'> #related-posts { float:center; text-transform:none; height:100%; min-height:100%; padding-top:5px; padding-left:5px; } #related-posts h2{ font-size: 18px; letter-spacing: 2px; font-weight: bold; text-transform: none; color: #5D5D5D; font-family: Arial Narrow; margin-bottom: 0.75em; margin-top: 0em; padding-top: 0em; } #related-posts a{ border-right: 1px dotted #DDDDDD; color:#5D5D5D; } #related-posts a:hover{ color:black; background-color:#EDEDEF; } </style> <script type='text/javascript'> var defaultnoimage="http://www.matrixar.com/-PpjfsStySz0/UF91FE7rxfI/AAAAAAAACl8/092MmUHSFQ0/s1600/no_image.jpg"; var maxresults=4; var splittercolor="#DDDDDD"; var relatedpoststitle="Related Posts"; </script> <script src='http://helplogger.googlecode.com/svn/trunk/related-posts-with-big-thumbnails.js' type='text/javascript'/> </b:if>

Note :-
- If you want to change the Default Picture to your own or any other picture,then simply replace the Green URL With your Own image URL.
-For Displaying more than 4 posts in the widget then change the value of 4 in the script to desired no of posts.
-If you want to display this widget also in Home Page then remove the Blue script from the above script

Now Search for The below Script (Note The Below mentioned Code is 2 times in magazine style Blogger Templates so do paste the below Code after each.)

<div class='post-footer'>

Now Copy the below script and paste it above <div class='post-footer'>

<b:if cond='data:blog.pageType == "item"'> <div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != "true"'> </b:if> <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels_thumbs&max-results=4"' type='text/javascript'/></b:loop> <script type='text/javascript'> removeRelatedDuplicates_thumbs(); printRelatedLabels_thumbs("<data:post.url/>"); </script> </div><div style='clear:both'/> </b:if> <b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'> <a href='http://www.matrixar.com'><img alt='Blogger Tricks' src='http://www.matrixar.com/-K65p5zLLKQk/T3ObCINoP7I/AAAAAAAABmI/dF84-alnOu4/s1600/best+blogger+tips.png'/></a> </b:if></b:if>

Note:-
-For Displaying more than 4 posts in the widget then change the value of 4 in the script to desired no of posts.
-If you want to display this widget also in Home Page then remove the Blue script from the above script.

Now just hit save template and that's it

So What's Up

Adding Related Posts Widget With Thumbnails To Blogger will help you to boost your Blog page-views,actually this post is originally written by HelpLogger,So Script Credit Goes to HelpLogger.If you have any question related this article,must pass comments.Stay Blessed,Happy Blogging.

2013, By: Seo Master

seo Recent/Latest Posts Widget For Blogger/Blogspot 2013

Seo Master present to you:

You surely have seen on many blogs and websites a Recent Posts Widget in the sidebar that shows the recent or newest or latest posts of the certain blog or website. This widget shows the posts title, date of post and an image of the post and even a snippet of the post. So today we are going to learn how to make this widget for your blog with some very easy steps. So let's start now.

How to add Recent Posts Widget to Blogger

Step 1. Log in to your Blogger Dashboard, then go to Layout and click on Add a Gadget link

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

Step 3. Select & Copy the code from one of the options below and paste it into the new HTML/JavaScript:

Option 1: Recent posts widget with snippets

<div id="hlrpsa">
<script src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-snippets.js">
</script>
<script>
var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true;
</script>
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts">
</script></div>
<div id="rpdr" style="font-family: arial, sans-serif; font-size: 9px;">
<a href="http://www.matrixar.com/2013/04/recent-latest-posts-widget-for-blogger-blogspot.html" target="_blank" title="Grab this Recent Posts Widget" alt="Recent Posts Widget for blogger">Recent Posts Widget</a> by <a href="http://www.matrixar.com" title="Recent Posts Widget"
alt="Blogger and SEO Tips and tricks">Blogger Widgets</a></div><noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
#hlrpsa a {color: #0B3861; font-size: 13px;} #rpdr {background: url(http://www.matrixar.com/-WM-QlPmHc6Y/T5wJV58qj9I/AAAAAAAACAk/1kULxdNyEyg/s1600/blogger.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
#hlrpsa { color: #999999; font-size: 11px; border-bottom:1px #cccccc dotted; margin-top:-10px; padding-bottom:10px;}
.hlrps a {font-weight:bold; }
.hlrpssumm {}
</style>

Option 2: Recent Posts Widget Showing Post Titles Only

<div id="hlrpsb">
<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-titles-only.js"></script>
<script style="text/javascript">var numposts = 10;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
<div id="rpdr" style="font-family: arial, sans-serif; font-size: 9px;">
<a href="http://www.matrixar.com/2013/04/recent-latest-posts-widget-for-blogger-blogspot.html" target="_blank" title="Grab this Recent Posts Widget" alt="Recent Posts Widget for blogger">Recent Posts Widget</a> by <a href="http://www.matrixar.com" title="Recent Posts Widget"
alt="Blogger and SEO Tips and tricks">Blogger Widgets</a></div><noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#hlrpsb a {color: #0B3861; font-size: 13px;} #rpdr {background: url( http://www.matrixar.com/-WM-QlPmHc6Y/T5wJV58qj9I/AAAAAAAACAk/1kULxdNyEyg/s1600/blogger.png ) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
.bbrecpost2 {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }
</style>

Step 4.

Change 5 (option 1) and 10 (option 2) with the number of posts you want to display.
Change false to true if you want the posts dates to appear
Change 100 (option 1) if you want more characters to be displayed.
To change the color and font size of the links, modify the values in blue (links) and violet (font-size)
To change the style of posts summary, modify the values in green (color) and orange (font size)
Replace the your-blog text with the name of your blog or if you have a custom domain change all the bolded line with your address.

Step 5. Save your widget. And that's it! Enjoy!

If you need any help, leave a comment below.

And if you liked this post, please consider sharing it. Thanks.

2013, By: Seo Master

seo How To Add Facebook Comment Box To Blogger 2013

Seo Master present to you:

Adding Facebook Comment Box To Blogger Blogs is very Old trick,but recently one of our Blog visitors asked for this Comment Box.In this regard here is a Facebook Comment Box,Actually there are many users who don't have Blogger Accounts,therefore they can comment on your blog articles via Facebook Comments Box.Now time to install Facebook Comment Box To Blogger,its installation is very simple,you may have seen many articles in which first you have to create an App in Facebook after that many steps are required,but this article is not as difficult as other articles.

Live Demo

How To Add Facebook Comment Box To Blogger

For installing this widget to Blogger,you just have to copy a code and then add it to Blogger layout Section,follow the below steps.

Go To Blogger.com
Sign in there
And Now Click On Layout
After that Click On Add a Gadget
A Box will Popup Select "HTML/JavaScript"
Now Copy the Below Script and Paste it into the Box

<script>(function(d){
var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));</script>
<div class="fb-comments" data-href="http://thatsblogginglab2.blogspot.com/" data-num-posts="10" data-width="500"></div>

Place the Widget/Gadget Below "Blog Posts" Section ( as shown Below )

Changes in the Script Before pasting to HTML/JavaScript Box

Before Pasting Script to HTML/JavaScript Box,must change/replace "http://thatsblogginglab2.blogspot.com/" with your Blog URL/Address,then Just click on save and that's it.

So What's Up:- Did You Like This Comment Box?Is it useful For Blogger Blogs?How was the Tutorial? Share your Awesome ideas with us.Stay Blessed,Happy Blogging.

How To Add Facebook Comment Box To Blogger
Last Reviewed by Iftikhar uddinon June 24 2013
Rating: 5

2013, By: Seo Master

seo Recent Comments Widget With Avatars For Blogger 2013

Seo Master present to you:

Recent Comments Widget with Avatars is another awesome style Comments widget,which shows the latest comments of the visitors along with round Avatars.It also shows a lil bit summary of the commenter. Actually we have posted an article which is Beautiful Recent Comments Widget For Blogger , that widget is also awesome,but the main problem with that widget is that is not showing Avatar or Profile Picture with Comments,However This Widget will show a beautiful Profile Picture or Avatar along with name and Comments.This Widget is usually placed at the footer of the blog,however you can place it in sidebar or any where in your blog.

How To Add Recent Comments Widget With Avatars To Blogger

Go To Blogger Dashboard >> Then Click On layout >> And Then Click On Add a gadget

Now a Box will popup,select HTML/JavaScript

Now Copy the below Code/Script and add it into the HTML/JavaScript Box.

<style type="text/css"> ul.w2b_recent_comments { list-style: none; margin: 0; padding: 0; } .w2b_recent_comments li { background: none !important; margin: 0 0 6px !important; padding: 0 0 6px 0 !important; display: block; clear: both; overflow: hidden; list-style: none; } .w2b_recent_comments li .avatarImage { padding: 3px; background: #fefefe; -webkit-box-shadow: 0 1px 1px #ccc; -moz-box-shadow: 0 1px 1px #ccc; box-shadow: 0 1px 1px #ccc; float: left; margin: 0 6px 0 0; position: relative; overflow: hidden; } .avatarRound { -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; } .w2b_recent_comments li img { padding: 0px; position: relative; overflow: hidden; display: block; } .w2b_recent_comments li span { margin-top: 4px; color: #666; display: block; font-size: 12px; font-style: italic; line-height: 1.4; } </style> <script type="text/javascript"> //<![CDATA[ // Recent Comments Settings var numComments = 6, showAvatar = true, avatarSize = 60, roundAvatar = true, characters = 40, showMorelink = false, moreLinktext = "More »", defaultAvatar = "http://www.gravatar.com/avatar/?d=mm", hideCredits = true; //]]> </script> <script type="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/w2b recent comments with avatars.js"></script> <script type="text/javascript" src="http://Blog-URL.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=6"></script>

Changes in Code Before pasting into HTML/JavaScript Box

#1) Replace/Change Blog-URL with your Own Blog URL (e.g www.matrixar.com)

#2) Replace 6 in the Code with the number of comments you want to show on the widget.

#3) If you are interested in changing the anonymous avatar, then replace "http://www.gravatar.com/avatar/?d=mm" with your own image URL.

#4) If you want to change the Avatar Size,Replace 60 with your own desired value.

#5) Now Copy the edited Code and paste in the HTML/JavaScript Box and that's it.

So What's Up:- Recent Comments Widget With Avatars is really a cute widget,i hope you liked it,must pass your views,and ask any question free.Stay Blessed,Have a nice Day,Happy Blogging.

The Code Credit Goes to @Helplogger and Harish(Way2Blogging)

2013, By: Seo Master

seo How To Remove Attribution Gadget From Blogger 2013

Seo Master present to you:

No one want this shit on his/her blog.Actually this is a gadget which is in the Footer of the template,usually looks like this "Powered By Blogger".If you ever have tried to remove this gadget from a blog,it will say the gadget is locked,means you can,t remove this gadget from Blogger Blogs.So Now if you want to unlock this gadget and want to remove,here is a trick via which we can easily remove this Gadget from any Blog.

How To Remove Attribution Gadget From Blogger

Now let's apply this trick,this trick will unlock the attribution Gadget then you can easily remove from your blog.Follow the below steps for Removing Powered By Blogger from Blogger.

Go To Blogger Dashboard
Now Click On Template and Then Click On Edit HTML

Now Check the small Box "Expand widgets Templates"

Now Search for The Below Code (CTRL+F)

<b:widget id='Attribution1' locked='true' title='' type='Attribution'>

Now Replace/Change the "True" with "False"
Now Just take a preview and hit save Template.

The Attribution Gadget is unlocked now time to remove the gadget,so let's learn how to remove this Gadget from blogger layout .

Steps for Removing Attribution Gadget

Visit Blogger Dashboard
And Click On Layout
Now Search for Attribution Gadget in layout.

Now Click On Edit
Now a Box will popup as shown below >> Click On Remove and that's it

So What's Up:- Do You Like Attribution Gadget on Your Blog? Are you Hell Bore of this Gadget?How Was the Trick?Share your ideas with us,and feel free to ask any Question,we are here to answer you.Stay Blessed,Happy Blogging.

2013, By: Seo Master

seo Top 5 Cool Free Blogger Widgets 2013 2013

Seo Master present to you:

Blogger Widgets:- Now-a-days without widgets a Blog/Website is looking dumb.Actually these Blogger Widgets helps the visitors to navigate the contents of any blog easily or Blogger widgets can help the Admin to increase his Facebook Page Likes or Twitter Followers or Google+ Circles.Likewise there are so many widgets which really help the bloggers to grow up his/her network.You may have observe that WordPress provides a huge amount of Best WordPress Plugins,but blogger is little bit slow in this matter.However we have collected Top 5 Cool Free Blogger Widgets 2013,which you must put/install on your Blog/Website.The features and installation of these widgets are listed one by one below.

Top 5 Cool Blogger Widgets 2013

Actually there are many Blogger widgets,and day by day more widgets are coming to blogging world.As we know that a Coin has two sides,likewise adding Blogger widgets helps you in many problems and issues,but on other side too many JavaScript Widgets will increase your Blog Loading Speed.And as a result you can loose a huge amount of traffic.But what i have collected is to simple and clean widgets,these widgets will not effect your Blog Loading Speed.

#1) Floating Vertical Bar with share buttons Widget For Blogger

Add Floating Vertical Bar With Share Buttons To Blogger

image Source Making Different

You may come across many blogs where a vertical floating bar with share button is present at the left side or right of the blog posts.This Floating Vertical Bar is actually a blogger widget which helps the blogger to get more Facebook page likes,twitter tweets,and stumbles etc.This widget is very useful for visitors to easily share your blog/website contents.This widget is already posted by many bloggers but actually that is static or something else,but the widget we are going to share is Floating Vertical Bar with The Beautiful Share Buttons.If you are interested in adding this floating Vertical Bar Then Visit the below link.

How To Add Floating Vertical Bar with Share Buttons To Blogger

#2) Beautiful E-mail Subscription Widget for Blogger

For keeping your blog readers update you must provide a source through which they get the useful posts of your blog , in this regard we are going to share an Email Subscription Form which will help you to keep your blog readers update,for adding this email subscription to blogger follow the below easy steps , by adding this widget latest updates of your blog will reach to the interested visitors.If You are interested in adding this Subscription Widget then visit the below link.

How To Add Beautiful Email Subscription Widget To Blogger

#3) Facebook Popup Like Box For Blogger

Facebook Popout Like Box is a new version of FB Like Box for Bloggers,this box will help you to get Facebook Page likes , the likes can be for your website/blog page or any other page.We should not underestimate the Social Media , in which Facebook is at the top , therefore get more likes for your Facebook page and get high traffic from your Facebook Pages , in this regard a New Facebook Popout Like Box Version 2 has been released which will solve your traffic problem,this is very stylish Like Box , you can add this Like Box to any side of your Blog/Website .Whenever someone move mouse on it , it will pops up .If You are ready to add this widget so visit the below given link.

How To Add Facebook Popup Like Box V2 To Blogger

#4) Recent Comments Widget For Blogger

Beautiful Recent Comments Widget : We have found a new beautiful Comments widget which will help update you about new recent comments on your Blog/Website Contents/articles.This widget is very simple and clean Blogger Widget,it will not effect your blog loading speed.This recent comments widget will be at the blog sidebar.This widget will surely show the last comments along with the title of the post,Now if you want to add this widget,visit the below link .

How To Add Recent Comments Widget To Blogger

#5) WIKIPEDIA SEARCH BOX WIDGET FOR BLOGGER

I just get bore of search boxes,you may have seen many search boxes,but recently Blogger has introduce a Beautiful Wikipedia Search Box for Blogs.Actually this Search Box will help the visitors to easily search any related contents or any idea in his/her mind.This search box is actually the Wikipedia Search Box,and as we all know that Wikipedia is an ocean of Knowledge,so One can get alot of knowledge.This search box will help your blog visitors to easily search Wikipedia articles without leaving your blog/website.I will suggest this widget for informative blogs or blog related to knowledge etc .However you can add this widget any where in the blog.If you want to add this widget to your Blog visit the below link.

How To Add Wikipedia Search Box widget to Blogger

So What's up:- These were some widgets which we have collected for you.If you have liked any one of them must share with us or if you have any question in your mind,so feel free to ask,we are here to answer you.Stay Blessed,Happy Blogging :).

Top 5 Cool Free Blogger Widgets 2013
Last Reviewed by Iftikhar uddinon June 24 2013
Rating: 5

2013, By: Seo Master

seo Beautiful Recent Comments Widget For Blogger 2013

Seo Master present to you:

Beautiful Recent Comments Widget : We have found a new beautiful Comments widget which will help update you about new recent comments on your Blog/Website Contents/articles.This widget is very simple and clean Blogger Widget,it will not effect your blog loading speed.This recent comments widget will be at the blog sidebar.This widget will surely show the last comments along with the title of the post.So if you are interested in adding this widget follow the below easy steps.

Live Demo of Recent Comments Widget

Live Demo

How to add Beautiful Recent Comments Widget To Blogger

Adding recent comment widget will help you to encourage your visitors to leave comments on your blog contents.Adding this Widget is very easy,you just have to copy a snippet of JavaScript and add into the layout section.

Go to Blogger.com
Sign in there and visit Blogger Dashboard.
Now Click On Layout and the click on add a widget/gadget ( as shown below in the picture).

Now When you click on Add a Gadget a box will popup Select HTML/JavaScript from that Box(as Shown)

Now Copy the below Code/Script and replace "Blog-Link" With your Own Blog URL and paste it into HTML/JavaScript Box.

<script style=text/javascript src="http://helplogger.googlecode.com/svn/trunk/recent comments widget.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=Blog-Link/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script><span id=rcw-cr><a href=http://www.matrixar.com>Recent Comments Widget</a></span><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;} #rcw-cr {font-family: Arial,Tahoma;font-size:9px;padding-top:7px;display:block;} </style>

Script Credit Goes to HelpLogger

Now Just hit save and that's it :)

So What's Up:- Recent Comments Widget is a beautiful Blogger widget,actually it will show the latest comments on your blog articles.This widget is very clean and simple,i hope you will love it,If you have any question,so just ask it we are here to answer you :),stay blessed,Happy Blogging .

2013, By: Seo Master

seo Wikipedia Search Box Widget For Blogger 2013

Seo Master present to you:

image Source

How To Add Wikipedia Search Box Widget To Blogger

Adding Wikipedia Search Box is very easy,you have to add a widget from Blog Layout Section and that's it so let's see how to do this.

Sign in to your blogger account
Now Click On layout
Now Click On Add a Gadget/Widget
A Box will pop up
Now take a look at the right most side
Click On more Gadgets Option
Now You will see many widgets but the Wikipedia Search Box will be at the top ( As Shown below)

Now Just Click on the + Sign and that's it,your widget has successfully added.
Now Take a look on your blog you will see Wikipedia search Box.
Now If you type something for search it will seems as below picture

So What's Up:- Did you Like this Widget?How is its Look on Blog?It will help you visitors to Search Easily?Share your beautiful ideas with us :) Stay Blessed , Happy Blogging.

2013, By: Seo Master

seo Add Floating Vertical Bar With Share Buttons To Blogger 2013

Seo Master present to you:

You may come across many blogs where a vertical floating bar with share button is present at the left side or right of the blog posts.This Floating Vertical Bar is actually a blogger widget which helps the blogger to get more Facebook page likes,twitter tweets,and stumbles etc.This widget is very useful for visitors to easily share your blog/website contents.This widget is already posted by many bloggers but actually that is static or something else,but the widget we are going to share is Floating Vertical Bar with The Beautiful Share Buttons.

image Source Making Different

How To Add Floating Vertical Bar With Share Buttons To Blogger

Adding Vertical Floating Bar with Social Buttons To Blogger is very easy.You have to Copy a snippet of Code,and then you should have to add it into the HTML/JavaScript Box.However let's take a look on these steps.

Visit Blogger.com and sign in there.
Now Visit Blogger Dashboard.
Click On Layout
Now Click On Add a Widget/Gadget
Now a Box will popup
Select HTML/JavaScript
Now Copy the Below Script and paste it into HTML/JavaScript Box.

<a href='http://www.matrixar.com'><img alt='Floating Vertical Bar With Share Buttons widget by ThatsBlogging' src='http://www.matrixar.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><div class="addthis_bar addthis_bar_vertical addthis_bar_large" style="background:#98A2A7; border: 1px solid #000000; top:120px;left:50px;"> <div class="addthis_toolbox addthis_default_style"> <span><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a></span> <span><a class="addthis_button_tweet" tw:count="vertical"></a></span> <span><a class="addthis_button_google_plusone" g:plusone:size="tall"></a></span> <span><a class="addthis_counter"></a></span> </div> </div> <script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js"></script>

Now hit save and that's it !

Live Demo Of Vertical Bar with Social Share Buttons

Live Demo

Tip For Bloggers:- Adding To many JavaScript Widgets will surely make your website/blog speed slow,so be careful,don,t add extra and useless JavaScript widgets To You Blog.Some Blogger just want to decorate his/her blog like bride.But actually its a great foolishness,because simplicity its self is beauty :)

What's Up:- You Add This To your Blog?You Already added this?You don,t want to add this to Your Blog?Any Question Related this Post?Ask Freely ,stay blessed,Happy Blogging.

Add Floating Vertical Bar With Share Buttons To Blogger
Last Reviewed by Iftikhar uddinon June 24 2013
Rating: 5

2013, By: Seo Master

seo Add Facebook Send Button To Blogger 2013 2013

Seo Master present to you:

Whenever Bloggers post an article they want to spread that article like fire in the forest,the question is why the Do this?Because the more you get the views of the article the more popular your blog will be?And if you have a relationship with AdSense then it will help you to LOW the Page CTR.However due to high page-views your blog Alexa and Search result increases.On this purpose i am going to share Facebook Send button which will surely help your blog visitors to easily share any article of your Blog To Facebook.

Live Demo For Facebook Send Button

LIVE DEMO

Check The Send Button Below The Live Streaming.

How To Add Facebook Send Button To Blogger

Installing Facebook Send Button is very easy,you just need to copy the below script and paste it before the below mentioned tag.

Sign in to your Blogger Account
Visit the Dashboard
Now Click On Template(Shown below)

Edit HTML
Now Proceed it
Check the Small Box "Expand Widget Templates"
Now Search For This Code <data:post.body/> by pressing CTRL+F.
Now Copy the below Script .

<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-send" expr:data-href="data:blog.url"></div>

Now You have two Choices i.e where you want to add Facebook Send Button ? Either Above The Post or below the Post.

Adding Facebook Send Button Above The Blogger Post

For Adding the Send button above the Blogger Post Copy the above Script and paste it above <data:post.body/>.And hit save Template,that's it :)

Adding Facebook Send Button Below The Blogger Post

Now For Adding the Send Button Below the Blogger Post Copy the Above Code and paste it after <data:post.body/> , and hit save template that's it :)

Note:- Before Pasting Code into Template must take backup of your template(if you can,t take backup of Template Read This Article) .In Magazine Blogger Templates <data:post.body/> is present 2 or 3 times so paste the above code 2 and 3 times.

Conclusion

So What's Up? This was all about adding facebook send button to Blogger , if you have any funny question ask freely , we are here to answer you :)

2013, By: Seo Master

seo How To Add Facebook Like Box To Blogger 2013 2013

Seo Master present to you:

Adding Facebook Like Box to Blogger is a new trend of bloggers,which helps them in getting a huge amount of traffic from the popular social network called Facebook.Facebook provides the "page feature" for users which is the main source to develop a healthy relationship with blog readers.Facebook Page also helps to give updates to the regular visitors and lovers of your Blog.However in this regard blogger comes with a Like Box , through which you can get Facebook Page likes.This Like Box is little bit different from other Like Boxes.We have already posted a Popup Facebook Like Box,but this one box is static and new one hope you will like it , its installation is also very easy.

LIVE DEMO OF FACEBOOK LIKE BOX

LIVE DEMO

How To Add Facebook Like Box To Blogger

Installing this Like Box is very simple , you have to add a simple script into HTML/JavaScript Box.

Go To Blogger Dashboard.
Now Click On Layout.
After that Click On Add a Gadget.
A Box will popup Select HTML/JavaScript.
Now Copy the Below Script and paste it in HTML/JavaScript Box.

<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/Thatsblogging&width=300&height=248&colorscheme=light&show_faces=true&border_color&stream=false&header=false&" style="border:none; overflow:hidden; width:300px; height:248px;" ></iframe>

Now just hit Save and that's it !

Changing in the Script/Code

Before pasting the script into the HTML/JavaScript box replace the username of Facebook page to your Own Facebook page User name i.e"ThatsBlogging".Another thing if you want to change the width or height of the Like Box,it can be done easily,just change the values of width and height as indicated with red i.e 300 and 248.Now Copy and paste it in the HTML/JavaScript Box , stay Blessed ,HAPPY Blogging.

Don,t be a lazy bum,if you have any question just type in the comment box and also post it :) We are here to help you.

2013, By: Seo Master

seo Add Facebook Popout Like Box To Blogger 2013

Seo Master present to you:

Live Demo

How To Add Facebook Popup Like Box To Blogger

Before installing/adding Facebook Popup Like Box to your Blog , you must already install the jQuery Plugin to your blog template , if you have not added that plugin follow the below easy steps to add.

Sign in to your Blogger Account
Go To Blogger Dashboard , there click on template after that Click on Edit HTML , then Proceed it , Check the Small Box "Expand Widgets Template" after that Search for </head> tag.
Now Copy the below Script and paste below/under </head> Tag

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

The Plugin is installed , now lets add the Like Box
Again Go to Blogger Dashboard
Click On Layout
Add a Widget and Select HTML/JavaScript
A Box will popup , now Copy the below script/code and paste it in the box.

<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}
.fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("http://www.matrixar.com/-MaW4PTF8Qkc/T13eWvP_ZoI/AAAAAAAABc8/ZCYfPlB1jug/s1600/w2b_vertical-left.png");background-repeat: no-repeat;overflow: hidden;-webkit-border-top-right-radius: 8px;-webkit-border-bottom-right-radius: 8px;-moz-border-radius-topright: 8px;-moz-border-radius-bottomright: 8px;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2b){
w2b(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2b("#fbplikebox").css({left: -250, "top" : 100 })
w2b("#fbplikebox").hover(function () {
w2b(this).stop().animate({
left: 0
}, $dur);
}, function () {
w2b(this).stop().animate({
left: -250
}, $dur);
});
w2b("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div class="fbplbadge"></div>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2Fthatsblogging&width=250&height=250&colorscheme=light&show_faces=true&border_color=%23C4C4C4&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:250px;background:#F5EBF5;" allowtransparency="true"></iframe>
</div>

Change The Page Username in the Script to your Own Page Username i.e "ThatsBlogging".

You Can Change the width and height of the box (the width and height is clearly indicated by red text i.e 250 ".

Now hit Save and that's it !

Still Confuse ? Feel Free to ask any question , we will anwser you !

Actually the script is coded by Way2Blogging.com , all credit goes to W2B , but we share this for the sake of our Visitors , Stay Blessed , Happy Blogging

2013, By: Seo Master

seo Add Recent Comment Widget To Your Blogger Blog 2013

Seo Master present to you:

Comments are the most important part of any blog or website. It helps you to form a community or relation with your blog followers. It lets your visitors to give feedback or ask any question on you blog post in form of comments. In this tutorial i will teach you to Add Recent Comment widget to your blogger blog. It shows most recent comments on your blog along with the post link on which comment have been posted and name of user who commented. This will let you know about new and most recent comments on your blog and allow you to easily reply to those comments. This widget is coded in Javascript and styled with CSS. You may customize the widget according to color scheme of your blog template. So lets get started.

How To Add Most Recent Comment Widget To Blogger Blog ?

1. Go to blogger Dashboard > Layout

2. Now click on Add Gadget and Select Html/Javascript

3. Paste the code given below in it.

<script style=text/javascript src="http://helplogger.googlecode.com/svn/trunk/recent comments widget.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://www.matrixar.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script>
<span id=mbw-cr><a href=http://www.matrixar.com>Recent Comments Widget</a></span><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px solid #666; padding-top: 6px!important; padding-bottom: 6px!important;} #mbw-cr {font-family: Arial,Tahoma;font-size:8px;padding-top:6px;display:block;} </style>

4. Make following changes to the above code.

Replace http://www.matrixar.com with your blog url.
Change #666 to change color of border (line below each comment)
Change solid to dotted to make the border dotted

5. Save it and you will have Recent comment widget on your blog.

seo How to Remove "Powered By Blogger" Attribution from Blogger? 2013

Seo Master present to you:

As many of you know that Blogger is completely developed in XML (Extensible Mark Up Language). Blogger has its own XML codes which you can use to add elements or to remove elements. Those who make Blogger templates must know XML. There are many attributes or links on default blogger templates which sometimes people don't want to see on their blogs. And one out of those links is "Powered By Blogger" Attribution which appears in every blogger default template at the footer.

So today, we will find the easiest and quickest way to remove this link.

Steps:

Go to Blogger Dashboard.
Now click on your Blog Title.
Navigate to Template tab.

Note: Before editing your template, you may want to save a copy of it. Back Up Your Template.

4. Click on Edit HTML button.

5. Click Proceed button to continue.

6. Now you have to find the code of attribution element. Search for the code snippet similar to below in the template,

<b:widget id='Attribution1' locked='true' title='' type='Attribution'>

7. Now alter the attribute locked value to false in the line of code, which cause element unable to remove.

i.e: <b:widget id='Attribution1' locked='false' title='' type='Attribution'>

8. Now you will able to remove attribution element. But still you won't be able to add any element to your page footer. So you need to change another line of code to allow adding elements to footer. Find the code snippet similar to below from the template.

<b:section class='foot' id='footer-3' showaddelement='no'>

9. Now change attribute value showaddelement to yes as below,

<b:section class='foot' id='footer-3' showaddelement='yes'>

10. Now Save template.

11. Navigate to Layout tab from left pane.

12. Find Attribution element bottom of the page.

13. Click on Edit link correspond to the Attribution element.

14. Now click Remove button on pop up window.

15. Now Attribution element has been removed. You can add another element using bottom Add a Gadget link to add custom attribution or any other element.

16. Click Save arrangement button.

Enjoy :-)

2013, By: Seo Master

Design by Dev Nasser

Les nouveautés et Tutoriels de Votre Codeur | SEO | Création de site web | Création de logiciel

Features Of Google+ Comments Widget

How To Add Google Plus Comments Widget To Blogger

How To Remove Google+ Comments Widget To Blogger

How To Add Related Posts Widget With Thumbnails To Blogger

So What's Up

How to add Recent Posts Widget to Blogger

Option 1: Recent posts widget with snippets

Option 2: Recent Posts Widget Showing Post Titles Only

How To Add Facebook Comment Box To Blogger

Changes in the Script Before pasting to HTML/JavaScript Box

How To Add Recent Comments Widget With Avatars To Blogger

Changes in Code Before pasting into HTML/JavaScript Box

How To Remove Attribution Gadget From Blogger

Steps for Removing Attribution Gadget

Top 5 Cool Blogger Widgets 2013

#1) Floating Vertical Bar with share buttons Widget For Blogger

#2) Beautiful E-mail Subscription Widget for Blogger

#3) Facebook Popup Like Box For Blogger

#4) Recent Comments Widget For Blogger

#5) WIKIPEDIA SEARCH BOX WIDGET FOR BLOGGER

Live Demo of Recent Comments Widget

How to add Beautiful Recent Comments Widget To Blogger

How To Add Wikipedia Search Box Widget To Blogger

How To Add Floating Vertical Bar With Share Buttons To Blogger

Live Demo Of Vertical Bar with Social Share Buttons

Live Demo For Facebook Send Button

How To Add Facebook Send Button To Blogger

Adding Facebook Send Button Above The Blogger Post

Adding Facebook Send Button Below The Blogger Post

Conclusion

LIVE DEMO OF FACEBOOK LIKE BOX

How To Add Facebook Like Box To Blogger

Changing in the Script/Code

How To Add Facebook Popup Like Box To Blogger

How To Add Most Recent Comment Widget To Blogger Blog ?

You May Also Like To Read:

Steps:

Labels

Blog Arşivi