Pinterest embed image does not show
Asked Answered
Z

2

15

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?

Zymolysis answered 6/2, 2018 at 11:14 Comment(4)
I've noticed in the request console in browser, some status message about requesting the pin. Couldn't this help you in some way? ` PIN_1518090806339.f.callback[0]({"status": "success", "message": "ok", "code": 0, "data": [{"id": "139330182194785581", "error": "Not found"}]}) ` Could you try if that means something? If you could request any other pin? Maybe that might lead us somewhere.Holding
Nah, that's probably just telling us: "There seems to be no error.". What if you try including this: <script async='async' data-pin-hover='true' data-pin-round='true' defer='defer' src='//assets.pinterest.com/js/pinit.js'></script> instead of your one?Holding
@MilanVlach thanks. See live version for the updated script. Still no error or image showing though. What else could it be?Zymolysis
Could you try these tips under Common issues? help.pinterest.com/en/articles/website-widgetsHolding
S
10

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>
Stav answered 8/2, 2018 at 13:58 Comment(0)
P
0

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.

Pennipennie answered 15/2, 2018 at 9:32 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.