Adding Nudge Effect To Blogger Links Using Css

Nudge effect is a effect, when you place your mouse on a link, it will nudge. This effect developed with CSS3.In This tutorial I will teach you how to add CSS3 nudge effect to blogger links.After adding this effect in your blog all links or selected links slide when someone move there mouse over it. This effect makes your links more attractive.Here is a demo of CSS3 nudge effect on blogger links.

Before going to learn the tutorial, first check a demo for this tutorial below.

LINK NUDGING EFFECT DEMO

                                                   Live Demo

ADD NUDGING EFFECT TO ALL BLOGGER LINKS

•  Go To Blogger Dashboard

•  Click On Template Tab

• Backup your Template before making any changes to your blog

•  Now Click On Edit HTML Button -->Proceed -->Tick the Expand Widget Templates

• Press CTRL+F and Find the ]]></b:skin> Code there 

• Now Paste The Code Shown Below Just Before/Above ]]></b:skin> 

 

 

a:link { -webkit-transition: padding-left 250ms ease-out; -moz-transition: padding-left 250ms ease-out; } a:hover { padding-left: 12px;}

ADD NUDGING EFFECT TO SELECTED LINKS

•  Go To Blogger Dashboard

•  Click On Template Tab

• Backup your Template before making any changes to your blog

•  Now Click On Edit HTML Button -->Proceed -->Tick the Expand Widget Templates

• Press CTRL+F and Find the ]]></b:skin> Code there 

• Now Paste The Code Shown Below Just Before/Above ]]></b:skin> 

.votiveblog { -webkit-transition: padding-left 250ms ease-out; -moz-transition: padding-left 250ms ease-out; } .votiveblog:hover { padding-left: 12px;}

• Now Paste below code where you want to show Nudge links effect 

      <a class="votiveblog" href="YOUR LINK HERE">YOUR TEXT HERE</a>

I hope you like this article.If you needed any help just let me know.Do not forget to share it.Take good care of yourselves and your loved ones. Peace and blessings.

Some Important Gadgets For Blogger

Here we will show you some Blogger's top gadgets, very useful for your Blog.

1.Followers
Many bloggers don’t  use this gadget because they don't think it helps the look of the blog in any way. However, we recommend to use this gadget because if you have followers gadget then it shows that you want to make friends. It asks your visitors to follow your blog.

 Open your bloggers layout panel then click (add gadget), then click on (basic) Gadget option. There you will find this gadget.NOTE: This gadget Available for Dynamic Views.






2.Subscribe
Put this gadget in a prominent place on your blog. This is similar to the followers panel. By just clicking on this gadget  the visitors of your blog can subscribe to your page and get all your posts by email.

 Open your bloggers layout panel then click (add gadget), then click on (basic) Gadget option. There you will find this gadget. NOTE: This gadget Available for Dynamic Views.

3. HTML/JavaScript
This is a Third Party Gadget.It is impossible to have a blog without adding a few HTML/JavaScript  panels to it. By the help of this gadget you can be used to implement things like add this panels, twitter  updates, follow me, add me on Facebook etc. if you want to earn money online from blogging, you definitely need this top gadget for enabling ad sense and other ads.

 Open your bloggers layout panel then click (add gadget), then click on (basic) Gadget option. There you will find this gadget.

4.Pages
This gadget is a new addition to Blogger. Once if you've add this you can design  whatever you want for this feature and showcase it on your link bar or your side panel etc
.

  Go to your layout page. 'Add a gadget' then add 'pages.'

5.Blog list
This gadget has two important features. First one  is simply to pay back your blogging friends for supporting you. If You advertise  their sites on your blog so that your visitors can be introduced to them and this will same happened with you. It is very useful widget, must use it.

 Go to your layout page. 'Add a gadget' then add 'pages.' NOTE: This gadget Available for Dynamic Views.

6. Follow by Email
This widget make easy for readers to follow your blog by email address. It means when users want to follow your blog by email then they use this box,then they can receive your up coming posts by subscribe their email address.

  Go to your layout page. 'Add a gadget' then add 'pages

7.Recent Posts
  It shows your most recent posts, with optional summaries. You can edit this gadget for size and choose the amount of posts you want included. Visitors can access your recent articles with a click of a button.

 Open your bloggers layout panel then click (add gadget), then click on (featured) Gadget option. There, you will find this gadget.

8.Twitter Update
 Share your recent Twitter updates. Twitter and Facebook  play a very important role in your blogging life. Your new twitter followers can help spread the word about your blog on Twitter, and you can do the same for them.

 Open your bloggers layout panel then click (add gadget), then click on (featured) Gadget option. There, you will find this gadget.
           
                           We will upload more Important Gadgets for Blogger.
                          Please Keep visiting Votive Blog and like us On Facebook.