Introduction to Header and Footer CustomizationCreating the HeaderCreating the FooterConclusion and Next Steps

In this section, we will guide you through the process of customizing the default footer in your template. Follow these steps to create a professional and functional footer for your website.

  1. Navigate to the Footer Section

    • Go to the 'Design' menu and select 'Header & Footer'.
    • Click on the 'Footer' tab to access the footer settings.
  2. Edit the Default Footer

    • Click on 'Edit template' next to the Default Footer.

Adding a Container and Setting Padding

  1. Add a Container
    • Add a container to the footer section.
    • Set the padding of the container to 30 pixels.
  1. Add a Text Widget
    • Place a text widget inside the container.
    • Paste your desired copyright text into the text widget.

Adding the Actions Widget for 'Back to Top' Action

  1. Add the Actions Widget
    • Add an actions widget to the footer.
    • Select the 'Back to Top' action.

Styling the 'Back to Top' Action

  1. Set the Label and Icon

    • Set the label to 'Back to Top'.
    • Upload an appropriate icon for the action.
  2. Style the Action

    • Go to the 'Style' tab.
    • Increase the space between the icon and the text.
    • Reduce the icon size slightly.
    • Set the color of the icon and text to gray.
    • For the hover state, set the color of the icon and text to a darker shade.
  1. Review and Save
    • Review the changes you have made to ensure everything looks as expected.
    • Save the changes to finalize your footer design.

Creating the Footer

By following these steps, you will have successfully customized the footer of your website. For further customization, refer to the Introduction to Header and Footer Customization and Creating the Header pages.