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





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





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

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





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





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

Posting Author's name below the post

Some times , you may want to post the author's name below all posts.You also can type you name below all posts.but there is little trick to do this in more quicker and easier way. Instead of a name , you also can use a image as a signature. Here is the way to do it.


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 , paste this code line just below it.


Lessons by <data:post.author/>


Use any thing you want instead of Lessons by. some thing like , written by , post by .......

or if you want a image , instead of the name , paste this code line

<IMG SRC="Paste Image your URL of signature image">

ex:-

<IMG SRC="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjahFXgAOcRluABwccosPLt90Yhtnj0pxDb3UVvypMmjTDuWevm1mvDxG_szKigCoRpB51IRzPFeN65Sn8wfpTcMUSBmcsHxsAMVXhgzXwp0HM-iySCTOcnHpSXUdZibaFwOsGVFSuplcue/s185/DragonD.png">


Here is the image signature that i use in my another blog , instead of the Author's name.

Now follow the Safety Saving Steps.

And

Changing Sidebar header images

If you are using a some what developed blogger template , you can see a image in the back ground of the caption of your side bar gadgets. Changing these is a some what complicated task. Really , Changing is not complicated , but creating a suitable graphic is the complicated task. If you know graphic designing , this will be easy. For others , it's better to skip this lesson and read the next one.



Here is the side bar header image of my blog




So , here is the way to change it

First of all , create a suitable sidebar header image.Then upload it to a image hosting site.

Now,

1. Edit your Template
2. Now find out sidebar h2 ( press 'Ctrl' + F to open your browser's search box)



Now scroll down few lines and you will find out a code line similar to

background:#f5fbfe url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjElc-nPDVg0bpFgm6DXxBpCyV4jnj0ZhITLLr4WAYTduR0qUMPBPMkfaVoPfwrYQj29Gmb587X3sMxKu4ZBv6Os8mRqnRIw1yGCz0L8mgA33HmQ6SsbNzBPVMTN2G-JFPpw7Fs7WJXBNE/s1600/sidebar-top.gif) no-repeat top center;

or

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjElc-nPDVg0bpFgm6DXxBpCyV4jnj0ZhITLLr4WAYTduR0qUMPBPMkfaVoPfwrYQj29Gmb587X3sMxKu4ZBv6Os8mRqnRIw1yGCz0L8mgA33HmQ6SsbNzBPVMTN2G-JFPpw7Fs7WJXBNE/s1600/sidebar-top.gif) ;

or

sidebar h2 { background: transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjQlQybe9ni2F9B6dhUicxS8q4sn3fMKdh6tJ9ADs7TDGsfNKDtPMMzH3mQmiRkHjFq4cAxXB0oKT3cRF-R0TyT9fdUEn_fkQeVE6GD-baZW2TjQp509ZJuHyaQ878J-73TLi22jcx8UdE/s1600/widget-title.gif) right no-repeat;


or another code line which is very similar to above code lines

just change background URL to the URL of the image , that you created.



Now follow the Safety Saving Steps.

And

Adding a Background Image

Adding a background images may make your blog attractive and also slow. If still want to add a background image to your blog , use a image of small size. ( i mean , less in Kilo bytes. If your background image is greater than 1 MB , that will be a hell ) best way is to use a pattern image in gif format. Use google to find out a one.

To add a background image for you blog,


1. Edit your Template
2. Now find out body { ( press 'Ctrl' + F to open your browser's search box)


Now paste this code line just below it , after adding the URL of your back ground image

background:url( Paste your URL of Background Image );



Background Patterns for you

background:url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitbTFfoZhBbZf2zvfoB-1irxfgitd27DUYurB-9Z9RpJm59Zn_ki73cAvgJJbtd7_nastkvfgy0AoQIUiHfONaxZKGWJ02G8KYmum5xM1c0GTFjNV3s6zI9yB_nuo8xTU_Xu1-wMmoLkU/s400/elephant_pattern.gif );


background:url( http://z.about.com/d/graphicssoft/1/0/9/2/5/Textile_Pattern_Set-2.png );


background:url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8FrRQfNl29C5Cp-2CJb9wp-XG9qMFqPCAIGYPpY41oXDv7TaRH9qtsKPTfIc9FxbOvjWCqOJRplb00ExXvQLwgAo9Fwfa_dlfxomeq_Xv3tHThwwx30YLQY1v0BU6WHodF0YFwuWpj9YZ/s400/the+pattern+tester.jpg );


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

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

Copy protection

If you don't want to get your posts copied by some one and post your posts in others blogs , here is a simple trick that you can use. By this code , right clicking on your site will be denied. How even , yet he can select your text by dragging and pressing Ctrl+C . But many of them try to copy by right clicking and selecting copy.


1. Edit your template ( How to edit your template )
2. Find out the code line <body> ( press 'Ctrl' + F to open your browser's search box)


Now replace <body> with following code line.

<body onmousedown="return false" oncontextmenu="return false" onselectstart="return false">


Now follow the Safety Saving Steps.

And

Adding Separate Meta Tags for Individual Posts

Adding Separate Meta Tags is an essential work if you want to make your blog popular. Google and yahoo rank your blog by page by page , separately. So , if you don't feel lazy right now , you can bring your blog to the top of google's search results. Lets start.


1. Edit your Template
2. Now find out <Head> ( press 'Ctrl' + F to open your browser's search box)


Now paste these code lines just after


<b:if cond='data:blog.url == " your Blog page's URL "'>
<meta content=' Type you post description here. some thing that will describe your post's content. ' name='description'/>
<meta content=' Type your tags here ' name='keywords'/>
</b:if>


that's all , keep in mind that " " is essential before and after your blog post's URL




Now follow the Safety Saving Steps.

And