How to add a link to an image in Gmail

Here’s a useful Gmail trick to spruce up your emails: using images as links. This way, recipients can click on the image directly, whether it has words or not.

For example, let’s say you’re putting together an email and want to use this coupon image as a hyperlink:

Our clickable in-email coupon.
Our clickable in-email coupon.

There are two methods I’ll demonstrate below, an easy layman’s approach and the programmer’s approach.

The easy way to hyperlink an image

Here’s how you can easily make an image a link:

1. Place the image into your Gmail email as you normally would.

2. Then select the image. You can do this by clicking and holding to the right of it, then dragging the cursor left until the image turns blue. When the image is blue, this indicates it has been selected. Do not merely click on the image to select it. That won’t work. You have to drag your mouse across it to select it.

Dragging the cursor left to highlight the image.

3. Click the link icon at the bottom of the Compose window. A small window will appear under the image showing you the option to change or remove the link. Click “change.”

Selecting the web link you want for this image.
Selecting the web link you want for this image.

4. Enter the web address to which you want the image to link.

Entering the web address.

5. Then click the OK button.

It’s a must to confirm that you have linked the image to where you intended it to link. This is important because it’s easy to create a new link rather than link the image, because sometimes the image looks like it’s selected when it’s not. To confirm that you’ve linked the image correctly, just click on the image, and then the URL will show with the “change” option. You should see the web address to which you want the image to link displayed under the image after the words “Go to link.” If it is incorrect, simply repeat the steps above, making sure you have definitely selected the image this time.

See also  Journal of Healthcare Engineering
Checking that the link is correct by clicking on the image.

The programmer’s way

If you’re a programmer and you know HTML, you can probably shave a few seconds off the process here. But you have to be comfortable using Chrome’s Developer Tools and adding an “a href” tag to add the hyperlink to the image.

1. Inspect the image to launch Chrome’s Developer Tools.

2. Bring up the HTML for the image.

3. Choose the option to edit the HTML and add the “a href” tag.

4. Don’t forget to add the closing “a” tag:

5. Exit and the link has been created.

And finally, test the link by single-clicking the image:


That’s all there is to it! When your recipients click on the coupon, it will open a new tab with the location to which you linked. Of course, now you can send out your coupon offer to all your customers, by using a Google Sheets spreadsheet along with GMass.