I had a ton of emails regarding the custom pin it button, so here's a quick tutorial for you!
Feel free to share!
1. Create Button & Get URL
+ I used photoshop to make a custom button, but you can also just search for one online and use that!
- If you do use photo bucket, make sure and create it with a transparent background and save it as a PNG file. JPEG does not support the transparency so you will end up with a dumb white square block if you try it. (Trust me, I learned the hard way)
+ Once you’ve got your image, upload it to photo bucket and under the share option, get the direct link.
2. Install Your Code:
+ Now, go into your blog’s template and click edit html
+ Click in the text area and [command+f] or [control+f] for non-mac users and search for the < / body > tag. It should be near the bottom of the template.
+ Copy the code below and insert it right above that tag. This code will give you the button I currently have on my photos.
var bs_pinButtonURL = "
var bs_pinButtonPos = "bottomright";
var bs_pinPrefix = "";
var bs_pinSuffix = "";
<script id='bs_pinOnHover' src='
+ To use your own button, just replace the URL in the third line with the direct link from step one. However, when you paste, make sure and stay within the quotes or the coding won’t work.
+ If you want to reposition the button, just replace
in the fourth line with one of these:
+ Now just click save and it should work!