1 min read

How to embed a link to a Google drive document with a picture on a website

Some HTML coding required to follow along with adding pictures to links.

The HTML embed option to add content uses the following format <a href="[GOOGLE-URL]"><img src="[IMAGE-URL]" /></a>

With these HTML codes links can be customised with pictures.

For example:

<a href="https://docs.google.com/document/d/1Hm13GmDrBfJCIGSCMRKCKYWKpP_yjmrIWTWS1ZP7NUE/edit?usp=sharing"><img src="https://www.influencer.tips/assets/images/test-picture.png" /></a>

Produces:

Congrats
Congratulations, you can view this document. For more information about this document visit how to embed a link to a Google drive document with a picture on a website.

Notes:

  1. For the [GOOGLE-URL] left click on the document in Google drive and select the get link option.
  2. For the [IMAGE-URL] upload your picture to a public page, left click on the picture (in Google Chrome) and select copy link address.
  3. To format the size of the picture refer to the HTML <img> tag for options.
  4. For more information about how the link tag works refer to the HTML <a> tag.
  5. For more formatting options refer to the HTML <style> tag (not shown here).

Share a comment if you found this helpful?