Our support team is ready to present you a new tutorial that will become an indispensable guide on managing header layouts in Multipurpose Website Templates.
The header section is the top part of the web page on your site. It is surely an important part of the page as it is the area which people see before scrolling the page during the first seconds of site presentation. When people visit the website, principally the first time, they do not explore everything on the page in details, and the header layout attracts users’ attention.
Multipurpose website templates may use different header layouts, for example, Header parallax, Header Transparent, Header Minimal, Header Corporate, Header Hamburger Menu etc.
We are going to show you how to apply a certain header layout to the specific page.
For example, if you want to apply the Header Hamburger Menu layout to the Home page you should perform the following steps:
- Open the HTML file for Header Hamburger Menu layout using the code editor. In our case, it’s an index-sidebar.html file, which can be found in the site folder of the downloaded template package.
- Locate the header section and copy all the code starting from opening
<header>
till the closing<⁄header>
tag. - Find and open the index.html file for a Home page editing. Insert all the previously copied code into the header section of this page (including
<header>
and closing<⁄header>
tags) instead of the existing one. - Save the changes using the Save button.
- Make sure the modified file has been uploaded to the server.
Refresh your website to check the changes. You will see Header Hamburger Menu layout successfully applied to the Home page. You can follow the same steps to apply any needed header layout to any page.
This is the end of the tutorial. Now you know how to manage header layouts in Multipurpose Website Templates.