This tutorial will walk you through the how-to to edit the header and footer In Site Builder, as it can influence your website’s overall layout and user experience. They are the main navigational components that help users understand where they are and how to get there.

Using Domains.co.za Website Builder, you can professionally customise your website’s header and footer.

This article enables you to alter your site’s logo, social media icons, and header and footer layout. and is related to our You Tube video: How To Edit The Header And Footer In Site Builder – Master Your Website’s Header and Footer – Website Builder Tutorial.

How To Edit The Header And Footer In Site Builder

This article assumes that you are logged in to your Domains.co.za account.

Customising the Header

• Increase Header Size – Start by making your header larger. You can do this by adjusting the settings in the Size section on the right panel. Firstly, click the Pen Icon at the top of the page. Now click Select parent and choose Header.  Remove the maximum value limit to expand the header and create more space for your content.

• Replace Title Text with a Logo –To make your website look more professional, you can replace the default title text with your logo. First, remove the title text by right-clicking it and selecting Remove. Then, drag the Picture Element from the main toolbar into the header area. This will prompt a dialogue for you to choose an image from your Image Gallery or upload a new one. Click Select once you’ve chosen your logo image.

Editing Social Media Icons in the Header

• Replace Social Media Icons –If you want to change your social media icons, select the one you wish to replace, click the Pen Icon, and search for a new icon using the search bar. After finding the appropriate icon, click Select to apply it.
• Remove Unnecessary Icons – You may not need all the default social media icons. Right-click on the unnecessary icons and select Remove to delete them.
• Copy Social Media Icons for the Footer –Once your header’s social media icons are set, you can use the same layout for your footer. To do this, right-click on the layout with the icons and select Copy.

Customising the Footer

• Paste Social Media Icons into the Footer –To insert the icons into the footer, right-click on the footer section and select Paste. This will insert the social media icons you copied from the header.
• Adjust Placement –Use the Drag-and-Drop functionality in the Page Structure section to adjust the placement of the icons or any other elements within the footer to ensure they are aligned properly.

• Save Your Progress: Once you’re satisfied with customising your header and footer, click Save Draft at the top to save your progress.

YouTube Video: Master Your Website’s Header and Footer – Website Builder Tutorial

Additional Information:

Importance of Custom Headers & Footers

• When someone visits your website, they frequently land on the header. You can create a powerful first impression with a well-designed header featuring a clear logo, simple navigation, and crucial contact information.
• In contrast, footers function as your website’s concluding part and frequently contain important links such as privacy rules, terms of service, or other contact details. For increased accessibility, it’s a good idea to repeat your social media connections there.

Best Practices for Social Media Icons

Ensure the size and appearance of your social media icons are the same in the header and footer. To prevent overwhelming visitors, use only a few social media icons; choose the platforms where your company is most active.

Logo Placement & Size

Since your logo is a key branding component, ensure it is positioned correctly in the header. It mustn’t obscure other crucial elements like contact information or navigation links. Ensure the logo size is balanced to maintain your website’s aesthetic appeal.

Footer Design Considerations

Beyond social media icons, your footer can have other content like a sign-up form, copyright details, or quick links to relevant pages. To make the design easier to understand, keep it straightforward and uncomplicated.

Login to Domains.co.za Account

1. Go to the Domains.co.za website Account Login page.

2. Enter your Email and Password.

3. Then click the “Sign In” button.