U4-8529 - Instagram embed code only showing an instagram icon, not the image.

Created by Owain Williams 27 May 2016, 09:03:04 Updated by Sebastiaan Janssen 24 Jun 2016, 10:46:31

Tags: Unscheduled Gold partner

Relates to: U4-8646

I was wanting to embed a photo from my instagram account in to my blog. I thought it would be a simple case of copying the embed code from the photo, paste it in to my editor and off I go. This doesn't seem to be the case though. As you can see from the screenshot, I get the photo information but no photo.

If I put just an image tag in to the html the image shoes perfectly but not in the style of an instagram photo.

i.e.

I posted the issue on stack overflow and others are having similar problems. Someone posted a work around but it's not ideal.

It seems to be the path that is embedded in to the post is the cause of the problem:

I was facing the same problem and noticed this line in the embed code:

When I added the scheme ("http") to the source like below, the image showed up correctly.

1 Attachments

Comments

Sebastiaan Janssen 24 Jun 2016, 10:46:21

I don't understand how you came to this conclusion? Is the problem that the preview is not showing when you're clicking the "Retrieve" button? Even though the protocol-relative URL is now seen as an anti-pattern (http://www.paulirish.com/2010/the-protocol-relative-url/) it should in no way affect the loading of the embeds.js script. So I think you're assumption is incorrect and would encourage you to look at the network tab of your browser to confirm that embeds.js loads. In my tests on a local site, are remote http site and a remote https site, the preview loads perfectly. You may, however be affected by U4-8646 as well, make sure to read up on the details.

If you can explain how the protocol-relative URL would stop embeds.js from loading then make sure to re-open this issue but as of now I can't reproduce nor do the protocols interfere with loading it to the best of my knowledge.


Priority: Normal

Type: Bug

State: Can't Reproduce

Assignee:

Difficulty: Normal

Category:

Backwards Compatible: True

Fix Submitted:

Affected versions:

Due in version:

Sprint:

Story Points:

Cycle: