Instagram BB code

[OUTL4W]

this mini-mod is used to embed videos from instagram...this should also work for vB3.x

Add a new bbcode (AdminCP > Custom BB Codes > Add New BB Code)

title: Instagram
BB Code Tag Name: igm

Replacement:
<iframe src="//instagram.com/{param}/embed/" width="612" height="710" frameborder="0" scrolling="no"></iframe>

User Option: No
Button Image (Optional): your-site/images/instagram.png (change accordingly (button attached))

Example usage: http://instagram.com/p/f-gSfFyp7c
instagram.com/p/f-gSfFyp7c
copy red text and place between:
p/f-gSfFyp7c


https://vborg.vbsupport.ru/external/2013/10/1.png~original

remember to click "Mark as Installed"...

[Thangvip9x]

This is not mod

[OUTL4W]

This is not mod

you're right...it should be in the "Add-on" section......


if mod/admin see this....can you please move?

[HighCaliber]

This works really well on VB5.

[blah100]

It seems this doesn't work anymore unfortunately, at least on vb4.2

[soccerman2015]

It seems this doesn't work anymore unfortunately, at least on vb4.2



Works fine 4.2.X...

p/f-gSfFyp7c

do not put anything else on


if you put red one, its not work.

p/f-gSfFyp7c/

[Cem01]

This is great addon. Works fine. Thank you

[Flipfloptrader]

Worked nicely, thanks.

[gajinoz]

Works well on 4.2.3

[RichieBoy67]

Is there an updated version to IG videos embedded?

[TheBang]

This is what I've been using, and it works well on vB3 and vB4. It supports video, as well as the caption, and is not a fixed size like the iframe method at the beginning of this thread.

Title: Instagram
BB Code Tag Name: instagram

Replacement:
<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-permalink="https://www.instagram.com/p/{param}/" data-instgrm-version="8" 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:33.33333333333333% 0; text-align:center; width:100%;"> <div style=" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAA pWqozAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURczMzPf399fX1+bm5mzY 9AMAAADiSURBVDjLvZXbEsMgCES5/P8/t9FuRVCRmU73JWlzosgSIIZURCjo/ad+EQJJB4Hv8BFt+IDpQoCx1wjOSBFhh2XssxEIYn3ulI/6MNReE07UIWJEv8UEOWDS88LY97kqyTliJKKtuYBbruAyVh5wO HiXmpi5we58Ek028czwyuQdLKPG1Bkb4NnM+VeAnfHqn1k4+GP T6uGQcvu2h2OVuIf/gWUFyy8OWEpdyZSa3aVCqpVoVvzZZ2VTnn2wU8qzVjDDetO90G Sy9mVLqtgYSy231MxrY6I2gGqjrTY0L8fxCxfCBbhWrsYYAAAA AElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;"></div></div><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;"><a href="https://www.instagram.com/p/{param}/" style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none;" target="_blank">A post shared by</a> on <time style=" font-family:Arial,sans-serif; font-size:14px; line-height:17px;" datetime="2017-01-01T19:00:00+00:00">Jan 01, 2017 at 12:00pm PDT</time></p></div></blockquote>
<script async defer src="//www.instagram.com/embed.js"></script>

Example: BoW_r_ZBqhD

Use {option}: No
Remove Tag if Empty: Yes (and everything below this option set to Yes also).

[RichieBoy67]

This is what I've been using, and it works well on vB3 and vB4. It supports video, as well as the caption, and is not a fixed size like the iframe method at the beginning of this thread.

Title: Instagram
BB Code Tag Name: instagram

Replacement:
<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-permalink="https://www.instagram.com/p/{param}/" data-instgrm-version="8" 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:33.33333333333333% 0; text-align:center; width:100%;"> <div style=" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAA pWqozAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURczMzPf399fX1+bm5mzY 9AMAAADiSURBVDjLvZXbEsMgCES5/P8/t9FuRVCRmU73JWlzosgSIIZURCjo/ad+EQJJB4Hv8BFt+IDpQoCx1wjOSBFhh2XssxEIYn3ulI/6MNReE07UIWJEv8UEOWDS88LY97kqyTliJKKtuYBbruAyVh5wO HiXmpi5we58Ek028czwyuQdLKPG1Bkb4NnM+VeAnfHqn1k4+GP T6uGQcvu2h2OVuIf/gWUFyy8OWEpdyZSa3aVCqpVoVvzZZ2VTnn2wU8qzVjDDetO90G Sy9mVLqtgYSy231MxrY6I2gGqjrTY0L8fxCxfCBbhWrsYYAAAA AElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;"></div></div><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;"><a href="https://www.instagram.com/p/{param}/" style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none;" target="_blank">A post shared by</a> on <time style=" font-family:Arial,sans-serif; font-size:14px; line-height:17px;" datetime="2017-01-01T19:00:00+00:00">Jan 01, 2017 at 12:00pm PDT</time></p></div></blockquote>
<script async defer src="//www.instagram.com/embed.js"></script>

Example: BoW_r_ZBqhD

Use {option}: No
Remove Tag if Empty: Yes (and everything below this option set to Yes also).
Thanks, That works!

[OnlyTouch]

This is what I've been using, and it works well on vB3 and vB4. It supports video, as well as the caption, and is not a fixed size like the iframe method at the beginning of this thread.


Thanks for the code, it works great!:вверх:

[musik]

This is what I've been using, and it works well on vB3 and vB4. It supports video, as well as the caption, and is not a fixed size like the iframe method at the beginning of this thread.

Title: Instagram
BB Code Tag Name: instagram

Replacement:
<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-permalink="https://www.instagram.com/p/{param}/" data-instgrm-version="8" 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:33.33333333333333% 0; text-align:center; width:100%;"> <div style=" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAA pWqozAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURczMzPf399fX1+bm5mzY 9AMAAADiSURBVDjLvZXbEsMgCES5/P8/t9FuRVCRmU73JWlzosgSIIZURCjo/ad+EQJJB4Hv8BFt+IDpQoCx1wjOSBFhh2XssxEIYn3ulI/6MNReE07UIWJEv8UEOWDS88LY97kqyTliJKKtuYBbruAyVh5wO HiXmpi5we58Ek028czwyuQdLKPG1Bkb4NnM+VeAnfHqn1k4+GP T6uGQcvu2h2OVuIf/gWUFyy8OWEpdyZSa3aVCqpVoVvzZZ2VTnn2wU8qzVjDDetO90G Sy9mVLqtgYSy231MxrY6I2gGqjrTY0L8fxCxfCBbhWrsYYAAAA AElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;"></div></div><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;"><a href="https://www.instagram.com/p/{param}/" style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none;" target="_blank">A post shared by</a> on <time style=" font-family:Arial,sans-serif; font-size:14px; line-height:17px;" datetime="2017-01-01T19:00:00+00:00">Jan 01, 2017 at 12:00pm PDT</time></p></div></blockquote>
<script async defer src="//www.instagram.com/embed.js"></script>

Example: BoW_r_ZBqhD

Use {option}: No
Remove Tag if Empty: Yes (and everything below this option set to Yes also).


It works really well, except for posts with more than one image/video. If there are several in the same post it says that the item has been removed from Instagram. Is there a way to solve this?

[TheBang]

It works really well, except for posts with more than one image/video. If there are several in the same post it says that the item has been removed from Instagram. Is there a way to solve this?
Sorry, I have not experienced that problem. I just tested several posts with multiple images and multiple videos and they all worked properly embedded. It's probably due to some custom modification on your forum that conflicts.

[musik]

Sorry, I have not experienced that problem. I just tested several posts with multiple images and multiple videos and they all worked properly embedded. It's probably due to some custom modification on your forum that conflicts.

Damn. That's too bad. Thanks for replying though :).

[04wayne]

This is what I've been using, and it works well on vB3 and vB4. It supports video, as well as the caption, and is not a fixed size like the iframe method at the beginning of this thread.

Title: Instagram
BB Code Tag Name: instagram

Replacement:
<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-permalink="https://www.instagram.com/p/{param}/" data-instgrm-version="8" 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:33.33333333333333% 0; text-align:center; width:100%;"> <div style=" background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAA pWqozAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAMUExURczMzPf399fX1+bm5mzY 9AMAAADiSURBVDjLvZXbEsMgCES5/P8/t9FuRVCRmU73JWlzosgSIIZURCjo/ad+EQJJB4Hv8BFt+IDpQoCx1wjOSBFhh2XssxEIYn3ulI/6MNReE07UIWJEv8UEOWDS88LY97kqyTliJKKtuYBbruAyVh5wO HiXmpi5we58Ek028czwyuQdLKPG1Bkb4NnM+VeAnfHqn1k4+GP T6uGQcvu2h2OVuIf/gWUFyy8OWEpdyZSa3aVCqpVoVvzZZ2VTnn2wU8qzVjDDetO90G Sy9mVLqtgYSy231MxrY6I2gGqjrTY0L8fxCxfCBbhWrsYYAAAA AElFTkSuQmCC); display:block; height:44px; margin:0 auto -44px; position:relative; top:-22px; width:44px;"></div></div><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;"><a href="https://www.instagram.com/p/{param}/" style=" color:#c9c8cd; font-family:Arial,sans-serif; font-size:14px; font-style:normal; font-weight:normal; line-height:17px; text-decoration:none;" target="_blank">A post shared by</a> on <time style=" font-family:Arial,sans-serif; font-size:14px; line-height:17px;" datetime="2017-01-01T19:00:00+00:00">Jan 01, 2017 at 12:00pm PDT</time></p></div></blockquote>
<script async defer src="//www.instagram.com/embed.js"></script>

Example: BoW_r_ZBqhD

Use {option}: No
Remove Tag if Empty: Yes (and everything below this option set to Yes also).

This worked fantastically well up until yesterday on my site - then stopped working and started getting this (see attached).

I don't suppose anyone might know why?

[musik]

Could it be because the shared image is from a private account or has the photo been deleted? Because it hasn't stopped working where I'm using it.

[04wayne]

Uninstalled, and then reinstalled as a new mod, working fine now!

[04wayne]

The code has stopped working for me, anyone else have an Instagram code that works for embedding posts?

[Mandushi]

This works fine with 3.8.11

Thank you

[04wayne]

Anyone have a working BB Code for Instagram on 4.2?

[04wayne]

Anyone?

[Dave]

Not sure if it works but you can try
<iframe src="//instagram.com/{param}/embed/captioned/" width="612" height="710" frameborder="0" scrolling="no"></iframe>

[RichieBoy67]

Yeah, this doesn't work anymore.

[concepts]

Yeah, this doesn't work anymore.



LIES!!! lol, on 4.2.5 and it's BEAUTIFUL. Just installed.