Jump to content

[FREE MODULE] Pinterest - Add a Pinterest button to the product page or any other location


Recommended Posts

This module adds a Pinterest button to the product page.

You can configure the display type and count, as well at the description source and length.

Tested on PrestaShop 1.4, 1.5 & 1.6.x

Available at http://www.presto-ch...-pinterest.html

 

Direct Download: http://bit.ly/1me7mx1
 

V1.1 (01/03/13)
Support for PS 1.5


V1.1.1 (08/29/13)
Fix for new custom hook system in PS 1.5.5+

 

V1.2 (06/30/14)
Optimized for PrestaShop 1.6

post-20153-0-89328000-1404148205_thumb.png

post-20153-0-09223400-1404148210_thumb.png

  • Like 1

Share this post


Link to post
Share on other sites
  • 2 weeks later...

You can use the custom hook that comes with the module, there are instructions in the configuration page on how to use it.

You can place it anywhere you want on the product page (product.tpl)

Share this post


Link to post
Share on other sites

Did you copy FrontController.php override?

Did you clear the smarty cache.

Did you make sure the module is hooked in the new hook (positions page in the BO)?

Share this post


Link to post
Share on other sites
  • 3 weeks later...

I've managed to position the facebook and googleplus one in the hook I was after, but I then needed to get them in line rather than in a list.

 

I'm using lines along the following in my global css file....

 

.facebook_container {margin-top: 5px;}

.gplusone_container {margin-left: 100px; margin-top: -20px;}

 

(still playing to get the position exactly right) but what do I use for the pinterest one? I figured out the other two by using inspect element, but it doesn't say the name of it for the pinterest one?

 

I'm trying to do exactly the same (putting the buttons in a horizontal row). I inserted the code above in my global.css file in my theme folder, but nothing changes. Is that the right .css file? Or do I have to change something else in the module .tpl files first?

 

Thanks for your help.

Share this post


Link to post
Share on other sites

Hi

 

This is a good module but when I leave the checkbox ticked for Facebook and it shares it with Facebook, the link shared on my timeline feed contains no information, no image, no product detail. Just the board name I pinned to & pinterest.com linked to the pin. How can we fix this? Example: http://awesomescreenshot.com/0214v21bf

Share this post


Link to post
Share on other sites

I believe this is handled entirely by Pinterest, I will try to look into it and see what I can find.

Do you know of a site that has the Pinterest button and the facebook share send all the info you are missing?

Share this post


Link to post
Share on other sites
  • 2 weeks later...

Ok what I've managed to do as I can't seem to shift the pinit one, is to arrange the others around it.

 

So, wherever you put the hooks, make sure your pinterest one is first and then the other two. Then try the following in your css:

 

.facebook_container {display: inline-block; margin-top: -20px; margin-left: 50px;}

.gplusone_container {display: inline-block; margin-top: -30px;}

 

It's worked for me, if you look at my website (link above) you will see them in a nice neat line now.

 

It took me a a while, but I managed to get them in one row too. I had to add position: absolute though, so ended up adding this to my global.css folder: (I am not using google+1, just pinterest and facebook)

 

.facebook_container {position: absolute; display: inline-block; margin-top: -22px; margin-left: 50px;}

 

You can see it in action here:

 

http://www.lettersets.com/en/124-san-x-memo-pad-rilakkuma-pink.html

 

By the way, stickees, on your website I still see your googleplusone aligned higher than the other two.

Share this post


Link to post
Share on other sites

Additional info: I just added a twitter button too. Using a simple code, my product.tpl file now looks like this:

 

{$HOOK_PINTEREST}
<div>
<!-- LK twitter mod --> <p>
<a href="http://twitter.com/share" class="twitter-share-button"
data-text="Look how cute! I found this @LetterSets : {$product->name}" data-count="horizontal">Tweet</a> <script type="text/javascript"
src="http://platform.twitter.com/widgets.js"></script> </p>
<!-- end LK twitter mod -->
</div>
{$HOOK_FACEBOOK_LIKE}

 

And my global.css like this:

 

/* social media */
.twitter-share-button {position: absolute; display: inline-block; margin-top: -27px; margin-left: 45px;}
.facebook_container {position: absolute; display: inline-block; margin-top: -27px; margin-left: 139px;}

 

They all align neatly. I've put the Facebook one on the right as it appears to take the longest to load.

Share this post


Link to post
Share on other sites

Cheers for the Twitter one, works a charm :)

 

I *think* mine should all show as lined up now.

 

Yep, all in one perfect line.

 

My Facebook one appears to load really slow though - it's the last thing to load on the page. Does anybody have a quicker solution? Maybe a link like the Twitter one I posted above?

Share this post


Link to post
Share on other sites
  • 9 months later...
  • 1 year later...
Guest
This topic is now closed to further replies.
×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More