How to link photos and videos on Instagram to Blog

Instagram is one of the most phenomenal social media moments. Instagram can be said that social media is mandatory for everyone for a blogger.

It's not complete blogging if it doesn't involve Instagram into a blog. Well, this time I will share tips on how to enter, link, embed or other terms embed photos uploaded on Instagram into a post like this:

Basically Instagram is just a social media that is specifically run on a smartphone device. However, Instagram can also be run on the desktop just can't upload photos and we can only look at photos only. 

On the other hand, Instagram running on smartphones can't be boosted to share photos into a blog post. Moving a photo on Instagram to a post can only be done when Instagram is running on a desktop device.

How? It's easy, just follow these simple steps;

1. Make sure you have an Instagram account. If not, please make it first.

2. Login by entering your USERNAME (without @) and your Instagram account PASSWORD then click LOG IN.
3. After successful login, click on profile icon in the upper right corner.

4. Once in your account profile, select one of the photos or videos you want to link to,
5. On the selected photo or video will pop up, note the three dots in the bottom right corner (see ground arrows). Click the three dots. When clicked, the display appears as follows. Then click Embed.

6. After clicking the three dots, it will appear the following view. Then click Insert/Embed.
7. After clicking Insert/Embed will appear a new window that gives the code to be Embed. In the window there will be the option to install photos with captions or just photos without a caption, if not just remove the sign and the button copy Embed code.
8. After obtaining the embed code, next we go to the post entry.
9. Decide where the photo or video position on Instagram wants to be inserted. To make it easier to type EMBED in post entries. Then click the HTML as below screenshot shown.
10. Press CTRL-F to easily find the EMBED word among the many HTML codes. If you have, replace the word EMBED by means of the code that we can get from Instagram earlier.
11. Click Compose, then the result will look like below. The result is not yet seen intact as desired while still in editing. Results will be visible when the post has been published or please click Preview First.
12. If everything is fitting, please click Publis.

This can actually be said to be the same as we link YouTube videos to a blog post and so also install Facebook status or Twitter tweets. Essentially how to get the embed code only. Good luck.


If the embed result is too on the left side of the post or you want the embed result to be in the middle centered position, you simply apply the <center> code at the beginning of the script and the </center> code at the end of the Scriptnya. However, if the embed result is already centered on its own, you no longer need to implement the <center> and </center> code on the script. 

To make it easier, before you apply scrip embed into the post, just press the embed code into NOTEPAD application and then add the <center> code at the beginning of the script and </center> at the end of the script.

Here's an example implementation:

<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-version="7" style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:658px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); width:calc(100% - 2px);"><div style="padding:8px;"> <div style=" background:#F8F8F8; line-height:0; margin-top:40px; padding:50.0% 0; text-align:center; width:100%;"> <div style=" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAApWqozAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURczMzPf399fX1+bm5mzY9AMAAADiSURBVDjLvZXbEsMgCES5/P8/t9FuRVCRmU73JWlzosgSIIZURCjo/ad+EQJJB4Hv8BFt+IDpQoCx1wjOSBFhh2XssxEIYn3ulI/6MNReE07UIWJEv8UEOWDS88LY97kqyTliJKKtuYBbruAyVh5wOHiXmpi5we58Ek028czwyuQdLKPG1Bkb4NnM+VeAnfHqn1k4+GPT6uGQcvu2h2OVuIf/gWUFyy8OWEpdyZSa3aVCqpVoVvzZZ2VTnn2wU8qzVjDDetO90GSy9mVLqtgYSy231MxrY6I2gGqjrTY0L8fxCxfCBbhWrsYYAAAAAElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;"></div></div> <p style=" margin:8px 0 0 0; padding:0 4px;"> <a href="" style=" color:#000; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none; word-wrap:break-word;" target="_blank">Ambilkan bulan bu! . . . . . . . . #madewithpicsart</a></p> <p style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; line-height:17px; margin-bottom:0; margin-top:8px; overflow:hidden; padding:8px 0 7px; text-align:center; text-overflow:ellipsis; white-space:nowrap;">Foto kiriman MARTIUS (@sebutsajatius) pada <time style=" font-family:Arial,sans-serif; font-size:14px; line-height:17px;" datetime="2016-07-14T15:40:47+00:00">Jul 14, 2016 pada 8:40 PDT</time></p></div></blockquote> <script async defer src="//"></script>
That's how to link photos and videos on Instagram to Blog. If you have questions, criticisms, comments and suggestions can be written in the Comments field available below.

Post a Comment

Post a Comment (0)