Put Your Social Bookmarking Icons

Social bookmarking is a popular way for users to share their personal bookmarks of useful sites with other users. Since most of the bookmarks are classified by topics, tags or categories, people around the world with interests similar to the user can easily locate these sites by viewing their online bookmarks.

Just over the last couple of years, this concept has caught on with so many users that social bookmarking sites are now very popular and highly ranked by search engines. We shall discuss and list these sites in a separate article. For now, we want to provide you a code so that you can have something to work with.

Add bookmark code into your blog:

1.AddThis

AddThis now offers a beautiful alternative to social bookmarking icons or those 16x16 pixel images that clutter the footer of almost every blog post on the web.

With AddThis, you can easily put links to all popular social bookmarking websites in a two-column drop down that appears only when someone hovers the mouse over the Bookmark button - the icons and links stay hidden or invisible otherwise.

If a visitor cannot find his/her favorite social bookmarking site in the AddThis menu, they can click the "More.." link access all other other social bookmarking services. Very cool!

Just add the following code to your blog template.

 <script type="text/javascript"> addthis_url = location.href; addthis_title = document.title; </script><script type="text/javascript" src="http://s7.addthis.com/js/addthis_widget.php?v=12" ></script> 

Though you can grab the AddThis button for your blog without registration, I seriously recommend getting a free account as you get access to invaluable stats.

2. Social bookmark text links

Now we are going to see like putting them:

1.Go to Template -> Edit HTML -> Tick into Expand Widget Templates

2. We looked for the following code:

3. That line with the following code replaces:

<p class='post-footer-line post-footer-line-3'>

<div class='rsociales'>

Share this post with:

<ul>

<li><a expr:href='"http://www.technorati.com/faves?add=" + data:post.url + "&title="
+ data:post.title' target='_blank'><img alt='Agregar a Technorati' class='rsociales-sobre'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikd_5RXqhxhyphenhyphenursQ0D3DKnf88hKhY6ceXTq_6TXiuSn1QMYWoCRTV4ru0J4JGsut5uyiosSQIzFCeFrLct7SVWMEcqvtqEgkgUbJwZ29luoxd5w5JV9XX31RrBLlwyYF2wwqUY5sHZpNM/s1600/technorati.gif'/></a></li>

<li><a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title="
+ data:post.title' target='_blank'><img alt='Agregar a Del.icio.us' class='rsociales-sobre'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinGcbHDzFDcFscoXYG2rDfq1GXuZw7nlUSBJUtRy87WpWlS5Fphpy1rDl_nqq2FFubY8as2JDdSVjwHuubIYZ2ayoOvuxn0dGtU0F3sDaKD6NGdxoGFnY90T_keWlQ1p8_T2j4LZTJ1K8/s1600/delicious.gif'/></a></li>

<li><a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url
+ "&title=" + data:post.title' target='_blank'><img alt='Agregar a DiggIt!'
class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjNXlfbx4taatvnwKWStd-SYWvCTQcZNTZyEI6AXICb6QJoWs9o9BeVzjLsHtHzV-h8jAV56ydxfFeQL0YlofBkK60HMPNq8k-O3A7lroxl04M-_NvyOjgkVquZwpbAE3cTMBY8Ouzi04/s1600/digg.png'/></a></li>

<li><a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" +
data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar
a Yahoo!' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigCorDoZ6T5209nma-TusDaNI00VdRR16vXd77HvHJQi5OZadF3e3xN69osmNcuYaqnUFTZC2zHsv8_uJ7gaaxP7g2dKAnWbCRTUOt6D3bd_O4zKqlrVINqXAtCKmzu9MQzNDOpRngrYo/s1600/yahoo.png'/></a></li>

<li><a expr:href='"http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk="
+ data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar
a Google' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBBomaKNunMF5RQWIEXr3ZTFe7XY00-z-TIP4nxjtrcsPL7fiKzgmhGoYC3KQv4mhCKUy9TTmtdZ0vFtdZXzVzRO4vJkdqH8A50vZcXY6XV-CvHEhIXQ2WQ1RQkpj6FfmjfmSzTugz_5s/s1600/google.gif'/></a></li>

<li><a expr:href='"http://meneame.net/submit.php?url=" + data:post.url + "&title="
+ data:post.title' target='_blank'><img alt='Agregar a Meneame' class='rsociales-sobre'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEikP_ngy9HVy-uN22SkgfCq0HcYgnpt5zsrzBHs1dDmdYt8y9JdyP5MzvgOeMz8apLpbkYkyFl5aKmzhsTcIe9rZh_CbuIJdMzga_ToFOA2vNb7w8qNFGqAP2lyPW4P14DS7s1S97PXN9k/s1600/meneame.png'/></a></li>

<li><a expr:href='"http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&title="
+ data:post.title' target='_blank'><img alt='Agregar a Furl' class='rsociales-sobre'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSUMpRzVo3feyR6jGWlgBP9EfEmrB4wwPeYLFOhDdGDgYpt6cW2rDVVgmU5evOirG7bOjdaPWlM7i5Zs-pq6Qv7jgmSrp6K6LmXqKYvW8CWzPXUmTv7UhtfEiYEY94SevUWEqv4ROv6pY/s1600/furl.png'/></a></li>

<li><a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title="
+ data:post.title' target='_blank'><img alt='Agregar a Reddit' class='rsociales-sobre'
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8sbY-WdCVG76i9Mm_qUTcW_HnxGhJylY-1OXPA7jzeUEJfeI-iUdAH4_20LdNt-YZds8pvBzBucHqmLCBhEQYjFZjMKidPyZe2_ljJmmxWoQkq-0zn284Qm5I3LWEsc6ysdaRo-B42Tw/s1600/reddit.gif
'/></a></li>

<li><a expr:href='"http://ma.gnolia.com/beta/bookmarklet/add?url=" +
data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar
a Magnolia' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjshoU5BcvEGXaa1zmljE0-n5q5S8yIYjOsVS58V-vb5a78G8oLUimQMnwk3gVP0QJTWkf9DxBm_oLTn1W7xnzAzoDr_9IIaOFYs0yqEUTZzHQ0eS37L94xFA-03grTI1ZrmPwPu2ntLf0/s1600/magnolia.gif'/></a></li>

<li><a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&Description=&Url="
+ data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar
a Blinklist' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx1XyoxQgTVwH0n75hMYVILtVSjLRHDNp6-_TZy2kcGohsm2Rv2bfYBZbQA0pbEj2E21LaPZtb_Tj4r2Ui5TDBTVj-B7uAZnTgIc8yS4eTqF8qmgAxLw_0DAp8A98YMZk3vzktvj0qxXc/s1600/blinklists.gif'/></a></li>

<li><a expr:href='"http://blogmarks.net/my/new.php?mini=1&simple=1&url="
+ data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar
a Blogmarks' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzILRcMVUmnQK_b52sVnS3YerI7tbO1h55f1U4xbeHh0DfEXxiNfMLD-OjOt220k8NUfymA3StVQotCy6RJj4ZJUXGHLGUYK1kXchQJ8JYpWZt0EjCCP8GqGo6EWuHbIbffkvgDuZ__yk/s1600/blogmarks.gif'/></a></li>

</ul>

</div>

</p>

4. Now it looks for the code:

]]></b:skin>

And right above it sticks the following thing:

.rsociales ul {
display:inline;
margin:0pt !important;
padding:0pt !important;
}
.rsociales li {
background:transparent none repeat scroll 0%;
display:inline;
list-style-type:none;
margin:0pt;
padding:2px;
}
.rsociales img {
border:0pt none;
float:none;
margin:0pt;
padding:0pt;
}
.rsociales-sobre {
opacity:0.4;
}
.rsociales-sobre:hover {
opacity:1;
}

Labels: Blogger, Blogspot, Bookmark

Translate to:

Put Your Social Bookmarking Icons

2. We looked for the following code:

0 Comments:

Previous Posts