Tutorial: Editing the Navigation and Footer Components on Showit

The navigation and footer are essential components of any website, providing easy access to important sections and contact information. This tutorial will guide you through the process of editing the navigation and footer components in your Showit website template.

Step 1: Editing the Navigation Bar

1. Open Showit and navigate to the Canvas view where your navigation bar is located.
2. Click on the navigation bar or menu to select it. This is typically in the header section of your site.
3. In the right-hand panel, you’ll see the navigation settings. From here, you can:
   • Edit Menu Items: Click on any existing menu item to modify its name, link, or position. To add a new menu item, click the “+” icon.
   • Change Font and Style: Use the Design tab to customize the font, size, weight, and color of the text in the navigation.
   • Adjust Spacing and Alignment: You can adjust the padding, margins, and alignment of the menu items to ensure they fit the design of your site.
   • Dropdown Menus: If you want to create a dropdown menu, hover over a menu item and click the settings gear to enable a dropdown.

Step 2: Adding or Removing Navigation Links

1. To add a new link, click the “+” next to the menu in the left panel.
2. Choose whether to link to a page, anchor point on a page, external URL, or email.
3. To remove a menu item, click the trash icon next to the item in the navigation list.

Tip: Ensure your navigation is user-friendly by keeping the menu items to a manageable number. For mobile versions, consider creating a hamburger menu for a clean look.

Step 3: Editing the Footer

1. Navigate to the footer section of your website in the Canvas view.
2. Select the footer to edit its content. The footer typically includes information like your address, contact details, social media links, and copyright information.
3. In the Design panel, you can:
   • Add New Sections: Drag in new elements such as text, social media icons, or buttons.
   • Edit Text and Links: Click on text boxes to change the content and links.
   • Change Footer Style: Customize background colors, padding, font styles, and alignment to match your branding.

Step 4: Mobile Optimization

1. Switch to Mobile View to see how your navigation and footer look on smaller screens.
2. Adjust the size, position, or visibility of elements to ensure they’re mobile-friendly. For example, you may want to hide certain footer elements or stack them vertically for better readability on mobile devices.

Step 5: Save and Preview

Once you’ve made your changes, click Save and use the Preview button to view the updated navigation and footer components on your site.

Final Notes

Editing the navigation and footer components of your Showit website helps ensure that your website is both functional and stylish. With easy customization options, you can tailor these components to match your site’s aesthetic and improve usability.