How to make a footer like this?

Hello!

I’m trying to put together a footer that looks like this one, in terms of design (see screenshot below). Is it possible?

Thanks!
For reference, my website is https://crisisequipped.com

Are you using X or Pro? I believe you can create a custom footer like that in Pro, in X you’re limited to 4 columns. If you have X and you don’t necessarily need 5 columns in the footer you can create the column on the right by using the raw element and shortcodes.

Hi!

I’m using X. I would only need 4 columns, so that’s perfect! Could you show me how to do it using the raw element and shortcodes?
Thanks so much :slight_smile:

1 Like

Hi Nadia,

Please kindly follow the steps below:

  • Go to X > Theme Options > Footer and make sure that you set the columns to four and save the Theme Options:

  • Go to X > Global Blocks and add four global blocks there.
  • Inside each global block you have full control using the builder to add the links headline and text. You can use the Text element or Headline element or whatever element you see fit to create the content of the columns.

Go to the Element section of our documentation and find the elements you would like to use.

  • After you finished adding the content. You can go back to X > Global Blocks and see that there is a shortcode assigned to each global block. Write the shortcode down to use later. Click here for more information about Global Blocks.
  • Go to Appearance > Widgets and you will find four widget areas representing the four columns named footer[1-4].
  • Drag the Custom HTML widget into each of the footer widget areas and paste the shortcode for each Global Block representing each column:

There you will have the footer with four columns. The process would be much easier if you had the Pro theme as you would directly use the Footer builder for the footer of your website:

If you are interested in converting from X to Pro you can follow the instruction below:

Thank you.

1 Like

Hi!

I followed your instructions and I came across one little problem.

When I make the footer 4 columns, it shrinks the “recently seen” section.

The original looks like this:

But when the columns are adjusted, it looks like this:

Any suggestions to prevent this from happening? Or would I have to have the products in the “recently seen” section stacked rather than across the page (A long time ago I customized it to go across instead of down).

I appreciate your help and suggestions! :slight_smile:
Nadia

Hello Nadia,

It is best that your should have the products in the recently seen section display as stacked since your widget area will only display 1/4 of the footer as part of the 4 column footer layout.

Hope this makes sense.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.