Add Floating Social Media Sharing Buttons Below Blogger Shipping Service Titles

It is becoming increasingly of import to brand our posts appreciated together with shared on social networks together with i of the best ways to larn traffic to our spider web log or site together with boost sharing stats is to add together social sharing buttons.

In this tutorial nosotros volition run across how to add together a floating social media sharing bar below the championship of Blogger posts, therefore when a reader scrolls downwards the page, he volition yet move able to run across the sharing buttons without having to scroll dorsum to the top.

Adding the below jQuery script volition brand the buttons float inward a fixed seat every bit shortly every bit they accomplish "the top" of the page. By scrolling back, the buttons volition supply to their initial position.

The social sharing bar includes buttons for Facebook, Twitter, Google+, together with Pinterest.

Social Media Sharing Buttons below Blogger Post Title

Step 1. From the Blogger Dashboard, larn to "Template" together with click on the "Edit HTML" button:

Step 2. Click anywhere within the code surface area together with press the CTRL + F keys to opened upwards the search box. Once you lot run across the search box, type the tag within the search box together with hitting Enter to honour it.

Step 3. Just to a higher house add together this script:

Step 4. Now earlier the ]]> tag (press CTRL + F to honour it) add together the next CSS styles:

#floating-social-buttons {
padding: 6px 0px 12px;
position: absolute;
background: #F6F6F6;
border-bottom: 1px enterprise #DEDEDE;
width: 550px;
height: 18px;
z-index: 99;
}
.floating-social-buttons {
margin-left: 5px !important;
}
.floating-social-buttons li {
float: left;
margin-left: 5px;
list-style:none;
}

To modify the width of the bar, modify the 550px values inward red. Note that this value likewise appears inward the script which likewise needs to move modified.

Step 5. Finally, simply below the minute

(press CTRL + F together with hitting Enter twice to honour the minute one) add together the next code: