The Global Footer Settings
Learn how to build, customize and style your footer using the SEO Design Framework. Below we'll cover two distinct ways to create and style your footer.
First, progress to the Global Footer background & typography options located under the SEO Design > Styles > Footer Chevron. From there, you can customize the widgets styling, background colors and font choices.
Next, use Appearance > Widgets > to create the widget layout and footer structure.
For example, if I add 3 widgets to the footer inside of Appearance > Footer> and set the Widget Layout to 1/3 1/3 1/3 on each widget I add, this will create 3 widgets in the footer (horizontal to each other in the footer in the order they were entered).
You can also use set equal height option under SEO Design > Styles > Widget Areas and Widgets > chevron to ensure that each widget maintains equal height in relation to widgets around it. *Just make sure Set Equal Widget Heights is set to "Yes".
To add content of media to the "Bottom Footer Area" (the very bottom of the page) use SEO Design > Footer > WP Editor visual or text mode (for HTML).
To add additional HTML scripts, use the Additional HTML chevron (in the header or footer) and in the content footer area, you can add media or shortcodes and then style the Bottom Footer Content section under SEO Design > Styles > Footer Tab >. To customize this section (i.e. background color, font size, area height, parallax, add a radius, etc. use the SEO Design > Styles > Footer controls.
Advanced Power Tip. Alternatively, if that seems too complicated, you can use the
SDF Page Builder for
creating drag and drop structures that can be used in the header, footer or widget areas with ease. Start with a draft or dummy page and then use the SDF Builder Modules to add the images, text, videos, widgets or media. Here's how to built it.
First >>> Proceed to a Page or Post and Click the SDF Builder Button.
Next >>> Add a Row or Hero section and select the column widths for the layout.
Next >>> Add modules to the SDF Page Builder such as widgets, videos, social media icons, a portfolio or Flikr widgets, contact forms or any other SDF Widgets with the SDF Widget Module or any of the SDF Builder Modules.
Next >>> Add the media elements you want to the columns with the SDF builder or widget functionality.
In this example I used a 1/4 1/4 1/4 1/4 column layout and added a widget to the first column, a text module to the second, an image module to the third and another widget to the fourth column. You can determine which widgets are displayed from a dropdown in the SDF Builder (or even create unlimited custom widgets) in Appearance > Widgets > Custom Widgets > and use them specifically inside the SDF Builder anytime you like.
Next >>> Click SDF Builder Button again, then copy the shortcode.
Next >>> Just paste the shortcode into the WP editor into the Footer Bottom WP Editor under the SEO Design > Footer > Text Editor Region
Once again, you can also use this technique (using Shortcodes from the SDF Page Builder) in the header, widget areas (by pasting shortcodes into Appearance > Widgets using the text widget (to allow HTML) or the footer to save time while maintaining responsive and mobile-ready designs with your media. This is yet another creative way to use the framework in the Footer Bottom Area.
The regular footer (the area between the bottom of the content area and "Footer Bottom") is named Footer Settings and appears first above the Footer Bottom Settings in the Tab inside the SEO Design > Styles > Footer.
