Embedding Google Drive images in a Web Page

Home Forums Learning Forum Internet Learning Forum Embedding Google Drive images in a Web Page

This topic contains 0 replies, has 1 voice, and was last updated by  Keith Taylor 11 months, 2 weeks ago.

  • Author
  • #4075

    Keith Taylor
    Ŧallars: Ŧ 1,015.48

    I got stuck today trying to embed an image from my Google Drive into a web page.

    My problems started because the image I wanted to include in a forum post was on a server that prevented hotlinking. But, I’m happy with that. Because I apply hotlinking protection to all of my websites. So, I simply saved the image to my Public Google Drive folder. Then pasted the Google Drive Link.

    But, all I got was a broken image icon! 😥

    I double checked permissions, and the picture was definitely viewable even when I was not logged in to Google. Eventually, I found the magic key:

    Obviously, there is a little more to that. Because you have to add the id at the end. But that’s easy to find.

    In Google Drive, if you share your image, you will get a link that looks like:
    Or, depending on how you find the sharing link:

    So, you can see the id that has to be added to my first code to look like:

    Then, you can paste that in an <img> tag just like this:
    Was disappointed with embedding Google Drive Images

You should Connect to Shrewdies to reply to this topic.

Simply click one of the buttons above to connect using your favourite network. Then, a box will appear here for you to post your reply.