Create a Dynamic Social Network Buttons

Social Network buttons have been very useful for a website/blog to be known more. I guess having a social network button is a "must" in a blog/website. It helps a lot, and placing it correctly should be consider.
social icons

The easiest way to add social network buttons is through addthis

You can copy the code above or just go to their site and choose a different style. Before doing this, view this demo first.
You'll notice that when we scroll down the page, the social network buttons remains on top. Do you like it? If yes, read this tutorial ahead. :D

After installing the social network buttons, if you don't know how to do it. Consider this step.
  1. From Dashboard > Template > Edit HTML > tick the Expand Widget Templates
  2. Find  <div class='post-header-line-1'/> then paste the addthis code below it. 
  3. Save it!
After saving it, let's do the effect. Find  </head>  then paste this code above it.



The script's function is to add a new CSS selector and fixed the position of the buttons when scrolling the page to make it visible as scrolled by the reader.

Now, add this CSS above the ]]></b:skin>



Now, you need to add this line of code to the addthis code,
<div id='dynamicbuttons'>addthis codes here....
</div>

If it's not functioning consider adding this code above the ]]></b:skin>


<script src='http://code.jquery.com/jquery-latest.js'/>


That's it folks! Hope it helps! Errors? Just comment below. :)

Popular posts from this blog

Set table width to 100% on PDF export in Datatables

Add/Subtract Single Digit Number in Assembly Language