Easy build websites with professional results - UKI.NET
Home Page Features Frequently asked questions Packages and prices Contact us
Support Centre - HTML Guide
 
5. Horizontal Line
6. Numbered Lists
 
4. Images With Links  
 
1. How to insert the HTML code into your web page
  1. Simply highlight the HTML code that you need and copy it.
  2. Then open the web page that you want to edit and paste the code into the page where you want to use it.
  3. Edit the blue text (add your own text etc) and click the update button
  4. Visit your website to view the result
 
 
Plain Red Text
Red text contains the HTML tags that are required to get the HTML code to work and display correctly.

All text in red should not be altered, as this will
cause the code not to work.
You CANNOT alter these details
Underlined Blue Text
Blue text can be changed to the details that you want displayed with the effect that you are adding.

On seeing the term "display text" you can enter details that will display on your web page.
You CAN enter your own text/details
 
 
2. Fonts
 
2.1 Add a Font Style
<font face="Font name here">Insert your display text here</font>
 
2.2 Add a Font Colour
<font color="Colour name or reference number here">Insert your display text here</font>
 
2.3 Add a Font Size
<font size="Enter a number">Insert your display text here</font>
 
2.4 Combining Font Size & Colour
<font color="Colour name or reference number here" size="Enter a number">Insert your display text here</font>
 
3. Hyperlinks / Navigation
 
3.1 Go Back to Last Page
<a href="#" onClick="history.go(-1)">Go back to last page</a>
 
3.2 Back to Top of Page - (May not work in all browsers)
<a href="#top">Back to top</a>
 
3.3 Text hyperlink opened in the same browser window
<a href="http://www. Insert_your_link_address_here">Insert your display text here</a>
 
3.4 Open the text hyperlink in a new browser window
<a href="http://www.Insert_your_link_address_here" target="_blank">Insert your display text here</a>
 
3.5 Open an email text link
<a href="mailto:Insert email address here">Insert your display text here</a>
4. Images with Links
 

The standard way of selecting your image from the dropdown menu and inserting it into your page will not work when you need to add a link to it. Please follow the steps below.

  1. Select the relevant code below, copy it and paste it into the page you want it to display in. Submit it.
  2. Go to the 'Image Manager' and click on the thumbnail of the image you want (it must be uploaded here first).
  3. This will open the image up in a new browser window. In the address bar at the top is the address (source) of where the image is located. You need to copy this.
  4. Go back to the page that you pasted the original code into (see item 1).
  5. Highlight the text that says 'Image Source Address'. Paste the image source address in.
  6. "http://www. Insert_your_link_address_here" - Type in the web address you want to link to when the image is clicked where the blue text is displayed.
  7. alt="Image Name" title="Image Name" - Type a description of the image where the blue text is displayed.
  8. width="0" height="0" - Enter the relevant numbers for the size of your image. Click submit to save.
  9. Go to your web page and test your link.
 
4.1 Image with a link opened in the same browser window
<a href="http://www. Insert_your_link_address_here"><img src="http://www.Image Source Address" alt="Image Name" title="Image Name" width="0" height="0"></a>
 
4.2 Image with a link opened in a new browser window
<a href="http://www. Insert_your_link_address_here" target="_blank"><img src="http://www.Image Source Address" alt="Image Name" title="Image Name" width="0" height="0"></a>
 
4.3 Image with an email text link
<a href="mailto:Insert email address here"><img src="http://www.Image Source Address" alt="Image Name" title="Image Name" width="0" height="0"></a>
 
5. Horizontal Line
 
5.1 Horizontal Line - Solid
<hr width="Enter 000% or 00px" size="Enter height number" noshade>
 
 
5.2 Horizontal Line - Shaded
<hr width="Enter 000% or 00px" size="Enter height number">
 
6. Numbered List
 

<ol>
<li>Insert your display text here</li>
<li>Insert your display text here</li>
<li>Insert your display text here</li>
</ol>

To add additional items to the numbered list add extra <li>Insert your display text here</li> inside the <ol> </ol> tags. Add as many as you need to create your list. The items will be automatically displayed with the next number in order ie: 1, 2, 3.

 
 
Related Information
Text Effects
Adding Text Effects PDF
Typing Special Characters (™ © ¥)
Typing Special Characters
A Guide To Using Hyperlinks
A Guide To Using Links PDF
 
Back to Main Support Page / Back To Top Of Page