Pretty Darn Cute Design

Feminine WordPress Themes and Tutorials

Main navigation

Add a Styled Pinterest Widget to Your Blog

Pinterest is all the rage lately. Show off all of your beautiful pins in style by following this very simple tutorial. Your end result will look like little Pinterest Polaroids. Here is a screenshot of what it will look like when we’re finished:

{click images to view full size}

This tutorial is for WordPress based websites. Because WordPress is awesome.

Alrighty we are going to start by installing the Pinterest RSS Widget Plugin.

On your dashboard go to Plugins > Add New, then search for “Pinterest RSS Widget” and install. Next go to Appearance > Editor. Scroll down to the bottom of your CSS (Style Sheet) and paste the following code:

Click “Update File” Next click on Appearance > Widgets. Locate the “Pinterest RSS Widget” in your available widgets section and drag it to the sidebar of your choice.

My settings displayed below will work perfectly with the Adorable WordPress theme.

You can adjust these settings until your widget looks the way you like. You will also want to take in account the 7px padding and the 12px margin between the images added in your CSS.

Pin91
Share1
Email
Buffer
Stumble
Shares 92

Join 17k+ subscribers receiving pretty news & Free downloads in their inbox

Reader Interactions

Comments

    • 2

      Hi Stephany 🙂 it looks like you’re using WordPress.com. I’m not familiar with what they do and do not allow as I use WordPress.org. I would try submitting a support ticket to them to see what’s causing the problem.

      Reply
  3. 5

    Hi Lindsey!
    My child theme is Fashionista, but I was hoping that I could make this work. I am a code dummy. But, I follow directions pretty well. My sidebar now says, “My Recent Pins” – but that’s it…nothing else is there…no pics, nothing. Do you think that it doesn’t work because of the different theme?
    Thanks for you generosity in providing the Pinterest coding. I just wish I was able to make it work.

    Reply
  4. 8

    Thanks! Little by little with lots of your help I am making my site look the way I want it to 🙂

    Reply
  8. 15

    Thank you so much for this – I’m using the Adorable theme and was wondering how you got that groovy Pinterest box – it looks great!

    I would love a tutorial explaining how you put together your “get connected” box. I’m muddling my way along now, between photoshop and image-maps.com
    No problems designing my icons, just not quite sure how to link everything up, and get it looking right with heading, background, etc
    I’ll probably work it out (with a few Tim-Tams – exceptionally yummy Australian chocolate biscuits), but I’m sure you know a few shortcuts to save me those calories.

    Reply
  9. 16

    Thanks very much. I just did a little experimenting and its really cool. I like the fact that you havet the “follow me on pinterest” in the bottom. Would be nice if you could change the “me” to “us”….

    Cheers

    Reply
  10. 17

    Hi! I am so glad I found this because I am VERY slowly trying to figure out how to get things configured. I copied the code exactly, but my pics do not have spaces in between? They are all squished together? Am I doing something wrong? Thanks so much!

    Reply
    • 18

      Hi Jayme! I see them having spaces between, were you able to figure out what was the problem?

      Reply
  11. 19

    Thanks Lindsey for the great recommendation!

    I just wanted to pass along another tool called Tint. It lets you display any Pinterest account pins or any Pinterest board pins to your likening. You can totally curate to your preference and then embed it into your website. It took me about 5 minutes to create and integrate into my site. They have infinite scroll and multiple themes to choose from too!

    Feel free to check it out here: http://www.tintup.com/blog/the-best-pinterest-for-a-business-widget/

    Thanks,
    Tim

    Reply
  12. 20

    Hi, Lindsey

    I’m wondering if this settings works on morden blogger theme. I tried to follow all instruction but It’s not a success. Pls help. 🙂 Many Thanks!

    Reply
  13. 22

    Hi Lindsey! I’m trying to build a new site using the Modern Theme (link left in the website field for you) and I’m having problems with the Pinterest widget using this theme. For some reason it’s showing pink circles? I believe it is the image for bullets in a list but I’m not sure. How do I adjust your theme to remove this odd pink bullet? Thanks! Amanda

    Reply
  14. 23

    HI, LINDSEY! WHERE CAN I FIND THE SOCIAL MEDIA WIDGET DISPLAYED AT THIS PICTURE? JUST LOVE THIS! MINEIS ADORABLE! THANKS! :0

    Reply
  15. 24

    Hello, I have followed the directions exactly however, it’s not perfect spaced on my modern blogger pro theme. The pics are larger than frames. I’ve tried playing around with the measurements but I can’t seem to get it right. Can you help?

    Reply
  16. 26

    Hi Lindsey!

    I’m just starting to put together my website with the Jane theme and love this widget! However, I think I’m having a similar problem as DeDee. The pins aren’t fitting in the frames. I’ve tried different pixel sizes but the frames seem to change as the pixel sizes of the pins change. Any suggestions? THANK YOU!!

    Reply
  17. 29

    I am having problems with the pins being to large also. They are going into the free space. I am using Modern blogger Pro. I have the size set to 75×75 and all else is set exactly like you suggested.
    Thanks
    Bridget

    Reply
    • 30

      Hi Bridget! This plugin started causing issues, so we took it off of our demo site. The demo had 125px images I believe. It still works, but if you have any issues with it you’ll want to contact the plugin developer. Your site looks great!

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

Hey Girl, hey! Join 17k+ subscribers getting Free Stuff and pretty updates delivered to their inbox!


Copyright © 2017 Pretty Darn Cute Design
est. 2005