Weekend Warriors: "Pin It" Blog Button


Today, I am going to share with you how to create the "Official Pin It Hover Button" for Blogger! You know what I am talking about...those cute little red circles with the Pinterest "P" in the center. They appear on some blogs and websites when you hover over a picture. I am going to show you how easy it is for your blog to have it also!!


I always wondered how some websites had these awesome Pin It buttons for Pinterest on the pictures of their blog posts. Mine didn't. I wanted it. SO...I did a little research (aka Google) and I found this INCREDIBLE site Code It Pretty!

This site makes HTML code look like a breeze. Thank goodness because ain't nobody got time to learn HTML code. This site explains the pros and cons of all the different Pin It buttons. You can choose what works best for your needs and blog site. I really wanted the hover button to appear on my blog pictures. I decided to use BloggerSentral's Hovering Pin It Button tutorial. It literally took me all of 10 minutes to read and install on my blog! I accomplished all this while my seven year old was saying, "Mom, Mom, Mom, let's go play outside!!" You know those moments. You want to finish a task. Your kid doesn't care. Well, this worked out to be a win-win for everyone. 
I followed the step by step directions on the tutorial. 

1. I copied the HTML code in the tutorial I wanted to use.
2. I went into Blogger >Template>Edit HTML 
3.  I located the <body>
4. I pasted the code directly above <body>
5.SAVE
6.Ta-dah! Happy Pinning!

Now, see how it works!
 I just had to share this! It is going to be one of my Monday Made Its this summer. Just hover over the picture and watch the Pinterest button appear. How cool is that? 
I love this wreath! 35 Back-to-School Ideas | Positively Splendid {Crafts, Sewing, Recipes and Home Decor}
How darn cute is this??? I found this on Pinterest and just knew I was going to have make one for my classroom door! The step by step directions can be found HERE at the Polka Dot Chair. I am going to decorate mine with turquoise and black items to match my classroom color scheme. I love that I can leave it up all year if I want OR change our the items I decorate it with to go along with the holiday of each month. I feel like there are so many choices!!!

I hope you are now inspired to install the Pin It button on your blog and see how it works for you! Don't forget to hop on over to read some more fabulous ideas from some of my sweet blogging friends. Enjoy!


4 comments :

  1. Look at you gettin' all fancy with your coding! Thanks for the tips!! The wreath is adorable!

    Slainte,
    Molly
    Lucky to Be in First

    ReplyDelete
  2. How stinkin' cute is that wreath! Love it! Thanks for the coding tips. I just had to redo my hover button last week because it "disappeared".

    Marcy
    Saddle Up For 2nd Grade

    ReplyDelete
  3. I always wondered about that too Jaime. Thanks for teaching me something new today. I can't wait to see your new wreath!
    Deirdre
    A Burst of First

    ReplyDelete
  4. Thank you so much! I was always wondering how everyone did this!! I was able to add the Pinterest button to my blog now! Thank you for the quick tutorial! Your directions were awesome!!

    Mrs. 3rd Grade 

    ReplyDelete