Sunday, 7 October 2012

10 Awesome Cursors for Bloggers



You can make your Blog stand out among others by changing your blog mouse cursor so that whenever anybody reaches your blog, their computer default mouse will change to the one you have configured with your blog.

Cursors-for-Bloggers

Here are 10 awesome cursors that can be used on blogger blogs. You only have to follow a few steps to get it working on your blog. Follow the instructions below.

Steps to Install a New Cursor to your Blog

1. Login to your blog “Dashboard” ==> “Templates” ==> tick “Edit HTML”.
2. Now search for the closing head tag i.e. </head>.
3. Finally, copy and paste the code of the mouse that you love best before/above </head> tag.

Cursor.1
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/Arrow_02.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a>

Cursor.2
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/bluemultiglit.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.3
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/tail2.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.4
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/bounce.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.5
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/apple-tmani.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.6
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/aliendance.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.7
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/Fly_2.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.8
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/Halloween_2.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.9
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/Heart.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a> 

Cursor.10
<style type="text/css">body, a:hover {cursor: url(http://justnaira-css-js.googlecode.com/svn/mouse/horse-ani1.gif), progress;}</style><a href="http://www.justnaira.com" target="_blank" title="Blogger Widgets"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_nmoW7116bbsn6RSx9dmQ4FbXHVTQ7NUjN7g1dzeoOuNVmEkdoDrfpxW5K1UYfH-d_0dN8ZQ-J2T9XimanUts8exGd_VVGAMz_gEPDFA7BXWXEy1TlRNS0LhT93VoyraAyvOcKrw7ZQ/s1600/www.justnaira.com.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a>

Add Pinterest Pin It Button With Counter To Blogger

Add Pinterest Pin It Button With Counter To Blogger
In case you are unfamiliar, Pinterest is an online pinboard that allows users to share images they find over the web -by “pinning” them on their boards. The pinned image is linked to the original webpage or blog post location, giving users the chance to visit the source directly.

A Pin It button is what Like button is to Facebook or Tweet button is to Twitter, as it allows users to share your posts without having to leave your blog. It also displays how many times a blog post has been shared.

Now let's see how to add this Printerest Pin It button to blogger.

How To Add Pinterest Pin It Button With Counter To Blogger?

1. Go to Blogger Dashboard > Template > Edit HTML.
2. Back up your template.
3. Check the Expand Widget Templates checkbox.
4. Search (Ctrl + F) for the following code tag in your HTML.

<data:post.body/>

Note:
There are two instances of the tag present in your template. Locate the the first (from top) one.

5. Copy and paste the following code immediately below/after it:

<!-- Pinterest Button Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='pin-wrapper' style='margin:5px 10px 5px 0; text-align: left;'>
<a class='pin-it-button' count-layout='horizontal' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a>
<a href='javascript:void(run_pinmarklet())' style='margin-left:-93px; width:43px; height:20px; display:inline-block;'/>
</div> 
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/>
<script type='text/javascript'>
function run_pinmarklet() {
    var e=document.createElement(&#39;script&#39;);
    e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;);
    e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;);
    e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999);
    document.body.appendChild(e);
}
</script>  
</b:if> 
<!-- Pinterest Button End -->

6. Save.

Button configuration:
  • You can customize the layout of Pin It button & counter by changing the value of count-layout attribute in step 5. Refer to the table below for the available types and their settings.


Button type

count-layout value

margin-left (in line 5) value
pinterest pin-it button vertical
vertical

-46px
pinterest pin-it button horizontal
horizontal

-93px
pinterest pin-it button no count
none

-46px

Button repositioning:

The steps above positioned the button on bottom left of each post. You can change the position if you wish:
  • Position it on top of post
  • Place the button code before <data:post.body/>, instead of after.
  • Position it on the right
  • Change the float in the code from left to right.

Add SCM Music Player To Your Blog

SCM Music Player
 
 
Putting music on Blog is not something very commendable, but there are models that players may be worth by being discreet, easy to customize and will not begin playing automatically. SCM Music Player is a great model that can be incorporated both in Blogger, Tumblr or WordPress.org, running audio from any tab, including links to YouTube videos, creating playlists customized and unique to your blog.

How To Add SCM Music Player To Your Blog?

Step 1: Get SCM Music Player Code

1. Go to http://scmplayer.net/.
2. Choose Skin
3. Edit Playlist
4. Configure Settings
5. Select Done to proceed.

Step 2: Add SCM Music Player Code To Blogger

1. Go to Blogger Dashboard > Layout > Add HTML/Javascript.
2. Paste SCM Music Player Code into the Html/Javascript box.
3. Save it.
Blogger Widgets