SEO: How-To Make An Image Clickable Using HTML
I am a millennial. I grew up hooking my Myspace up with HTML like changing backgrounds, making stars fall from the top of the screen, adding extra music, top 20 lol and much more. If you were like me, a lot of that comes to play when adding HTML to your website.
If you're a beginner or just need a refresher for adding an image you can click on, here is a simple way to add images that lead to a link of your choice (i.e website, newsletter url, landing page). Dependent upon your platform provider, you more than likely can add photos in multiple places that allow links. If you like to move outside the template, you will need the below HTML link to make an image clickable to the link of your choice.
- You will need to have your photo hosted with a provider such as Bluehost (comes with a hosting, domain and ssl certificate) or Google Drive. You should be able to obtain a "copy URL link" or be able to right click the image to "Copy Image Url".
- Please note, if you delete or move the image from the hosting provider, the link will be broken and shows up blank or as an "x" on users screens.
- Save that copied link to Sticky Notes or Notes app.
- Next, copy the link you want your image to point to or "land" once a person clicks on it (Landing page URL).
I have highlighted in matching colors, which link would need to go where into the below URL. Replace the info in red with your photo link information. Replace the pink information with the page you want your photo to lead to once clicked. VERY IMPORTANT: Be sure to keep your pasted text in between the quotations marks
<a href="https://LandingPageURL.com"><img src="https://ImageURL" /></a>
BONUS: If you want your image centered within the page, add <center> and </center> at the beginning and end of the above the above link.
Your link should now look like this:
<center><a href="https://LandingPageURL.com"><img src="https://ImageURL" /></a></center>