How To Add Up Down Sliding Touch Me Social Widget To Blogger Site

Social Media plays an Important role in SEO of your website. Adding a Cool Up down Sliding Touch me social widget will definitely increase the attention of your visitor. Here is a simple tips to add a sliding up down touch me to your blogger website. This is just a simple piece of code that you need to add. I will show you the process. You will get RSS, Facebook, Google Plus, And Twitter Link.

See Here the DEMO of Up Down Sliding Touch Me Social Widget

For Blogger BlogSpot website:

1. Go to Blogger Dashboard
2. Click Layout
3. Hit Add a Gadget
4. Select HTML/JavaScript.
5. Copy and paste The following code.
6. You can add a title if you wish.

Code for Up Down Sliding Touch Me Button

    <style>
        /*--------Up Down Sliding Touch Me Sharing Widget By http://howto.medinfo24.com/ ------*/
        .touchme a {
        display:block;
        height:50px;
        width:50px;
        padding:0 4px;
        float:left;
        background:transparent url(http://howto.medinfo24.com/wp-content/uploads/2013/01/Sharing-Touch-Me-Button-by-www.howto_.medinfo24.com_.png) no-repeat;
        -webkit-transition: ease-in 0.2s all;  
        -moz-transition: ease-in 0.2s all;  
        -o-transition: ease-in 0.2s all;  
        -ms-transition: ease-in 0.2s all;  
        transition: ease-in 0.2s all;
        cursor:pointer;

        }

        .touchme a.googleplus {
        background-position: 0px -58px;

        }
        .touchme a.googleplus:hover {
        background-position: 0px 0px;
        }

        .touchme a.twitter {
        background-position: 0px -290px;

        }
        .touchme a.twitter:hover {
        background-position: 0px -232px;

        }
        .touchme a.facebook {
        background-position: 0px -406px;

        }
        .touchme a.facebook:hover {
        background-position: 0px -348px;

        }

        .touchme a.rss {
        background-position: 0px -174px;

        }
        .touchme a.rss:hover {
        background-position: 0px -116px;

        }

        </style>

        <div class='touchme'>

        <!--RSS-->
        <a class='rss' href="YOUR RSS LINK" rel='external nofollow' target='_blank'></a>

        <!--Google Plus-->
        <a class='googleplus' href="YOUR GOOGLE PROFILE LINK" rel='external nofollow' target='_blank'></a>

        <!--Facebook-->
        <a class='facebook' href="YOUR FACEBOOK LINK" rel='external nofollow' target='_blank'></a>

        <!-- Twitter -->
        <a class='twitter' href="YOUR TWITTER LINK" rel='external nofollow' target='_blank' ></a>

        </div>

How To Customize the Settings:

In the code you will need to change the following links to your own RSS, Facebook, twitter, Google Plus link. Unless it will not work.

• Change YOUR RSS LINK with your Feed burner link.
• Change YOUR GOOGLE PROFILE LINK with your Google+ URL
• Change YOUR FACEBOOK LINK with your Facebook URL
• Change YOUR TWITTER LINK with your Twitter Profile URL

5. Hit save and you are all done!

If you have any problem please let me know.  I am always here to help you out. thanks

Tagged as: Add Slide Out for Blogger, blogger tips, Blogspot Tips, social button sidebar, social follow button, social follow button on sidebar, social media sidebar, social share, social share buttons, Touch me social, up down social