How do I create my footer with the Ex2 theme?

Create your footer

Similar in nature and function to the header, the footer is a section displayed on all (or almost all) pages and publications on your site. The main difference is that the footer is located at the bottom of your website.

Thus, unlike the header, the footer is often the area that visitors to the site see last. It’s not uncommon for people to miss the opportunity to create a good footer, but it can really make the difference in keeping users on your website as well as for conversions, subscriptions, etc.

This is where your visitors expect to find key information such as company details, contact information, links to social networks or additional or related content and links.

This is often a great location to add your links to other offers you might have or put the most important links and call-to-action buttons to avoid having to come back to the top.

Again, Ex2-Theme comes with a drag-and-drop footer generator allowing you to create your footer as easily as your header.

General and Design tabs

The General tab is your default view when opening the footer. Here you have an overview of the configuration of your footer.

In a left-hand menu, all your active footer elements will be listed.

The rest of the screen displays a live preview of your footer and the position of your items in the footer sections of your Visual Footer Builder.

The Design tab gives you the ability to define the color and background image for the entire footer, as well as add padding and margin.

Visual footer editor

As with the header, the visual footer also consists of three separate sections that can be customized. These three segments are:

The main footer, the centre section; this is the most important section of the footer, often containing one or more menus.
The top footer, which is the top part, is the perfect place to add a subscription form or call-to-action button
Bottom footer, the bottom portion. Generally, this is where copyright information is placed, as well as contact or business information (such as physical address, email address, phone number, company registration number, etc.)

As for the header sections, the customizations of each footer section are accessible by clicking on the "cog wheel" icon on the left side of the sections. Each section has two tabs:

General Tab

In this section, you can define the general parameters of your footer:

Column: select the number of columns you want to add to this footer section;
Layout: choose the layout of the columns according to the number of columns selected;
Layout of internal elements: displays widgets in the same column stacked (one on top of the other) or online (one next to the other)
Width: Set the width of the footer content to Full Width (edge to edge) or Content Width
Height: Set the height of this footer section.
Vertical alignment: Align the content of the element vertically on all columns of this footer section at the top, middle, or bottom of the section.
Hide on mobile: Hide this header on mobile devices.

Design Tab

Here, you can set the color and spacing parameters of your footer:

Top border size (and color): add the top border to the footer section by defining the size of your border.
Border Color: Once you have set your border size, an additional option will appear (Border Color) to choose the border color;
Background: define the background color of this footer;
Interior column spacing: add space in each column;
Padding: add padding on one or more sides of the footer;
Margin: add a margin on one or more sides of the header.

Each footer section can be customized separately for desktop and mobile. You can add different footer elements or change their position for each window.

Footer Elements

You can create your footer in the same way as your header. Compared to Header Builder, the Footer Builder offers a slightly lower number of elements. You can add the following to your footer sections: Footer Menu, Social, HTML, Widget and Copyright.

Below, we will show you how to use elements specifically available for the footer and some of those also used for headers but with slightly different parameters. The rest of the elements are used in the same way as with Header Builder.

Primary Menu

Here you will see the menu items you have added to your footer menu (in the Appearance > Menus section of your Wordpress dashboard).

In the “General” tab, you can set the Layout menu to Online or Stack and set the Alignment menu items.

The “Design” tab will allow you to define text and background colors, menu font size, menu spacing and margin.

Social

Compared to the social element used for the header, the one in the footer has the additional option “Alignment”, available in the “General” tab.

Copyright

This element allows you to simply add and style your copyright and it can only be used in the footer. This is a good place to use the following shortcode elements to add related elements:

[copyright]
2023
[site_title]
[theme_author]

Updated on: 27/03/2023