Miva Merchant Ecommerce Blog

How To Add Pinterest “Pin It” Buttons To Your Miva Merchant Product Pages

Posted by Aura Talbott to Design & Development on January 25th, 2012

Special thanks to Steve Fronek of Ten23Media and Rainebrooke for letting us share information from his recent blog post on this topic. 

Are you using Pinterest to help market your ecommerce business online? Just a few months ago, that question would have likely drawn blank looks from most ecommerce store owners.  As the first month of the new year draws to a close, however it is clear that thanks to a growing user base, Pinterest is growing, and marketers are taking notice.

I was unfamiliar with Pinterest until recently—I had heard of it, but I didn’t really understand what it was or how it could benefit an ecommerce business.  It wasn’t until I saw an article in Practical Ecommerce about this topic, and began to see similar articles appearing in the Miva Merchant Twitter feed, that I began to take notice. 


Rainebrooke on Pinterest

About Pinterest

If you’re not familiar with the site itself, picture a giant virtual bulletin board where you can “pin” things that you like up for others to see, and you get the idea.  Pinterest members are avid “pinners” and as a result, they can be avid brand ambassadors for their favorite products and companies.

From an ecommerce perspective, Pinterest provides a unique opportunity for merchants to showcase their products, and interact with other Pinterest users at the same time.  Joining Pinterest is by-invite only, but invites are easily obtained, either via Pinterest itself or by asking another user to invite you.

  For Miva Merchant users, adding Pinterest “Pin It” buttons to your existing product page creates an additional way to use the power of Pinterest to drive traffic to your site and increase awareness of the products that you sell.


Paula Montgomery (OnRepurpose) On Pinterest

Adding Pinterest “Pin It” Buttons To Your Miva Merchant Product Pages

Steve Fronek, owner of Rainebrooke, a Miva Merchant-powered ecommerce store best known for selling pink laptop bags for women, recently posted an article on his Ten23Media blog about how to add Pinterest “Pin It” buttons to your Miva Merchant product pages, making it easy for your customers to “Pin” and share your products.  The following is an excerpt from his blog post.  You can read the original post in its entirety here.

If your Miva Merchant store offers products which are very visual, target women or are commonly shared on social networks (most stores will at least fall into one of these)… then you’ll want to consider adding the Pinterest button to your product pages.

Visitors to my product pages will now be able to click the “Pin it” button and easily pin my products to their boards. While users of Pinterest can use the “Pin it” feature that can be added to a browsers toolbar, I feel it’s best to put the button right in front of the visitor. You can check out the button on one of my product pages.

If you want to add the “Pin it” button to a Miva Merchant product page, it too is fairly straight forward, but requires a little different formatting of the code.

The following is a breakdown of the code I use on my Miva Merchant product page template.

 <a href=”http://pinterest.com/pin/create/button/?url=http://www.rainebrooke.com/product/&mvta:product:code;.html&media= http://&mvt:global:domain:name;/mm5/&mvte:product:thumbnail;&description= &mvt:product:name;&mvt:product:customfield_values:customfields:subtitle; at Rainebrooke.com” count-layout=”horizontal”>Pin It</a>
<script type=”text/javascript” src=”http://assets.pinterest.com/js/pinit.js”></script>

Here are three areas above (in bold) that you’ll need to change for your Miva Merchant store. They are the URL to the product page, the URL to the product image, and the description you want to use. Note: there should be no spaces in the href code above.

With simple use of the Miva Merchant tags you can have each product page populate the “Pin it” button with the correct information. In my code above you’ll notice the formatting I use for my store. Insert the page and image URL format your store uses and then the description you want shown. For my description I use the product name, a custom field for subtitle (which is sometimes part of my products name) and then I end the description with my domain name “at Rainebrooke.com”.

All that’s left is to insert the code into your Miva Merchant product page template in the location that you want it displayed.

Have you or are you planning to expand your social media reach like Rainebrooke, Paula Montgomery (On Repurpose), The Office Dealer, and other Miva Merchant stores by joining Pinterest and adding “Pin It” buttons to your product pages? Feel free to leave a comment, share a link to your Pinterest page, and let us know.


The Office Dealer on Pinterest

 

Join the Discussion

Steve @Rainebrooke January 25, 2012

Thanks for the mention and for including my blog post Aura.

Aura Talbott January 26, 2012

You’re welcome Steve, thanks for sharing your post with us.

Aura

Holly Nelson January 26, 2012

GREAT post!!! Thanks for sharing this information. Rainebrooke has it going on!!

Steve @Rainebrooke January 26, 2012

YW Aura… and thanks Holly!

Mission Restaurant Supply January 26, 2012

Thank you for this great article! We just recently got a Pinterest account at Mission Restaurant Supply and we’re looking forward to experimenting with this for our Ecommerce sector!

Leslie January 26, 2012

Can you add the Pin It button without a Pin It account? Sorry for the ignorant question - I’m on the waiting list to get a Pinterest account.

Steve @Rainebrooke January 26, 2012

Leslie, yes you can add the button without an account. I just sent you a Tweet. If you DM me your email address I can send you a Pinterest invite so you don’t have to wait anymore.

Steve @Rainebrooke January 31, 2012

Aura, I just became aware that Pinterest works with Skimlinks to swap out “pin it” links with an affiliate link. For merchants who have added the “pin it” button and that also have an affiliate program with Skimlinks (Skimbit Ltd.) as an affiliate; you need to be aware that all “pin it” links which are created will create a commission for Pinterest if the click thru turns into a sale. I’m not upset about Pinterest wanting to make money, but I am upset at the fact that Pinterest is hiding this relationship with Skimlinks. They need to clearly disclose this fact on their site.

Philip Hansen January 31, 2012

Thanks for the post! I wasn’t able to figure it out at first, but started fresh by gettting the static code from pinterest. I think the main difference was a missing class=“pin-it-button”... I’m not sure.

Here’s my product page with a shiny pin-it button!: http://www.typewriterboneyard.com/p/book-lamp-secrets.html

Rem February 12, 2012

Oh, Pinterest, I love you some. And I miassvely second #1 - things linking back to Tumblr accounts is my biggest pet peeve!

Candy February 27, 2012

I am also new to Pinterest but would love to add an Pin-It button to my product page.  However, my code is not working -

<a class=“pin-it-button”>Pin It</a>
[removed][removed]

The Pinterest jpg doesn’t appear and I get an error when I click on Pin-It text.  Thanks for any help you can provide.
—Candy

Caroline March 18, 2012

I requested a Pinterest invite a few days ago and haven’t heard back.  How long does it take??

Girlfirends Lingerie April 03, 2012

is there any new updates to this code Philip. Your page example looks great with it on there. Cant seem to get i to work on mine,

Philip Hansen April 03, 2012

Hey Dan,

Here’s the code I used. I had to manipulate a bit, but it seems to work ok:

Pin It
[removed][removed]

Steve @Rainebrooke April 04, 2012

Hi all, Philip is correct that the code in the post above should include the class. I think it accidentally got left out during the move from my original blog post to this Miva post.
Since Philip’s code is getting cut off in the comments above, all you should have to do is add: class=“pin-it-button” right before the count layout that you want to use.  So for example,, if you want the horizontal count, the code would be:
class=”pin-it-button” count-layout=”horizontal”

Stephen April 04, 2012

Any idea on getting the pinterest button to work on the category page level?

Leave a Comment

Notify me of follow-up comments?