Установка ссылок в HTML редакторе

This tutorial shows how to assign links in HTML editor.

First of all open the HTML file that contains text of your future link. You can edit the file with any HTML editor however we recommend using Adobe Dreamweaver or Notepad++ applications.

Design Mode

Adobe Dreamweaver application offers web developers to work with HTML files in design mode. You can switch to design mode using the appropriate buttons in the top left corner of your screen.

You need to enable Properties panel. Using top navigation menu select Window > Properties. Now at the bottom of the screen you should see Properties panel.

Select any text and in the Properties panel input link to the PSD file into the Link field.

as you can see at the screenshot below as a URL we used # symbol. You can replace it with the root to the file on your server or with the website URL.

You can also use the Target select box if you want the link to open in new window, new tab or same browser window.

HTML mode

If you are working with HTML files in code mode. You can assign link the following way:

1. Locate the text you want to add link to

2. Before text add the link tag:

3. after the text add link closing tag:

4. Replace # symbol in the href attribute with the root to the file on your server or URL.

As a result you should have the following:

The code above will display text: «website templates tutorials online» linked to the website «http://info.template-help.com«

Link path relative vs absolute

There are 2 ways of creating link to the specific file on your serve: relative path and absolute path.

Relative path can be used only to create links to the files on your server.

In the example below we’ll create link to the PDF file. We have the following files structure:

• pdf
• readme.pdf
• index.html

PDF file is called readme.pdf and is located in the PDF folder. Our link is located in the index.html file

Relative path

As to the above conditions link to the PSD file will looks as follows:

As you can see in the link href attribute we specified the directory where the pdf file is located and the pdf file name. The path to the file is relative to the index.html file. You can check the table below to learn more about the file paths:

Absolute path

Using the absolute path you define full root to the file on your server starting with your domain name. Using the same files structure as in the example above the root to the pdf file will looks as follows:

If you create link to the website the code will looks as follows:

Please don’t forget to replace http://info.template-help.com with the website URL you want to create link to.