Instagram Embed Block

[ascordato]

Issue Overview

The embed block for Instagram doesn't work.

Currently running latest version of WP with Gutenberg 1.7 installed. Reproduced this error in Chrome and Safari.

Steps to Reproduce (for bugs)

1. Add the block to a post
2. Paste the Instagram URL for the image

I also tried pasting the actual embed code Instagram provides too and the message "Please enter a URL" appears.

Expected Behavior

Current Behavior

Possible Solution

Screenshots / Video

Related Issues and/or PRs

Todos

• Tests
• Documentation

[aduth]

Can you share the URL you're using for the embed? I am not able to recreate the issue with a sample URL:

https://www.instagram.com/p/Bbba7EYljLv/

[ascordato]

Here you go: https://www.instagram.com/p/Bbb011mBv5K/

I tried the URL you provided above and got the same error.

[gziolo]

I was able to reproduce on ver. 1.7

[hedgefield]

I was able to embed both URLs successfully on 1.7. They do seem kinda squished horizontally though, but that's another design matter.

[ascordato]

I just tried again on my end after upgrading to 4.9 and still get the same error. FWIW, I can get other embed blocks like Youtube to work as expected.

…

On Thu, Nov 16, 2017 at 5:25 AM, Tim Hengeveld ***@***.***> wrote: I was able to embed both URLs successfully on 1.7. They do seem kinda squished horizontally though, but that's another design matter. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#3499 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AGmFN_8gFKZJeXTEzBT9Dubz7uXgVZoEks5s3A2HgaJpZM4Qfcol> .

[Soean]

I was able to embed Instagram posts with gutenberg 1.7.

[GaryJones]

With GB 1.9.0, it works, but only appears as about 50% width of the content area. Tried with a video and photo.

Aside: The Flickr Embed also seems to suffer from the same symptoms - can't expand to be the width of the rest of the textual content, can't center it within the content area etc.

[clintlalonde]

Having same issue. Getting error when trying to embed an Instagram photo. Using my own photo (https://www.instagram.com/p/BX-4fN9Dkcy/) and the test photo given above (https://www.instagram.com/p/Bbba7EYljLv/) gets same results.

On self-hosted WordPress 4.9.1 using Guttenberg 1.9.1. Win 10 FF Quantum 57.0.3.

[abdullah1908]

Facing the same issue and tried different Instagram profile URLs but the same result

WordPress 4.9.4
Gutenberg 2.2
Google Chrome 64.0.3282.167

[aaronjorbin]

I ran into this issue today.

WordPress: nightly
Guteneberg 2.6: https://www.instagram.com/p/BhR3XVRFSJL/
Chrome: 65.0.3325.181

Instagram URL trying to embed: https://www.instagram.com/p/BhR3XVRFSJL/

I've tracked this down to being an issue caused by jetpack. It's removal of the Instagram provider in jetpack/modules/shortcodes/instagram.php means that it isn't being picked up by the proxy.

[aduth]

Should we close this in favor of Automattic/jetpack#9331 ? I assume that the plugin should at least leave some oEmbed handler, even if it implements its own alternative. The embed block should work so long as any oEmbed pattern matches. The issue is that Jetpack removes all of them, and only replaces with an wp_embed_register_handler:

https://github.com/Automattic/jetpack/blob/8a1a92bcfe1b5d4eec671237dd7b85959fccaba3/modules/shortcodes/instagram.php#L62-L63

That said, should the oEmbed proxy endpoint support these patterns as well?

[aaronjorbin]

@swissspidy and @pento Can likely speak to the oEmbed proxy endpoint the best, but I think it may make sense to fix things up so that this isn't an issue for other plugins in the long run. If that's the case, I think closing this for a core ticket will make the most sense.

[pento]

We can do this. We have the technology.