The top header section in Matrix themes is the area displayed at the top of the header, typically featuring contact information such as a phone number and email address.
This is the only template area that can be edited directly in HTML.
To make changes, open the Matrix Themes admin menu, select 'Custom Layout,' then go to the HTML tab. Locate the editable three lines, as shown in the screenshot, and replace them with your own information. Finally, click the save button at the bottom of the page to confirm the changes.
Remove the classes color-white or link-white if you need to display the dark text color.
(The alternative classes are color-dark and link-dark. You can use the inline styles here to add any other color)
Not all templates display the top header section by default.
To activate it, you have two options:
1. Open the Style Editor, navigate to Template Configurations, and add the class 'has-top-header'.
2. Go to Custom Layout > HTML tab, find the following line as shown in the screenshot below, and remove the 'hidden' class. Click the save button at the bottom of the page to confirm the changes.
One of the most common mistakes occurs when editing the HTML, leading the system to automatically correct your code by adding a div or closing tag in the wrong position. As a result, the entire template might appear with different and unexpected styles.
To reset back to the default HTML: