If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

HTML Based. How to edit main menu

This tutorial shows how to edit main menu in HTML based template.


First of all open the template package and go to the "site" folder. There you can see several HTML files. Each file is a separate page of the template.

The menu is included into each file so if you change it once you need to perform the same changes in any file.

The meny is usually created as an unordered list where each menu button is a list item with embedded link:

<ul class="sf-menu">
	<li class="current"><a href="index.html">about us</a></li>
	<li><a href="index-1.html">our services</a>
		<ul>
			<li><a href="#">services list</a></li>
			<li><a href="#">special offer</a>
				<ul>
					<li><a href="#">growing plants</a></li>
					<li><a href="#">vegetables</a></li>
				</ul>
			</li>
			<li><a href="#">consulting</a></li>
		</ul>
	</li>
	<li><a href="index-2.html">products</a></li>
	<li><a href="index-3.html">links</a></li>
	<li class="last"><a href="index-4.html">contacts</a></li>
</ul>

This is how each menu item looks like:

<li><a href="index.html">about us</a></li>

Let’s see how to edit it.

To change the menu title edit text between the <a href="…"> and </a> tags.

To change the menu item link edit the href attribute value of the link tag. In the examlpe above the href attribute value is "index.html". Replace it with your URL or the filename to change the links.

Feel free to check the detailed video tutorial below:

HTML Based. How to edit main menu

HTML Based. How to edit main menu, 2.7 out of 5 based on 3 ratings