Beautify Your Blog || Pinterest Mouseover
A few weeks ago I helped host a blogger round table all about blog design. There seemed to be a lot of the same questions from bloggers - they all wanted a simple fix for similar problems. Rather than just share it with the few ladies at the round table, I wanted to share it with all of you. So here we are with my new mini-series beautify your blog. Today's topic? Pinterest Mouseover - The Hovering Pin It Button!
2. Under the Live on Blog thumbnail click "Edit HTML".
3. Locate the </body> tag near the end of the template - Use Ctrl F or Apple F for easy searching.
4. Paste the following code right above the </body> tag:
6. And happy pinning!
----------------------------------------------------------------------
1. In the left sidebar of your blogger dashboard click "Template".2. Under the Live on Blog thumbnail click "Edit HTML".
3. Locate the </body> tag near the end of the template - Use Ctrl F or Apple F for easy searching.
4. Paste the following code right above the </body> tag:
<script> //<![CDATA[ var bs_pinButtonURL = "http://3.bp.blogspot.com/-y3xzTGiGzH0/UK4XOaUpdaI/AAAAAAAADw8/Z1MH4Jr4Efo/s1600/pinterestx1_72.png"; var bs_pinButtonPos = "center"; var bs_pinPrefix = ""; var bs_pinSuffix = ""; //]]> </script> <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script> <script id='bs_pinOnHover' src='http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bs_pinOnHoverv1_min.js' type='text/javascript'> // This Pinterest Hover Button is brought to you by bloggersentral.com. // Visit http://www.bloggersentral.com/2012/11/pinterest-pin-it-button-on-image-hover.html for details. // Feel free to use and share, but please keep this notice intact. </script>
*HTML Code provided by Blogger Central.*
- If you want to use your own button or image replace the RED URL with the direct URL to your image - replace the URL online, keep the quotes
- To change the placement of the button replace center - in BLUE with the new position:
- topleft
- topright
- bottomleft
- bottomright
6. And happy pinning!
Do you want a new design for your blog? Are you afraid of using HTML and coding? Whether you blog for fun, for family, or for fame - LISTEN UP! I've been bitten by the design bug. I've been learning all sorts of new tips, tricks, and code for blog design. And... since I just BARELY redeigned my blog I'm not ready for a new one. So I am giving away ONE FREE BLOG DESIGN! Enter Below!
What steps do you want to learn to beautify your blog?