Footer formatting options? (non-pro)

[SwimNC]

Is there a way to achieve this type of layout in the footer without the Pro version? Would I need to code it as custom html, or is there an easier way?

[jade]

Hi there,

Yes, this should be fairly easy to achieve using X.

First. go to X > Launch > Options > Footer > Footer Widget Areas and set it to Three.

Second. Go to Appearance > Menus and create the menus for Company, Products, Guides, etc.

Third. Go to Appearance > Widgets and place the menus created previously to the footer widgets accordingly.

Then add this code in the custom CSS:

.x-colophon.top {
    background-color: #015C79;
}

.x-colophon.bottom {
    background-color: #013A4D;
    border: 0;
    box-shadow: none;
}

.x-colophon.bottom .x-social-global {
    float: right;
}

.x-colophon.bottom .x-nav {
    float: left;
}

Hope this gets you started.

[SwimNC]

Thanks so much! It’s almost perfect. How can I clear the formatting on the text and menu to make it more readable?

[lely]

Hi There,

You are always welcome.
We can use developer tools to inspect element and check applied styles.
See this: https://screencast-o-matic.com/watch/cb6Yj1IMJT

Inspect your own footer content, see active element and then adjust it accordingly. When you achieve the look you want, copy the CSS you have added on Custom CSS part of Theme Options.

[SwimNC]

Thank you so much. That worked pretty well after some trial and error.

[ruenel]

You’re are welcome!
We’re glad we were able to help you out.