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

seo Vertical Social Media Sharing Buttons Widget For Blogger 2013

Seo Master present to you:

Blogging becomes interesting when people share your content on different social media sites and other websites with friends. In order to share your content on social media sites by visitors; you need to add some beautiful and smashing social sharing widgets. If your widget is looking attractive and catches people's attention then your content might get shared by visitors. For this purpose, there has been a huge number of Blogger widgets and plugins by different designers. Today, I would like to share a floating social sharing widget with you which scrolls down automatically when visitors scroll down the page. You can see this widget on my blog. The same widget I'm sharing with you.

The Benefits of This Widget:

There are many advantages you can get by using this widget on your blog. The first benefit is that you can have all social sharing buttons in a single widget and also one can send your content to someone via email by using this widget. The second benefit is that this widget don't have loadable JavaScript or jQuery codes so it can easily be loaded by browser and also it scrolls down automatically and user can observe sharing your content somewhere, while visiting your blog.

How to Add Social Media Floating Widget to Blogger?

The process of adding this widget to your blog is simplest. You need just to follow below steps:

1. Open Blogger
2. Go to Layout
3. Add a Gadget
4. Add HTML/JavaScript
5. Copy the below code and Save

<div <!–sidebar floating share buttons code start–>
<style>
#pageshare {position:fixed; bottom:15%; left:10px; float:left; border: 1px solid black; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#000000;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;-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="Apply this Widget on your website or Blog">
<div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="UmarKhaleeq">Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></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>
<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>
<br/><div style="clear: both;font-size: 9px;text-align:center;"><a href="http://www.matrixar.com/2013/03/vertical-social-media-sharing-buttons-blogger.html">[Get This Widget]</a><font></font></div></div>
<!–sidebar floating share buttons code end–></!–sidebar></!–sidebar>

6. Save Arrangement

Customization

The floating is set to left side of your blog, if you want set it for right side of your blog then simply change the bolded float:left property to float:right.

2013, By: Seo Master

seo Add Facebook Alike Twitter Fan Box To Your Blog 2013

Seo Master present to you:

I had already posted on adding Twitter Follow Button to your blog, but Today in this post i am going to show you to add Twitter fan box to your blog which looks similar to Facebook Like Box. This is an third pary widget or application devloped by Mark Carey. This widget can help you to achieve more twitter followers and eventually results in greater traffic from twitter. This twitter fan box shows images or avatar of top 10 newest followers on you twitter account. This widget will let your blog visitors to easily follow you on twitter from within your blog. So lets add this great widget to your blog or website.

How to add ?

1. Go to blogger Dashboard and select Layout.
2. Then click on Add Gadget and select Html/Javascript
3. Now paste the code given below in it.

<script type="text/javascript"
src="http://s.moopz.com/fanbox_init.js"></script><div
id="twitterfanbox"></div><script
type="text/javascript">fanbox_init("mybloggersworld");</script>

4. Make sure to replace mybloggersworld with your twitter username.
5. Save the widget and you are done.

seo Adding Google+ Page Badge To Your Blog 2013

Seo Master present to you:

I had previously posted about importance of creating a Google plus fan page and show you to make one for your blog. In this tutorial i will teach you to add Google+ fan page Badge to your blogger blog. This badge is similar to twitter follow button or facebook like box as it allows your blog visitors to easily +1 your fan page. just creating a fan page is not enough you need to connect your blog with your page in order to get more +1 which will eventually results in more traffic. Just follow this simple tutorial and your will be good to go.

Making Google+ Fan Page

If you already have or created a google+ fan page then you skip directly to the next part on adding google+ badge to your blog. But if you don't have google+ page then check out tutorial given below and come back here.

Making A Google+ Fan Page

Adding Google+ Fan Page Badge To Blogger Blog.

1. Go to blogger Dashboard > Template and click on Edit Html.

2. Then search for </head> and paste the code give below just above it and save it.

<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>

3. After adding the plusone.js script, we will be adding google+ badge on your blog.
4. Then go back to blogger dashboard > Layout and click on Add Gadget.
5. Now select Html/Javascript and paste below code into it.

<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>

<a style='display: block; height: 0;' href="https://plus.google.com/105355418052087265851" rel="publisher"> </a>

<g:plus href="https://plus.google.com/105355418052087265851" height="131" width="300" theme="light"></g:plus>

Replace the url of my Google+ Page with yours
Change light to dark if you want widget to be black.
You may also change it height and width to change the style of badge as show in below image. Change height and width according to the badge you want.

Above image show just few badge style. There are even more height and width settings to change the badge look. In order to know more about this settings then check out article on google devloper page by clicking on link given below.

Google Devloper - Google+ Badge

Any problem?

If you got any problem or have any question or suggestion related to this tutorial or our blog in general then leave a comment below i will be glad to help you out. Keed Blogging!

2013, By: Seo Master

seo Set Up A Google+ Page For Your Blog Or Website 2013

Seo Master present to you:

As you all know how good a facebook fan page or twitter follow button prove to your blog in driving more traffic, same way google+ page can help you to achieve greater traffic. If you don't know google also offers its service to create Google plus fan page same as facebook for your blog or brand. The great thing that makes google plus better then other social media site is that it helps you to get better ranking in google search results. for example: More +1 you get better is your blog search results on google. So lets create one for your blog or website.

How To Make Google+ Fan Page

1. First Sign In to your gmail account and got to this Page.
2. Then click on Product or Brand from the options and select website and click on next as shown below.

3. Enter name of Your blog and url of your blog as shown below and click on continue.

4. Now Enter Description of your blog, upload a image for your page and a email address if you like and click on Finish.

5. Done, In my next post i will teach you to add google+ badge to your blog.

seo Facebook jQuery POP OUT likebox widget generator 2013

Seo Master present to you:

I had developed a Facebook Static popout jquery effect Like box generator for you.This Widget Generator let's you easily generaate your favorite Facebook style Widget and also easily add to your Blogger Blog.In my previous Article (How to Add a Static Facebook jQuery Pop out Widget) I told you about Static Facebook POP OUT Widget installation manually.Use this Widget generator and Enjoy..!

Step 1: Add jQuery plugin (if your blog have a jquery plugin,ignore this step)

Go to Design->Edit HTML[Template->Edit HTML in new blogger interface]
Copy below code inside <head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

Go to Design-> Page Elements
Click add gadget and select HTML/javascript
Copy and paste the generated code inside it and save it.

This is my first widget generator,also expect more other awesome widget generators from us.If you enjoyed this widget Generator please please share n like us..

2013, By: Seo Master

seo Stylish Static animated Flash Clock for Blogger 2013

Seo Master present to you:

Here I am saying about How to Add a Stylish Flash Animated Clock to your Blogger Blog.Here is a huge collection of Clock widgets for your taste.Follow the Simple Steps below to make your Blog Stylish,Cool, and Smart looking Blog.

First of all SignIn to your Blogger Account
Select Design->Page Elements
Click on Add Gadget
Select HTML/javascript from it,then copy the code of clock you want.

Step 1: If you want a NON Static Clock Widget,then Just copy and paste the code to HTML/javascript content.

If you want a cool static clock,then first do the step above and Click HERE

Add Stylish Flash Clock 1

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock"><center><embed height="140" src="http://www.hitarek.com/clock/clock24-6.swf?TimeZone=IST&Place=&" type="application/x-shockwave-flash" width="210"></embed></center><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center></div>

Add Stylish Flash Clock 2

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock"><center><embed width="210" src="http://www.hitarek.com/clock/clock24-2.swf?TimeZone=IST&Place=&" height="140" type="application/x-shockwave-flash"></embed></center><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center></div>

Add Stylish Flash Clock 3

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock"><center><embed width="120" src="http://www.hitarek.com/clock/clock5-1.swf?TimeZone=IST&Place=&" height="230" wmode="transparent" type="application/x-shockwave-flash"></embed></center><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center></div>

Add Stylish Flash Clock4

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock"><center><embed height="230" src="http://www.hitarek.com/clock/clock5-2.swf?TimeZone=IST&Place=&" type="application/x-shockwave-flash" width="120" wmode="transparent"></embed></center><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center></div>

Add Stylish Flash Clock4

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock">
<center><iframe allowtransparency="true" frameborder="0" height="148" hspace="0" marginheight="0" marginwidth="0" scrolling="no" src="http://www.hitarek.com/animation/dolls5.html" vspace="0" width="100"></iframe></center><center><a href="http://www.matrixar.com/" style="font-size: 2mm;" target="_blank">FreeWidgets</a></center></div><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center>

Add Stylish Flash Clock5

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock">
<center><embed width="130" src="http://www.hitarek.com/clock/clock11-4.swf?TimeZone=IST&Place=&" height="130" wmode="transparent" type="application/x-shockwave-flash"></embed></center><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center></div>

Add Stylish Flash Clock6

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock">
<center><embed width="160" src="http://www.hitarek.com/clock/clock25-9.swf?TimeZone=IST&Place=&" height="160" wmode="transparent" type="application/x-shockwave-flash"></embed></center><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center>

</div>

Add Stylish Flash Clock#

If you want to add this Clock,then Copy and paste the below code

<div class="noop-clock">
<center><embed width="140" src="http://www.hitarek.com/clock/clock22-5.swf?TimeZone=IST&Place=&" height="180" type="application/x-shockwave-flash"></embed></center><center><a style="font-size: 3mm" target="_blank" href="http://www.hitarek.com">Free Clock</a></center>
</div>

Add Stylish Flash Clock 7

If you want to add this Clock,then Copy and paste the below code

Add Stylish Flash Clock 8

If you want to add this Clock,then Copy and paste the below code

Add Stylish Flash Clock 9

If you want to add this Clock,then Copy and paste the below code

Add Stylish Flash Clock 10

If you want to add this Clock,then Copy and paste the below code

Add Stylish Flash Clock@

If you want to add this Clock,then Copy and paste the below code

Add a Static Clock

Step 2:

Copy and Paste the CSS code below after the code of clock.

<style type="text/css">.noop-clock {
position: fixed;
right: 0%;
top: 0%;
padding: 3px 7px;
box-shadow: -2px 2px 6px;

}</style>

Then click on Save.

With this tutorial you have got a Beautiful Clock.
If you feel any confusion or doubt then please do comment.

2013, By: Seo Master

seo Facebook Static Pop Out Like Box with jQuery Effect for Blogger 2013

Seo Master present to you:

Here is a Tutorial about how to add a static Pop out Like Box with Cool jQuery hover effect.This a Awesome Blogger Blog Widget that adds a little beauty to your blog.

After installing this Widget a Facebook Logo will appear on the right side of your Blog.When you Mouse over that Logo it Pop out with Smooth jQuery Effect.

Follow the instructions for installing this Widget.

View Demo

If you don't interested in Editing HTML,you can use our WIDGET GENERATOR.

Install Facebook Pop Out Like Box Widget

Go to Design-> Page Elements
Click on Add Gadget

Select HTML/Javascript from it
Leave title as blank ,Copy and Paste the below code into the content section.

Replace the RED highlighted text with your Facebook page URL.

I hope you'd liked this Article,if so please share, like this.

2013, By: Seo Master

seo How To Add Twitter Follow Button To Your Blog ? 2013

Seo Master present to you:

After Facebook the biggest name in social media is twitter with 500+ million users and 350+ million tweets generated daily. Twitter Follow button is one of the 3 Must have blogger widget on your blog along with Facebook like Box and Popular post widget. By adding Twitter follow button on your blog you can increase your twitter followers which will result in greater traffic from the twitter. This will allow visitors to easily follow you on twitter directly from your blog You can check my twitter follow button on the right sidebar of my blog.

How to add ?

1. Go to Twitter Button Website.
2. Choose Follow from the four options as shown below.

3. Now in the Button options Enter your twitter username in user field as i have enter my username @mybloggersworld. as shown in below picture. You may check Large button to increase the size of twitter follow button, but for the best result leave the settings as shown below.

4. Copy the button code which is on the right side under the title Preview and Code in small box below your twitter button as highlighted in red in the picture below.

5. Now your twitter button is ready to be install on your blog, In order to do go to your blogger dashboard then layout.

6. Click on Add gadget and choose Html/Javascript from pop up window and paste the code copied in Step 4 in the box.

7. Now save the widget and you have Twitter follow button on your blog.

Auto Tweeting On Twitter

If you don't use twitter often, but like to share each and every blog post on your twitter account to increase traffic to your blog then check out below tutorial to Auto tweet your latest blog post on twitter.

Automatically Tweet Your Blog Post On Twitter

2013, By: Seo Master

seo Adding Simple Blogger Email Subscription Form 2013

Seo Master present to you:

You can recieve lots of traffic by increasing your email subscription list by making your visitors subscribe to your blog to get latest updates of your blog post on their email. You can easily achieve this by implementing blogger simple Email Subscription Form or Follow by Email Gadget on your blog. This gadget is really easy to install on your blog. In my future post i will teach you to customize this widget and share with you some cool Email Subscription form.

Adding Follow By Email Form To Blogger Blog

1. Go to your blogger Dashboard and click on Layout.

2. Then click on Add Gadget.

3. Now select Follow By Email from pop up window.

4. Then leave everything else it is. You may change title to Subscribe Us if you like but don't touch FeedBurner Url as shown below.

5. Now save it and you will have Follow By Email to your blog.

Feed Back!

If you like are post or get any problem implementing this widget on your blog leave a comment below i will be glad to help you out. Like us on Facebook , +1 on Google plus, Follow on Twitter and Subscribe Us to get latest updates on new tutorials.

2013, By: Seo Master

seo Adding Animated Cloud Label To Your Blog 2013

Seo Master present to you:

As you all know good and relevant widgets make your blog easy to navigate and can help to keep visitors engaged on your blog. Today i will teach you to add such usefull widget to your blog. This blogger widget looks cool on your blog as well as helps user to navigate on your blog. I had previosly posted about how to add label or categories cloud on your blog, In this post i will teach you to add animated label cloud to your blog.

Adding Label or Categories Cloud

1. Go to Dashboard > Layout > Add Gadget.

2. Now choose labels from pop up window and change setting as show in below image.

3. Now save it and follow below steps to animate label or categories cloud. For more details check below article.

Adding Label Or Category Cloud On Your Blog

Animating Label Cloud

1. Go to your Blogger Dashboard and Click on Template

2. Then click on Edit HTML

3. Now search for below code be clicking CTRL + F

<b:section class=’sidebar’ id=’sidebar’ preferred=’yes’>

4. Now paste below code just after the code you search on step 3.

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>My Bloggers World <a href='http://mybloggersworld.blogspot.in/'>Mbw</a> and <a href='http://www.matrixar.com/'>Mbw</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0x333333");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

5. Now save the template and go to Layout to change the position of the widget.
6. If you have any problem implementing this widget on your blog leave a comment below, i will be glad to help you out. You may also like to add below widgets to your blog.

Other Usefull Customization For Your Blog

2013, By: Seo Master

seo Styling Popular Post Widget With CSS 2013

Seo Master present to you:

There are some usefull and must have widgets which can help you to increase traffic to your blog and keep your visitors engaged on your blog. Facebook Like Box, Twitter Follow Button and Popular post widget are some of those widget. I had previously posted on Adding Popular Post widget to your blog, but the default style of this widget that blogger provides is very boring and not so attractive. So in this tutorial i will teach you to add and style popular post widget using CSS. After styling the widget it will look more stylish and more attractice as you can see on the left. You can even customize this further to match your blog template. So lets get started customizing blogger popular post widget.

Adding Popular Post Widget To Blog

1. Go to Blogger Dashboard > Layout > Add Gadget and choose Popular Post Widget.

2. Now set this setting as shown below.

3. You may change number of post to show upto 10 but dont make it below 6. Check below article for detail information.

Add Popular Post Widget To Your Blog

Styling Popular Post Widget With CSS

1. After Adding Popular Post widget to your blog. Go to Blogger Dashboard and choose Template.

2. Now Backup your Template to be safe if you mess something up. Check below tutorial if you dont know how to do that.

How To Backup Blogger Template ?

3. After Template been selected click on Edit HTML and search for below code.

]]></b:skin>

4. Now paste below code just above the code you search in Step 3.

/*--- www.matrixar.com Popular Posts --- */
.popular-posts ul{padding-left:0px;}
.popular-posts ul li {
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 1px solid #6BB5FF;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;}.popular-posts ul li:hover {
border:1px solid #009900;
}.popular-posts ul li a:hover {
text-decoration:none;
}

5. Now save this template and you are done.

Further Customizing The Widget

If you follow above steps correctly then you have install and style popular post widget on your blog.This part is completely optional. So if the border of the widget does not match your blog template or you want some different color then change the setting shown below.

6BB5FF - Change this to change the border color at static mode.
009900 - Change this to change border color on hover effect.

If you have any question or suggestion or come across a problem while implementing this widget then leave a comment below i will be glad to help you out.

2013, By: Seo Master

seo Add Flying Letters below Mouse Pointer Animation 2013

Seo Master present to you:

How to setup flying letters below mouse pointer.This a simple article that Spice your Blog.After inserting this Code,When you move mouse over your Blog, you will see that Letters you SET in the below code will flying like a Animation.

VIEW DEMO

Install Flying Letters Below Mouse Widget

Make sure you had Backed up your Template(How To BackUp Template?)

Sign In to your Blogger Account
Go to Design->Edit HTML
Find </body> (Find Easily Using Ctrl+F) and Copy and Paste the below Code

<script type="text/javascript">
var text=' ENTER YOUR FLYING TEXT HERE ';
</script>
<script src="http://netoopscodes.googlecode.com/svn/branches/Js%20files/mousetail.js" type="text/javascript">
</script>

Save it,its all.....you are almost done.

2013, By: Seo Master

seo Adding Label or Categories Cloud on Your Blog 2013

Seo Master present to you:

Adding a proper and usefull widgets to blog can help visitors as well as bloggers to increase traffic to their blog. In this post i will share with you guys a simple and easy to add blogger widget, but very usefull for visitors to browse through different categories. You can see on left how this widget will look like on your blog. So lets add this widget to your blogger blog.

How to add ?

1. Go to Blogger Dashboard and click on Layout.

2. Then click on Add gadget and choose Label as shown below.

3. Now a pop up box will appear, change Display to Cloud and uncheck Show number of posts per label as shown on below image.

4. Now save it and you will have categories cloud on your blog.

Animating Label Cloud

If you would like to animate this widget and make it more attractive for your blog or website then check out below mentioned tutorial.

Animate Label Or Category Cloud

Also Add Below Widgets To Your Blog

2013, By: Seo Master

seo 3 Must Have Blogger Widgets On your Blog 2013

Seo Master present to you:

Blogger widgets are one of the most important part of your template. Selecting proper widgets for your blog thats helps your visitors and also helps your blog to increase traffic should be done properly. Their are lots of blogger widgets out their but it doesn't mean that you should add every widgets you come across. You should add those widgets thats helps you and your readers and also which are relevant to your blog. For example previously i posted about HTML5 Music Player widget, Every blogger does not need to add this widget but those with blogs on songs, movies should definitely add this. In this post i will share with you few blogger widgets that every blogger must implement on their blog.

1. Facebook Like Box

Social Media is growing day by day and Facebook is at top of this list with around 1 Billion users. Lots of people spend most of their time on facebook, so it can help you to generate greater traffic to your blog. So implementing a Facebook Like Box to your blog can help your visitors to like your facebook page easily from within your blog to get latest update on their facebook profile. In short Greater the facebook fans you have greater is traffic generated from it.

How To Add Facebook Like Box To Blog ?

2. Twitter Follow Button

After Facebook the big name in social network comes the twitter with 500 million users and more than 350 +million tweets generated per day. So implementing twitter follow button on your blog will alow your visitors to easily follow you on twitter to get latest updates of your blog. Try to increase your follower to get more traffic from twitter. If dont like to tweet daily or you dont use twitter so often then you can check below article to automatically tweet latest blog posts on your twitter account.

Automatically Tweet Your Blog Post On Twitter

3. Popular Post

Popular post is awesome widget for your blog. It shows most popular post or articles on your blog. You can change settings to show number of post and to show thumbnail or not and more. This widget is easy to install on your blog. It can be installed directly from your blog layout section. This will let your visitors know which are the most popular blog post on your blog.

Adding Popular Post Widget To Blog

2013, By: Seo Master

seo Add Popular Post Widget To Your Blog 2013

Seo Master present to you:

Popular post is one of the best available widget for your bloggers blog. It shows most popular post or articles on your blog. This widget allows you to adjust different settings such as to show number of popular post and to hide thumbnail or not and many more. This widget can be customized or styled even more with CSS and Javascript, but i will talk about that in next article. This widget is easy to install on your blog. It can be installed directly from your blog layout section. This will let your visitors know which are the most popular blog post on your blog. So lets get started implementing this on your blog.

How to add popuar post widget ?

1. Go to your blogger Dashboard and then go to Layout.
2. Then Click on Add a Gadget.
3. Now choose Popular widget from the popup window as shown below.

4. Choose below settings for popular post widget for best results.

5. Above setting are best, but if you want to cutomize the popular post check out below setting.

Title - Name it as you want (Eg: Top 10 Post)
Most Viewed - Change setting to view popular post of Month, Week or All time.
Image thumbnail - Check image thumbnail if you want to show thumbnail of the post.
Snippet - Check snippet if you want to show description of your post.
Change Display Up Until to show number of popular post Maximum is 10 and Minimum post is 1.

Styling Popular Post Widget With CSS

To make the popular post widget more attractive and eye catching, Then check out below tutorial to style your popular widget with CSS.

Styling Popular Post Widget With CSS

Must have widget for your blog

3 Must Have Blogger Widgets
Facebook Like Box For Blogger
Adding HTML5 MP3 Player On Your Blog (Must have if blog on Music and Movies)

2013, By: Seo Master

seo Add Cute Twitter Flying Bird to your blog 2013

Seo Master present to you:

Twitter being a huge platform to share your latest post you can increase your blog traffic via twitter. More twitter follower you have greater is your chance of getting traffic from twitter. So to increase your twitter follower and so your blog traffic Add cute looking twitter bird to your blog. This bird fly from corner to corner of your blog and it looks really cool. It is compatible will all browser and implementing this to your blog is very easy. Just follow simple steps below.

How to add Twitter bird to your blog ?

1. Go to you Blogger dashboard.
2. Click on Template > Edit Html
3. Then search for </body>
4. Just above it Paste following code

<script src='http://bloggerblogwidgets.googlecode.com/files/way2blogging.org-tripleflap.js' type='text/javascript'>
</script>
<script type='text/javascript'>
var twitterAccount = "mybloggersworld";
var tweetThisText = " <data:blog.pageTitle/> : <data:blog.url/> ";
tripleflapInit();
</script>

5. In place of mybloggersworld write your twitter name
6. Now save your template and see cute twitter bird flying around your blog.

Have any problem ?

If you have any question or problem implementing this to your blog or have any suggestion about my posts or blog leave a comment below. I will be glad to help you out.

2013, By: Seo Master

seo Awesome Rainbow animation Link Widget for Blogger 2013

Seo Master present to you:

This is a simple Blogger Blog Trick,Changing the color of Link when Mouse over it.7 colors are changing like animation when hover the link.
Follow the simple steps below..

If you are a beginner in HTML editing,Use our 1 Click Widget Below(Click Add to Blogger Button below)

Install Rainbow Animation Hover Effect manually.

Note:Remember that Back up your Template First.(How to Backup Template)

Sign In to you Blogger Account.
Go to Design->Edit HTML
Find <head> section and Place the below code inside it.

Save It and Enjoy. . . !

I think you enjoyed this post.Surely you will get excited after using this widget.

2013, By: Seo Master

seo Add HTML5 Mp3 Music Player To Your Blog 2013

Seo Master present to you:

Isn't it be cool to have a tune played when someone visit your websites or blog. Specially if your blog is about songs, music, movies and videos then it would be cool to play music automatically when visitors visits your websites. In this tutorial i will show you how to add a HTML5 mp3 music player to your blog. This mp3 player comes with features such as adjusting volume, play and pause button etc. It works on mostly all browsers except some lower version of internet explorer.

Live Demo (Check Below)

How to add HTML5 Mp3 Player ?

1. Go to blogger Dashboard > Layout
2. Then Click on Add Gadget
3. Select HTML/Javascript
4. Copy the below code and Save it. (Any one of 3)

Code For Normal Mp3 Player

<audio controls="controls"><source src="www.matrixar.com" autoload="true" autoplay="true" hidden="true" type="audio/mp3" /></source></audio>

Code to play Automatically

<audio controls autoplay="controls"><source src="www.matrixar.com" autoload="true" autoplay="true" hidden="true" type="audio/mp3" /></source></audio>

Code to play music again and again (Looping)

<audio controls loop="controls"><source src="www.matrixar.com" autoload="true" autoplay="true" hidden="true" type="audio/mp3" /></source></audio>

Note: Replace www.matrixar.com with url of mp3 file you want to play. The url will end with .mp3

5. Now you have working HTML5 Mp3 player on your blog.
6. Place this widget where you want it to appear on your blog.

Have any question ?

If you have any problem implementing HTML5 Mp3 player to your blog or have any other question or suggestion then leave a comment below. I will be glad to help you. Don't Forget to subscribe, +1 on google+ and like us on Facebook.

2013, By: Seo Master

seo Awesome Random Posts Widget for blogger Blog 2013

Seo Master present to you:

Random Posts widget is an awesome widget for your Blogger Blog.Most important feature of this widget is it lets your Blog visitors to surf more blog posts in your blog.Surely it increases your Blog's internal links that lets your blog higher traffic.
Its let your users to spend more time in your Blog.

VIEW DEMO

Install Random posts widget

Make sure you are Sign In to your Blogger Account.

If you are a beginner in Blogger Editing ,use our one click Widget

Click the below Add to Blogger Button to install

<br /> <style type="text/css"><br /> .noop-random-posts ul li {<br /> list-style-image: url("http://www.matrixar.com/-90ErnmngIVo/TyPTnufu8cI/AAAAAAAAADs/ndQtxxa6kkI/s1600/tick+list+style.png");<br /> }<br /> </style><br /> <div class="noop-random-posts"><script type="text/javascript"><br /> var randarray = new Array();var l=0;var flag;<br /> var numofpost=5;function nooprandomposts(json){<br /> var total = parseInt(json.feed.openSearch$totalResults.$t,10);<br /> for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}<br /> if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');<br /> for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];<br /> for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";<br /> document.write(item);}}<br /> }document.write('</ul>');}<br /> </script><br /> <script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=nooprandomposts"></script></div>

Manually Add Random posts Widget

Sign In to your Blogger Account.
Go to Design->Page Elements
Click on Add Gadget and look for HTML/Javascript take it
Give the title as you need(eg:Random Posts)
Copy and paste the below code to the content section

Click on Save and its Done...If you have any doubts don't hesitate to ask.Please Comment.
I hope you had enjoyed this post.Leave Comments...

2013, By: Seo Master

seo How to add facebook Likebox to your blogger blog ? 2013

Seo Master present to you:

Social media is growing day by day and Facebook is among the top of all. Facebook is now becoming basic necessity of every day life. Majority of facebook users view their profile more then once a day. So you could imagine the amount of traffic you can generate to your blog from facebook. In this post i will show you how to add facebook like box widget to your blog. This widget will help your visitor to like your facebook page from within your blog. The more amount of your facebook page like, more is the traffic you will generate. Check out my Facebook Page and dont forget to like. So lets get started learning how to add facebook like box to your blog.

Step 1: Go to Facebook Social plugin and add you facebook page url (If you don't have Facebook Fan page then go here and Create One) Then uncheck Show stream and Show Header. Leave everything else as it is.This widget comes in two colour black and white choose it from the Color Scheme depending on your blog template. After doing all the above setting click on Get Code.

Step 2: After clicking on Get code you will see a pop up box as shown below. This pop up box will contain codes for HTML5, XFBML, IFRAME and URL. From that you click on IFRAME and copy the code that is generated in the pop up box.

Step 3: Now go to your blogger dashboard and click on blogger layout. Then click on add gadget where you want your widget to appear on your blog. Then a popup box will appear from that choose HTML/Javacript. Then a new pop up box will appear Leave title of that widget blank and paste the code we copied in step 2 in the content area of that box and click save.

Now you will have facebook like box widget on your blog like i have on right sidebar of my blog. If you get stuck at any point or have any problem adding facebook widget to your blog leave a comment below.

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

The Benefits of This Widget:

How to Add Social Media Floating Widget to Blogger?

How to add ?

You may also like to read:

Making Google+ Fan Page

Adding Google+ Fan Page Badge To Blogger Blog.

Any problem?

How To Make Google+ Fan Page

You may also like to read:

Step 1: If you want a NON Static Clock Widget,then Just copy and paste the code to HTML/javascript content.

Add Stylish Flash Clock 1

Add Stylish Flash Clock 2

Add Stylish Flash Clock 3

Add Stylish Flash Clock4

Add Stylish Flash Clock4

Add Stylish Flash Clock5

Add Stylish Flash Clock6

Add Stylish Flash Clock#

Add Stylish Flash Clock 7

Add Stylish Flash Clock 8

Add Stylish Flash Clock 9

Add Stylish Flash Clock 10

Add Stylish Flash Clock@

Install Facebook Pop Out Like Box Widget

How to add ?

Auto Tweeting On Twitter

Adding Follow By Email Form To Blogger Blog

Feed Back!

Adding Label or Categories Cloud

Animating Label Cloud

Other Usefull Customization For Your Blog

Adding Popular Post Widget To Blog

Styling Popular Post Widget With CSS

Further Customizing The Widget

Install Flying Letters Below Mouse Widget

Make sure you had Backed up your Template(How To BackUp Template?)

How to add ?

Animating Label Cloud

Also Add Below Widgets To Your Blog

1. Facebook Like Box

2. Twitter Follow Button

3. Popular Post

How to add popuar post widget ?

Styling Popular Post Widget With CSS

Must have widget for your blog

How to add Twitter bird to your blog ?

Have any problem ?

Install Rainbow Animation Hover Effect manually.

Note:Remember that Back up your Template First.(How to Backup Template)

Live Demo (Check Below)

How to add HTML5 Mp3 Player ?

Have any question ?

Install Random posts widget

Make sure you are Sign In to your Blogger Account.

Manually Add Random posts Widget

Labels

Blog Arşivi