Call: (209) 560-6611

How To Link A Photo To A Website

Date: July 9, 2012 Author: ang Category: Affordable Web Design How To Blog Internet Tips Tutorials WordPress Tags: , , , , , Comments: 0

How to link a photo to a website so that when a visitor clicks on a particular image, they're taken to another website or web page. This is fairly easy to do using HTML and will work in most blogging programs that allow you to use html. To complete this tutorial you will need to upload your image to an image hosting website. Note the URL the image hosting website gives you for your hosted image. Below are instructions on how to create the HTML snippet and how to apply it to WordPress, Blogger and Tumblr.

The HTML snippet used to link an image to a website

Here is the code snippet:

 Javascript |  copy code |? 
1
2
<a href="http://2slick.com" target="_blank"><img src="http://2slick.com/web/wp-content/uploads/2011/06/logo3.png" alt="" /></a>
3

Here is what the code snippet looks like on a web page:

Note: Notice that when you click on the logo image, you are directed to the home page of 2slick.com.

To change the code snippet image, and the web page it redirects you do, you will need to change two things in the snippet. Change the http://2slick.com/web/wp-content/uploads/2011/06/logo3.png URL to you image URL. This will replace the 2slick.com logo with your image. Next change the http://2slick.com URL to the URL you want visitors to be forwarded to, once they click your image. That's it, your modified code snippet is ready to insert into any web page that accepts HTML. Save your modified code snippet to a text document like Notepad.

How to insert HTML into WordPress

Click on the HTML tab over the content area of any post or page to insert HTML markup.

How to insert HTML into Blogger

Click the HTML tab while creating a post. Now you can insert HTML code into the post. Click the 'Compose' tab to view the html as it should display to visitors.

How to insert HTML into Tumblr

Click the 'Edit HTML source' button and a 'HTML Source Editor' popup window appears. Enter HTML code into the window and click the 'Update' button.

Leave a Reply

Your email address will not be published. Required fields are marked *

Before you post, please prove you are sentient.

what is 8 + 8?

Before you post, please prove you are sentient.

what is 2 + 3?