twitter
    Find out what I'm doing, Follow Me :)
Showing posts with label Buttons. Show all posts
Showing posts with label Buttons. Show all posts

Adding a Addthis button

As bloggers we always like to share our content and get more visitors. And also there are many sites that give us one click access for bookmarking and sharing. And there are buttons , which are created with a collection of sites like those. Here is the way to add them.


1. Edit your Template
2. Now find out
line post-footer-line-3 ( press 'Ctrl' + F to open your browser's search box)


Now you will find out a line similar to

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



Now , now select the button code you want and paste them below the above code line.


Button 1


Bookmark and Share


code:-

<div><script type="text/javascript">var addthis_pub="4a0a7d55675e85da";</script>
<a expr:name='data:post.title' expr:id='data:post.url' onmouseover='return addthis_open(this, "", this.id, this.name);' onmouseout='addthis_close()' onclick='return addthis_sendto()'><img src="http://s7.addthis.com/static/btn/sm-share-en.gif" width="83" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/200/addthis_widget.js"></script></div>




Button 2


Bookmark and Share


code:-

<div><script type="text/javascript">var addthis_pub="4a0a849e74cb3624";</script>
<a expr:name='data:post.title' expr:id='data:post.url' onmouseover='return addthis_open(this, "", this.id, this.name);' onmouseout='addthis_close()' onclick='return addthis_sendto()'><img src="http://s7.addthis.com/static/btn/sm-bookmark-en.gif" width="83" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/200/addthis_widget.js"></script></div>



Button 3


Bookmark and Share


code:-

<div><script type="text/javascript">var addthis_pub="4a0a82914fe2cdb1";</script>
<a expr:name='data:post.title' expr:id='data:post.url' onmouseover='return addthis_open(this, "", this.id, this.name);' onmouseout='addthis_close()' onclick='return addthis_sendto()'><img src="http://s7.addthis.com/static/btn/lg-share-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/200/addthis_widget.js"></script></div>




Button 4


Bookmark and Share


code:-

<div><script type="text/javascript">var addthis_pub="4a0a842466e5c5c9";</script>
<a expr:name='data:post.title' expr:id='data:post.url' onmouseover='return addthis_open(this, "", this.id, this.name);' onmouseout='addthis_close()' onclick='return addthis_sendto()'><img src="http://s7.addthis.com/static/btn/lg-bookmark-en.gif" width="125" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/200/addthis_widget.js"></script></div>




Button 5


Bookmark and Share


code:-

<div><script type="text/javascript">var addthis_pub="4a0a86776e0cfae7";</script>
<a expr:name='data:post.title' expr:id='data:post.url' onmouseover='return addthis_open(this, "", this.id, this.name);' onmouseout='addthis_close()' onclick='return addthis_sendto()'><img src="http://s7.addthis.com/static/btn/sm-plus.gif" width="16" height="16" alt="Bookmark and Share" style="border:0"/></a><script type="text/javascript" src="http://s7.addthis.com/js/200/addthis_widget.js"></script></div>




Now follow the Safety Saving Steps.

And

Adding a Email Me button

If you want to , you can add a "Email me" link or a Image button below your every post. You can also add this code as a HTML\Java script gadget . But if you use that method , there will be a space left between your post and the button. How ever the advanced & best way is adding the codes in to the template.For that

1. Edit your Template
2. Now find out post-footer-line post-footer-line-3
( press 'Ctrl' + F to open your browser's search box)


In some template , you will find out a code line as

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

and in most of templates , you will find out a code line as

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



Now change these code lines by giving your information


<a href="mailto:Type Your Email Address here"><img src="Image URL of your Image" alt="Email me" /></a>

* mailto:
is essential


Ex:-

<a href="mailto:Dilshanzmail@gmail.com"><img src="http://sites.google.com/site/dragonzstore/_/rsrc/1242179856980/Home/email%20me%201.PNG" alt="Email me" /></a>


Now paste it below the code line <p class='post-footer-line post-footer-line-3'/>


Now you will see a image link like this

Email me


If you don't want a image, then add this code <a href="mailto:Type Your Email Address here">Email me </a>

* mailto: is essential


Now follow the Safety Saving Steps.

And

Adding a Digg Button

Digg :- Digg is a place for people to discover and share content from anywhere on the web. From the biggest online destinations to the most obscure blog, Digg surfaces the best stuff as voted on by our users.You won’t find editors at Digg — we’re here to provide a place where people can collectively determine the value of content and we’re changing the way people consume information online. ( Continue Reading )

Thats what it says in Digg.com ,


Lets see how to add a Digg button to your blog. Hope you know what is Digg.



Though you don't know much on Digg , the reader may be a digger. So lets add a Dig button to every post of your blog.



For that,

1. Edit your template ( How to edit your template )
2. Find out the code line
<p><data:post.body/></p>


Now Paste following codes just above that Code line.


<div style='float:right; margin-left:10px;'>
<script type='text/javascript'>
digg_url=&quot;<data:post.url/>&quot;;
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
</div>
<p><data:post.body/></p>


Now follow the Safety Saving Steps.

And

Now you will be able to see a Digg button in your every Post.

Changing the Buttons

You may have seen Buttons like 'Home' , 'RSS' , 'About' , just below the header.May be you want them , may be not. Or may be you will like to use your own Buttons or change the buttons.There are some common buttons for every blog as 'Home' , 'Comment-RSS' , 'Post-RSS' and 'Edit'. This edit button is only visible for you.

If you want to remove or change these buttons




For that,


1. Edit your Template
2. Copy the Text you want to find out and Find out a name of a button ( 'Ctrl' + F ) ex:- Home




Now you will find those codes under <div id='navbarleft'> or <div id='navbar'> and above </div>

First of all you will find a code line similar to
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>

This is the code line to the Button ' Home '

Below this you will find out the codes to other buttons.Just delete those codes. ( you have to delete the codes below
<li><a expr:href='data:blog.homepageUrl'>Home</a></li> and above the first </div> you find )


Now we have to create our own buttons.

<li><a href='The Link of your page'>Button's name</a></li>


ex :-
<li><a href='http://blogger-template-editing.blogspot.com/2009/04/footer-editing.html'>Footer Editing</a></li>


That's It. Now you can create your own buttons or Edit the existence.


Now Follow the Safety Saving Steps

Click