How to Embed ANY Public Instagram Post With JUST HTML

Поделиться
HTML-код
  • Опубликовано: 11 янв 2025

Комментарии •

  • @plyjhny
    @plyjhny 2 года назад

    You are a genius. Forget Harvard, spend 5 minutes with this guy!

  • @racheljeonbrown
    @racheljeonbrown Год назад

    omg this is exactly what I was looking for! your explanation is so clear and straight to the point yet easy to understand even though I have zero coding knowledge. TYSM for caring Steviesie!!! I appreciate youu

  • @jakewynn
    @jakewynn 2 года назад +1

    Came across this on accident. What a cool video! I rate this 😎

  • @davidoludepo
    @davidoludepo 2 года назад +6

    Great video Stevesie. What about getting the latest post on Instagram, automatically without changing the code? Is there a detailed function for that?
    Thanks

  • @sudoalex
    @sudoalex 4 года назад +2

    This is great man! Good job! I loved it! I'll share this with everyone

  • @caiorodrigues-si8zg
    @caiorodrigues-si8zg 3 года назад +1

    Great video! You saved my broken website!

  • @JohnMilanoski
    @JohnMilanoski 2 месяца назад +1

    haha, 4 years later... still useful. thanks!

    • @StevesieData
      @StevesieData  2 месяца назад

      Haha, yes - I can't believe it still gets views. Thanks for watching!

  • @j8ahmed
    @j8ahmed Год назад

    Wow. Really smart approach with the diff tool

  • @kcz-q4
    @kcz-q4 6 месяцев назад +1

    Dude, amazing content! Thank you!

  • @Smurfis
    @Smurfis 4 года назад +3

    Good job but I’d love to see how you could sort a table of posts whether it’s top 3 posts in a slideshow, etc

    • @StevesieData
      @StevesieData  4 года назад

      Thanks! Yea, so you can sort them based on the Post ID you get back however you like and then embed them one after another. I'm not familiar with being able to embed multiple posts as a slideshow (if Instagram supports that), but if they do then we can probably work with that and pass in multiple Post IDs is what I'm guessing you mean!

  • @christinefischer7774
    @christinefischer7774 4 года назад +3

    Great video! Could you make a video on how to replace the shortcode... how to work with the template and e.g. fetch every instagram post from a user and put each one of it in a blog post on my wordpress website? I've never worked with django...

    • @StevesieData
      @StevesieData  4 года назад +1

      Thanks Christine! Yea, the hard part is actually getting the codes in an easy way. You can do this yourself if you go to the account(s) you're interested and look at their feeds. I talk a little about how to make this process a little less manual here: ruclips.net/video/-ptpQ22t2j0/видео.html
      You don't really need Django -- this is just basic HTML you can put into your blog / website. So if you have a list of post shortcodes, you'd need to generate one big blob of this HTML for each post shortcode which is what Django would be helpful for (to cut down on copy-pasted code) but is not a requirement.

  • @JcSunder1and
    @JcSunder1and 3 года назад +1

    Thanks man! Really help me with this api update!

  • @118629587
    @118629587 Месяц назад

    What happens when you click on the 3 … and the box pops up without the option to grab the HTML code? Is there another way to do this or is there another way to get that HTML code?

  • @slice-o-life
    @slice-o-life 4 года назад +3

    I want to copy and paste embed code your eyes to the wall. But anyways this code only works on computer it doesn’t work on mobile device.

    • @StevesieData
      @StevesieData  4 года назад

      Haha, thanks for the feedback Trevor. I feel like they must support mobile embedding somehow. I'll take a look and make a new video if I find out how.

  • @mentoringpokeronline2514
    @mentoringpokeronline2514 4 года назад +2

    tx a lot! but i´m newbie and did all and works, but wanna know how get dinamic on specific user IG, i mean everytime this user do an instagram post, can be this auto-update on my website widget?

    • @StevesieData
      @StevesieData  4 года назад

      Hey, great question! It's not too difficult, you just need to check when the specific user creates a new post (say once per day, or more frequently if you want), and you just need the shortcode from there. You can see this video: ruclips.net/video/-ptpQ22t2j0/видео.html for more information on how to do it.

    • @PragatiRastogi-yd8rc
      @PragatiRastogi-yd8rc Месяц назад

      @@StevesieData the video is not available!!

  • @stelvio5213
    @stelvio5213 3 года назад

    please when you charge the video, put automatic translate in youtube option...please! thank you

  • @ChloeLambert-o4x
    @ChloeLambert-o4x Год назад

    Hey Probably late to the game but is there a change you can embed the code onto a app that you have developed yourself - I want to use the Hastag

  • @zarkashaat
    @zarkashaat 4 года назад +1

    thank you i was trying this, but again it only embed one picture
    so whats the difference?? what i missed here??

    • @StevesieData
      @StevesieData  4 года назад +1

      Great question! Yea, the idea here is that this shows how to "templatize" the embedding so all you need to know is the post's shortcode / ID to embed it. This means that you can get a list of multiple posts you want to embed, and then for each post substitute the post ID into this template code to embed it, allowing you to curate a list of posts you want to embed instead of just one.

  • @zhanelgabit5182
    @zhanelgabit5182 4 года назад +1

    can we do it on 2 columns? like the photo on left and description and other elements on right?

    • @StevesieData
      @StevesieData  4 года назад

      Possibly! Please check out the code we mention in the video here: gist.github.com/stevesie88/ca9544bf3d1f381466199529ca7ed2cf - you can try altering it and moving the styles around, though keep the class names, data attributes and IDs intact so that Instagram's official Javascript is able to work with it properly (note that it's injected at the end and then alters a few things to make it look fancy!).

  • @nicosoto3472
    @nicosoto3472 3 года назад +1

    Hi, where i can study how to get the list of all shortcodes of a user? Thanks!

    • @StevesieData
      @StevesieData  3 года назад

      Hi Nico! You can see here for how to get the posts and shortcodes for a user: ruclips.net/video/-ptpQ22t2j0/видео.html

  • @VishalSalunkhe7
    @VishalSalunkhe7 4 года назад +2

    How can we add recent posts slides automatically to website

    • @StevesieData
      @StevesieData  4 года назад

      It's tricky to do *completely* automatically. You'll need to get the list of "shortcodes" to embed from Instagram and then feed them to generate a different embed code for each post you want to embed. There's ways to do this, please check out the link to our website for more info!

  • @toddkarlen9783
    @toddkarlen9783 4 года назад +1

    Thank You Sir! Quick Q? Can this still be done as of Jan. 2021? - (I saw another video of yours that said something about Instagram being tougher)

    • @StevesieData
      @StevesieData  4 года назад +2

      Hey Todd, yes embedding should still be good since it's official code that Instagram provides us!

  • @santiagoeugo3849
    @santiagoeugo3849 3 года назад +1

    This is absolutely genious, god bless

  • @mixaws
    @mixaws 3 года назад +1

    Make a tutorial and a doc explaining to embed instafeed using picuki API in WordPress...

  • @coisasbostas1648
    @coisasbostas1648 3 года назад +1

    Great video bro

  • @shant486
    @shant486 4 года назад +1

    Thank you for this video :) I would love to see one for IG stories if possible that would be amazing :)

    • @StevesieData
      @StevesieData  4 года назад

      Great, thanks! Unfortunately embedding stories is a bit risky from a copyright perspective unless they're your own stories. You can see ruclips.net/video/DJPlGDuHnN8/видео.html for how to scrape data from stories, but you'd need to develop your own front end for displaying the content.

    • @annegriffin9458
      @annegriffin9458 4 года назад

      Yes you can embed Instagram stories on your website, but from your profile only. Right now I am using Taggbox Widget for embedding Instagram stories on my website.

    • @franciscamortagua7860
      @franciscamortagua7860 Год назад

      @@StevesieData hello. i would like to see this video. it will be very helpful. It seems that the video is private. Looking forward your awnser please. Thank you :)))

  • @ajitkumar-il1zy
    @ajitkumar-il1zy 2 года назад +1

    bro can u tell me how to how to use instagram pictures in html

  • @newhorizon4610
    @newhorizon4610 2 года назад

    How can I share my profile not post from Instagram on my website?

  • @PanshulSaxena
    @PanshulSaxena 11 месяцев назад

    Can anyone tell the parameters to be passed for autoplaying the reel on mute from insta embedding

  • @r41channel
    @r41channel 3 года назад +1

    Hey Stevesie, awesome video. I was looking for something like this but using LinkedIn feed where I could populate posts of specific hashtag on my website. Do you have that kind of tutorial already or could you make one? Thanks much.

    • @StevesieData
      @StevesieData  3 года назад +1

      Thanks! Yes, it looks pretty easy on LinkedIn, you can see this help article here: www.linkedin.com/help/linkedin/answer/86529/embed-content-from-the-linkedin-feed?lang=en
      The issue though is figuring out the list of content IDs to embed (very similar to this Instagram video). We offer a manual LinkedIn scraping solution here: ruclips.net/video/XhDqk2MfcYE/видео.html so you could use that to grab a large list of posts about a hashtag (or topic), then generate an embed code for each one of those scraped content IDs for your site. I'll see if I can cover this in a future video since this sounds like a great idea, thanks!

    • @r41channel
      @r41channel 3 года назад

      @@StevesieData Wow thanks for the fast response. Amazing. I've tried the method based on the given link about embed content from linkedin feed but seems like i got to go each individual post and embed one by one. Which doesn't fit what i'm looking for. It's cumbersome and time consuming.
      The scraping method looks like i got to do extra steps. Maybe I'll try it.
      But I'll be happy and can't wait if you gonna do another tutorial for this. That would be splendid. Thanks again, Stevesie. I enjoyed your videos.

  • @michaellane9998
    @michaellane9998 3 года назад +1

    do you know how to embed instagram live streams? like live stories?

    • @StevesieData
      @StevesieData  3 года назад

      Hi Michael. I'm not sure if this is possible, and if so most likely would violate Instagram's Terms of Service unless you see an officially supported way to embed them (like with these posts) - you need to be extremely careful when it comes to re-publishing content like you're describing.

    • @mlane092
      @mlane092 3 года назад

      any idea why they let you embed everything else but not stories or live?

  • @sudoalex
    @sudoalex 4 года назад +3

    I feel like your eyes are gonna come out of your face lol

    • @StevesieData
      @StevesieData  4 года назад +3

      I better start wearing sunglasses then! 😎

    • @sudoalex
      @sudoalex 4 года назад +1

      @@StevesieData hahaha you have big eyes that's what I meant to say

  • @michaelns9887
    @michaelns9887 5 лет назад +1

    Thanks for this, mate!

  • @itogermany
    @itogermany 4 года назад +2

    Perfect Thank you

  • @rowanmonteiro5731
    @rowanmonteiro5731 4 года назад

    Hi.. I would like to elembed only 'like button count' of a particular post. Can I do it?

    • @StevesieData
      @StevesieData  4 года назад +2

      Hi Rowan! I'm not sure about that button, but you can get the like count for any post using this: stevesie.com/apps/formulas/instagram-post-details and then display that count on the button.

  • @riqoxhale
    @riqoxhale 5 месяцев назад

    That’s exciting how that works

  • @artyomagadzhanyan5472
    @artyomagadzhanyan5472 3 года назад

    I have a problem. I put the code into HTML, but it shows "View this post on Instagram", not the post itself. How to fix it...?

    • @StevesieData
      @StevesieData  3 года назад

      Hi, that message is coming from Instagram, so you can't really do much about it unfortunately... it may have something to do with permissions or age restrictions on the post.

    • @artyomagadzhanyan5472
      @artyomagadzhanyan5472 3 года назад

      @@StevesieData I already found out how to fix this problem, but anyway thanks...

    • @turglow01
      @turglow01 2 года назад

      @@artyomagadzhanyan5472 how did you fix this problem?? I am having the issue as well, please share haha

  • @VE3DAL
    @VE3DAL 4 года назад +1

    Fantastic! thank you👍.

  • @michaelns9887
    @michaelns9887 5 лет назад

    However, I can't view the post on the site. It says "View this post on Instagram"

    • @StevesieData
      @StevesieData  5 лет назад

      Huh, can you post the URL or link to what you're trying to embed and I can take a look?

    • @michaelns9887
      @michaelns9887 5 лет назад

      @@StevesieData nothing works actually.
      Here's the pen codepen.io/michalens/pen/dyoyJVW

  • @bilawalali6810
    @bilawalali6810 2 года назад

    I am facing CORS policy issue

  • @brettgastelum5330
    @brettgastelum5330 4 года назад +1

    I've been looking up and down on how to do this as of recent as I KNEW IG changed their API and sandboxed their last one.
    I'm actually using Django 3.0 right now and am working on a few different (personal) sites. Is there any way you can do a video on injecting the feed on to a template? I mean, I see what you did there and it looks like you could easily just do a {{ extend template_name.html }}, wouldn't this work better as a model or view since you'd have to call it the feed? Maybe I'm wrong, I'm still wet behind the ears when it comes to Django, I'm only about 3 months deep.

    • @StevesieData
      @StevesieData  4 года назад

      Hey Brett! It sounds like you want to embed a collection of posts in your template? You can define this embed code as a single template and then call into it by using the "with" declaration in Django and including the template, e.g. {% with shortcode='123' %} {% include 'app/ig_post.html' %} {% endwith %}
      And if you throw that into a for loop in the template, you'll have a nice clean feed without a copy-pasted mess. Just have the "view" send in a list of post shortcodes to the template and iterate through them outside of the above code.
      There are other approaches as well, but without knowing much more about your specific project I would suggest this to get something working.

  • @rezatristana4099
    @rezatristana4099 4 года назад

    Really nice video! But I can't view the post on my site. It says "View this post on Instagram"

    • @StevesieData
      @StevesieData  4 года назад

      Hey, that's strange - it may be because the post is private or may require the user to be above a certain age. If you post a link to where your code is hosted I can take a look!

    • @turglow01
      @turglow01 2 года назад

      i had this issue as well..did you ever get it solved

  • @deniselayer802
    @deniselayer802 4 года назад

    How do i delete the “embed”option on my instagram explore page?

    • @StevesieData
      @StevesieData  4 года назад

      Hi Denise, I'm not exactly sure what you mean... is this on the app? You can't really delete the option to embed anything unless it's content you own and can then make private if that's what you mean.

    • @deniselayer802
      @deniselayer802 4 года назад

      Stevesie Data on the explore page where theres the 3 dots ... when i press them the “not interested” option is no longer there... where did it go? I used that all the time when the feed had things I didn’t want to look at.

  • @chauhammehta5960
    @chauhammehta5960 Год назад

    How to viral instagram post sir

  • @Ozyan123
    @Ozyan123 2 года назад

    bruhh not that is just that i cant post videos from other people's video

  • @ondrejhabina7163
    @ondrejhabina7163 3 года назад

    This does not seem to work anymore

    • @StevesieData
      @StevesieData  3 года назад

      What specifically is the issue? You should be able to simply copy the embed code provided by Instagram and replace it with the post IDs you need.

  • @pexeixv
    @pexeixv 4 года назад

    Works in 2020?

    • @StevesieData
      @StevesieData  4 года назад

      Hi Gavin, yes - this is using official Instagram-provided code from their embed feature.

  • @yanccoliphotofilms1855
    @yanccoliphotofilms1855 4 года назад

    too much for me....hahaha, I´m getting crazy trying to embed my insta on my page... =(

    • @yanccoliphotofilms1855
      @yanccoliphotofilms1855 4 года назад

      www.vamoshoneyweddingstories.com
      insta: @vamoshoney_weddingstories
      =,(

    • @StevesieData
      @StevesieData  4 года назад

      Ah - yes it's a little technical! If you just want to embed your own feed, this video may help: ruclips.net/video/av5OBKMQeqY/видео.html

  • @xhousenyack1707
    @xhousenyack1707 4 года назад

    post by user

    • @StevesieData
      @StevesieData  4 года назад

      Do you mean you want to get all of the posts for a specific user? This is possible - you just need to get all of the Post IDs / Shortcodes for the individual user and then apply this technique for each post.

  • @hahahahahha8458
    @hahahahahha8458 Год назад

    Nice

  • @milliondollorsvirgin8285
    @milliondollorsvirgin8285 4 года назад +1

    boss still i am not what a non programmer need to do step by step . which code i need to put in my site to embed all the feed of any instagram acc ?

    • @StevesieData
      @StevesieData  4 года назад +1

      It's not that hard! You'll need the list of post IDs (or shortcodes) upfront, and then you need to call this code each time for each individual post, injecting the shortcode where I demonstrate in the code. So if the author of the page posts something new, you need to continually check for new posts... that's the only tricky part!