Embedding an Instagram Post with BBCode Without Plugin
UPDATE: The media retrieval endpoint described below is no longer supported after October 24, 2020. See developer documentation here for details on how to migrate to a replacement endpoint. Thanks [Andrew].
Embedding an Instagram post is trivial on a WordPress blog like this one: copy the full Instagram URL (like https://www.instagram.com/p/BfryG0VnUmF/
) and paste it into the visual editor window. Behind the scenes, that URL is parsed to create an embed as shown here.
https://www.instagram.com/p/BfryG0VnUmF/
There are similar plugins to add an [instagram] tag to a BBCode-based web forum. But what if a forum does not have such direct support installed? This was the case for the web forum set up as community driven support for JPL's Open Source Rover.
On every Instagram post, there's an "Embed" option that will bring up a chunk of HTML (which links to some JavaScript) to create an embed. However, a BBCode based web forum does not allow embedding arbitrary HTML like that.
Time to read the manual which in this case is Instagram's developer resources page about embedding. They prefer that people use the fancy methods like that chunk of HTML we can't use. But way down towards the bottom, they do describe how to use the /media/
endpoint to pull down just an image file with no active components.
This is simple enough to use within the BBCode [IMG] tag. Then we can surround that image tag with a [URL] tag to turn it into a link to the Instagram post.
[URL=https://www.instagram.com/p/BfryG0VnUmF/][IMG]https://instagram.com/p/BfryG0VnUmF/media/?size=m[/IMG]
[/URL]
It's not as fancy as the full embed code, but it does get the basic point across and provides an easy way to access the original Instagram post. Good enough for a SGVHAK Rover post on the JPL OSR web forum.