How can I center the footer text in Dawn theme on desktop view?

Hi, I’m trying to get the footer text on my store to be centered. It is centered when viewed on mobile, but it becomes right-aligned and off-center when viewed on a desktop.

Domain: www.etherealoasis.co

Theme: Dawn

Hello @spacetimerider ,

You can follow these steps:

  1. Go to Online Store->Theme->Edit code

  1. Open your theme.liquid file, paste the below code before


I hope the above is useful to you.

Kind & Best regards,
GemPages Support Team

Hello @spacetimerider ,

We are AliReviews - an All-in-one solution to helps collect, showcase, and manage impactful reviews.

To center the footer text on your store on desktop, you can use CSS to adjust the alignment. Here’s how:

  • Go to Online Store → Themes → Actions → Edit Code
  • Click on “Assets” and open the “theme.scss.liquid” file.
  • Add this code at the bottom of the file:
@media screen and (min-width: 769px) {
  .site-footer__text {
    text-align: center;
  }
}
  • Save and preview.

If you want to center the footer text on all screen sizes, including mobile, you can simplify the code by removing the media query, like this:

.site-footer__text {
  text-align: center;
}

Hope these can helps, please let us know if you have any further questions, we’d love to assist.

Regards,

AliReviews team.

Hi, I apologize for not being specific. These solutions seem to center all text in the footer, but I’m trying to just center the text at the very bottom where the copyright info is. It’s in this section of the footer.liquid file:


      

 
          <small>© {{ 'now' | date: "%Y" }} {{ "ETHEREAL OASIS" | link_to: routes.root_url }}</small>
        
        

          <small>
            Q
            Powered by Psychedelic Sex Magick Q
        
          </small>
<small>

Hello @spacetimerider ,

You can add the text-center class to the div element that contains the copyright text. Here’s how you can do it:


  <small>
    © {{ 'now' | date: "%Y" }} {{ "Your Store Name" | link_to: "/" }}
  </small>

Add the text-center class to the div element, like this:


  ...

Hope it can helps

@spacetimerider
Put below css into theme.liquid file before closing Tag

@media (min-width: 750px ) {
.footer__content-bottom-wrapper:not(.footer__content-bottom-wrapper--center) .footer__copyright {
    text-align: center !important;
} 
.footer-block--newsletter .footer-block__newsletter {
              display: flex;
              flex-direction: column;
              align-items: center;
              width: 100%;
          }
          .footer-block__newsletter:not(:only-child) .footer__newsletter {
              justify-content: center;
              align-items: center !important;
          }
          .footer-block--newsletter {
              flex-direction: column;
              align-items: center !important;
          }
}

Hi @spacetimerider ,

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/section-footer.css->paste below code at the bottom of the file:

@media screen and (min-width: 750px) {
    .footer__content-bottom-wrapper {
        justify-content: center !important;
    }
    .footer__copyright {
        text-align: center !important;
    }
}

I hope it would help you
Best regards,

Richard | PageFly

Works beautifully! Thank you!


Hello,

I try to centre my footer as well, like here above. But I’m missing the assets in the edit code…

Any one that can help me? I would like to centre the complete footer, thanks.