How To Add A Slide Or Nudge Effect To Blogger Links

Add some special effects to various items in your blog is another way of engaging your readers to your blog.In this post, we have made a very simple but effective slide effect to blogger links.

Demo:

Demo Link 1
Demo Link 2
Demo Link 3
Demo Link 4

Steps To Add Slide Effect To All Link:

Log in to your Blogger Account.
Go to Templates >> Edit HTML.
Find for ]]></b:skin> tag.
Paste the below code just before the closing of ]]></b:skin> tag.

a{
-webkit-transition:all 0.4s ease-in-out;
-moz-transition:all 0.4s ease-in-out;
-ms-transition:all 0.4s ease-in-out;
-o-transition:all 0.4s ease-in-out;
}
a:hover{
margin-left:15px;
}

Now, click on Save the Template.

Steps to Add Slide Effect To Specific Link:

Log in to your Blogger Account.
Go to Templates >> Edit Html.
Find for ]]></b:skin> tag.
Paste the below code just before the closing of ]]></b:skin> tag.

.slide{
-webkit-transition:all 0.4s ease-in-out;
-moz-transition:all 0.4s ease-in-out;
-ms-transition:all 0.4s ease-in-out;
-o-transition:all 0.4s ease-in-out;
}
.slide:hover{
margin-left:15px;
}

Now, click on Save the Template.

What You Need To Do:

To add this Slide Effect to specific links paste the below code there.

<a class="slide" href="Your Links URL">Your Link Text</a>

Change the Blue text as it is written.

Now, you can enjoy the very good looking slide or nudge effect to your Blog. This effect will now surely attract and engage your readers with entertainment.