Our theme offers a highly customizable footer area that you can build using WordPress widgets. This guide will help you configure the layout and styling of your site’s main footer.
Accessing the Footer Settings
To access the footer settings, navigate to Appearance → Customize in your WordPress dashboard, then go to Footer → Main Footer.
Here, you can toggle the Enable Main Footer switch to turn the entire footer area on or off globally.
1. Footer Column Layouts
The theme provides multiple grid layouts for your footer widgets, allowing you to organize your content exactly how you want.
Under Column Layout, you can choose from the following structures:
- 1/4 + 1/4 + 1/4 + 1/4: A balanced 4-column layout, perfect for displaying multiple menus, contact info, and an about text.
- 1/3 + 1/3 + 1/3: A balanced 3-column layout.
- 2/3 + 1/3: A wider left column with a narrower right column.
- 1/3 + 2/3: A narrower left column with a wider right column.
Note: Once you select a layout, you will need to add widgets to these columns by going to Appearance → Widgets (or the Widgets section in the Customizer) and adding content to the Footer widget areas.
2. Widget Alignment & Visibility
Center Widget Content:
If you want a perfectly symmetrical look, toggle the Center Widget Content option. This will center-align all text and elements inside your footer columns.
Device Visibility:
You can choose exactly which devices should display your footer. Use the dropdown to:
- Show on All Devices
- Hide on Mobile
- Hide on Tablet
- Hide on Mobile and Tablet
3. Design & Styling Options
Scroll down to the Design Options section to customize the visual appearance of your footer.
Background
Set the background for the entire footer area:
- Solid Color: Choose a flat background color (e.g., a dark grey or brand color).
- Gradient: Create a smooth color gradient.
- Image: Upload a background image.
Font Colors
Ensure your text is readable against your chosen background by adjusting the colors:
- Text Color: The primary color for standard paragraph text.
- Link Color: The color of hyperlinks in your footer menus or text.
- Link Hover Color: The color links change to when hovered over.
- Widget Title Color: The color of the heading above each widget.
Borders
Add separation between your main content and the footer:
- Add a border to the Top or Bottom of the footer area.
- Define the Style (solid, dashed, dotted), Color, and Width.
4. Footer Typography
If you need specific font sizing for your footer that differs from the rest of the site, expand the Typography section.
- Widget Title Font Size: Adjust the size of the headings above your footer widgets. You can set different sizes for Desktop, Tablet, and Mobile using the responsive device icons.
Saving Your Changes
Once you are happy with your footer layout and styling, click the blue Publish button at the top of the Customizer to apply the changes to your live site.