How do I do a vertical footer/multicolumn in the footer

Shopify Discussion

Topic summary

Main issue: Implement a vertical, multicolumn footer with many links in the Shopify Dawn theme.

What works so far:

  • Use Online Store > Themes > Customize > Footer to add multiple footer blocks (links/descriptions). Dawn will render these as columns.
  • To make footer links open specific pages, set them in Online Store > Navigation > Footer menu by editing each menu item and linking it to the desired page.

When links show horizontally:

  • Identified cause: theme CSS. Suggested fix: add custom CSS in theme settings to change the footer link container to a grid layout (e.g., target .footer-block__details-content and set display: grid) so links stack vertically in columns.

Resources provided:

  • Video demo for linking pages to footer menu items (YouTube link).
  • Video on applying custom CSS in theme settings (YouTube link).
  • Images illustrating the footer layout (supportive, not essential).

Current status:

  • One user reports the CSS approach did not work; no confirmed resolution or alternative provided yet. Discussion remains open.
Summarized with AI on December 17. AI used: gpt-5.
1

Hi,

I was looking through other websites and noticed they had a vertical column, and many links in the footer. For example, if you scroll down on the Nike website they have it. Does anyone know how to add one using the dawn theme?

2

Hi @ayaanj0208

We can customize the footer in the Dawn theme to show Vertical links & multicolumn contents. Here are the steps to do it -

  1. Go to your store’s Shopify admin.

  2. Click on Online Store > Themes > Customize

  3. Go to Footer section in the left menu

  4. Add the footer links & description that needs to be shown

The dawn theme will show these sections in the form of columns. Here is a sample image to show the added sections.

dawn-footer.png
dawn-footer.png2869×2368 609 KB

I hope you find this helpful.

Thanks & Regards,

Scale-up print

1 Like
3

Thank You this really helped but how do I get the pages to show up as well?

4

Hi @ayaanj0208

We are glad that our previous reply helped you.

About the link pages in footer to show up as well, you can attach the page link for each of footer menu item which will allow your website visitor to click & open the page.

Here are the steps to apply page link with the menu item -

  1. Go to Shopify Admin > Online Store > Navigation

  2. Select Footer menu

  3. Click on the menu item > Edit

  4. Select the page from dropdown to link with menu item

Also, for details please refer to our demo video where we have given the demo for linking pages with the footer menu https://youtu.be/x5m9wP2RRLA

Thanks & Regards,

Scale-up Print

5

Hello, when I try this my footer links come up horizontally. Is there a way to make them vertical columns?

6

Hi @TheBogeyBunch ,

I hope you are doing well!

The horizontal alignment of the footer links is because of the CSS code of the current theme. One of the way to display the links in vertical columns is using the Custom CSS options present in the theme settings.

Based on the CSS class applied on the footer link element, here is the Custom CSS code you can use -

.footer-block__details-content{
  display: grid !important;  
}

Here is the image for the reference-

scaleupprint_0-1704180494537.png
scaleupprint_0-1704180494537.png1071×707 155 KB

For details about how to apply Custom CSS in the theme settings of Shopify you can refer to this video https://youtu.be/nPja-jHwmPc

Please let me know if more details are required.

Thanks & Regards,

Scale-up print

7

Not working for me .Is there any option to display footer section text, image quick link vertically .Thanks for the help .