CODEWITHSUNDEEP
javascriptembedpinterest
Adam
Adam

Reputation: 6152

Pinterest embed image does not show

I'm trying to embed a Pinterest link, like explained here.

I've added this Pinterest link to a blog:

<a href="https://www.pinterest.com/pin/139330182194785581/" data-pin-do="embedPin"></a>

I've also added script <script type="text/javascript" async src="//assets.pinterest.com/js/pinit.js"></script> before my </body> tag.

But the Pinterest image does not show. See a live example here.

From the errors in the Chrome console I don't learn why.

What can I do?

Upvotes: 15

Views: 1516

Answers (2)

Kevin Neven
Kevin Neven

Reputation: 1

Your problem is that it redirects as stated above. From where would you be getting your pins? Because if it's a trusted source you should be fine, but if it's from user input you might run into this problem allot. Maybe you could try to write a bit of javascript to detect such flaws and display the correct one. I'm not sure how to go about that though.

Upvotes: 0

Bsalex
Bsalex

Reputation: 2970

You have a strange Pin there. Looking into console I see that it is not found.

Request URL:https://widgets.pinterest.com/v3/pidgets/pins/info/?pin_ids=139330182194785581&sub=www&base_scheme=https&callback=PIN_1518097590913.f.callback[0]

Response:
PIN_1518097590913.f.callback[0]({"status": "success", "message": "ok", "code": 0, "data": [{"id": "139330182194785581", "error": "Not found"}]})

When I go by this link https://www.pinterest.com/pin/139330182194785581/ in a browser - I am redirected to https://www.pinterest.com/pin/379006124862874372/

So try the following code: 

<a data-pin-do="embedPin" href="https://www.pinterest.com/pin/379006124862874372/"></a>

<script async defer src="//assets.pinterest.com/js/pinit.js"></script>

Upvotes: 10

Related Questions