What does it do?
I’m glad you asked. This little gem will convert a URL (Uniform Resource Locator) into either HTML Link text, or into HTML Image text. There are a few other bells and whistles, such as the ability to add an alt text attribute to the image tag, or a target attribute to the link tag. (see the directions below for more information)

Why?
My wife has her own blog, The Modern Hippy. Back before she was using wordpress, her blog was with blogger. She asked me how to make links and images show up in her posts because she didn’t like the way that blogger was doing it. I explained about HTML and how it required code to be processed in order to achieve her desired result. I showed her how to do it and she was content. A little while after I noticed she had written the code in a word document and was copying it each time she wanted to use it. This made me want to make an easier tool for her to use. Voilà!

Directions:

• Insert the URL you would like to use in the ‘URL to make into HTML Link or Image Tag’ field.
• Select which you would like, an HTML Link or an HTML Image tag.
• Click the ‘Make Tags’ button.
• Select additional options and click the ‘Update Code’ button to apply them.
• Copy and paste the text wherever you need it to be.

More detailed directions as well as troubleshooting steps can be found below the converter.

Detailed Directions:
Quite simple really.

• Enter the URL of the image you would like to display, or the location you would like the link to go to when clicked.
• If you are trying to make a link:
  • Visit the page that you would like to link to.
  • In the address bar at the top of your browser, you will see the URL. It will begin with http. Select all of this text and copy and paste it into the ‘URL to make into HTML Link or Image Tag’ field.
  • Click the circular button that is labeled ‘Make an HTML Link Tag.’
  • Click the ‘Make Tags’ button.
  • The page will load new information for you to review.
  • Directly underneath the text field where you entered the URL a message will display telling you if the URL appears to be valid, or if there was a problem. If a Warning displays, see the troubleshooting section below.
  • You will now be presented with further options that will modify your link text.
  • The Link Tag Options: Include Title Attribute, and Open link in a new window / tab.
  • Include Title Attribute: The text that is entered into the title attribute will display whenever anyone hovers over the link. Like this.
  • Open link in a new window / tab: This will add a target=”_blank” attribute to your link. This will make the page that displays after your link is clicked open in a new browser, or in a new tab.
  • Clicking and placing a check in either of these check boxes and then clicking the ‘Update Code’ button will display the code with the desired selection added.
  • Below the text area with the link is a ‘Test your link here’ link. This, when clicked, will attempt to visit the URL you entered in a new window or tab.
  • To copy your link, click inside the text area and then right click > copy.
• If you are trying to make an Image tag:
• Locate the image that you would like to link to online.
• If using Internet Explorer, right click on the image > Properties then highlight the information next to the ‘Address (URL):.’ It should begin with http. Right click > copy and then paste it into the ‘URL to HTML Link and Image Converter’ field.
• If using Mozilla Firefox, right click on the image > Copy Image Location. Then paste the image location into the ‘URL to HTML Link and Image Converter’ field.
• Click the ‘Make Tags’ button.
• Directly underneath the text field where you entered the URL a message will display telling you if the URL appears to be valid, or if there was a problem. If a Warning displays, see the troubleshooting section below.
• You will now be presented with further options which will allow you to modify your link text.
• Image Tag Options: Include border=”0″ Attribute, and Include Alt Text Attribute.
• The Include border=”0″ Attribute will add an attribute to your image tag which will make it display without a border, regardless of the browsers default. The zero can be changed to a positive number in order to display a border of that many pixels.
• The Include Alt Text Attribute will add the Alt Text attribute to your link. This text is displayed if your image cannot load. It is also used by screen readers, or text-to-speech programs in order to help the blind. The Alt text will be read aloud by the program to the blind person. Also, this is used for SEO purposes when spiders attempt to determine what this image is a picture of.
• Clicking and placing a check in either of these check boxes and then clicking the ‘Update Code’ button will display the code with the desired selection added.
• To copy your link, click inside the text area and then right click > copy.

Troubleshooting:
I apologize if you are having trouble. I tried to think of everything, and have even identified a few things that I haven’t been able to fix just yet. Check the list below for possible problems and their solutions.

• The link I’m trying to convert starts with https, not http. What do I do?
• This is something I didn’t plan for when creating this converter. If you are creating a link, after you copy the code look for the href=”" attribute. In between the quotes you will see the http text, add an s after the http and you should be fine. This works in the same fashion with the image converter, only it applies to the src=”" attribute.
• Found another problem? Shoot. I’m only one man. Click here and scroll to the bottom of the page. Use the form to tell me what happened. I’ll do my best to correct the problem and get back with you.