Re: Centering Quick Links in Footer - Dawn Theme

Centering Quick Links in Footer - Dawn Theme

Sato71
Tourist
18 0 3

I'm trying to center these quick links in the footer (Dawn theme) so they are centered under the Quick Links title - does anyone know how to do that? I managed to get the other parts of the footer adjusted and centered but not these for some reason. Thanks!

quick links center.PNG

Replies 9 (9)

Made4uo-Ribe
Shopify Partner
10196 2420 3064

Hi @Sato71 ,

Can I give a try? WOuld you mind to share your URL website? with password if its protected.Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Sato71
Tourist
18 0 3

Yes the website is kennasatodesigns.com - thank you!

Made4uo-Ribe
Shopify Partner
10196 2420 3064

Thank you for the infromation. Try this. 

  1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
  2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
  3. In the "Assets" folder, click on "base.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
  4. And Save.
.footer-block.grid__item.footer-block--menu.scroll-trigger.animate--slide-in {
    text-align: center;
}

Result:

Ribe_Dagandara_0-1688560963406.png

I hope it help. 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
MiaIshaaq
Tourist
3 0 1

Thank you very much, finally got this to work. Is there a different code so it works on mobile as well please as this only centered desctop version, thank you

 

Made4uo-Ribe
Shopify Partner
10196 2420 3064

For the mobile check this one. 

Same Instruction. 

 

@media only screen and (max-width: 749px){
.footer-block.grid__item h2, .footer-block__brand-info {
    text-align: center !important;
}

.footer-block__brand-info .footer__list-social.list-social, .list-menu__item {
    justify-content: center;
}
}

 

And Save.

Result:

Made4uoRibe_0-1708297529600.png

 

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.

INA_MSWEB
Shopify Partner
1281 144 168

Hi @Sato71 


I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:

@media screen and (min-width: 750px) {

.footer-block {text-align: center;}

.footer-block__details-content>li {margin: 0 !important;}

}

 



Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin

ZestardTech
Shopify Partner
6144 1097 1474

Hello There,

 

1. In your Shopify Admin go to online store > themes > actions > edit code

2. Find Asset > base.css and paste this at the bottom of the file:

.footer-block__details-content {
    text-align: center;
}

ZestardTech_0-1688533951445.png

 

Want to modify or develop new app, Hire us.
If helpful then please Like and Accept Solution .
Email: support@zestard.com
Shopify Apps URL :- https://apps.shopify.com/partners/zestard-technologies
Custom Modifications Into Shopify Theme | Shopify Private App | SEO & Digital Marketing

oscprofessional
Shopify Partner
16372 2440 3188

Hello @Sato71 

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.

.footer-block__details-content {
    text-align: center !important;
}

 

Hire us | Pass Core Web Vital | B2B Wholesale Experts | Claim Your Free Website Review |
Connect with Us: WhatsApp | Skype: oscprofessionals-87 | Email: pallavi@oscprofessionals.com |
Custom Shopify SolutionsPrivate Apps, Theme Customization & SEO | Digital Marketing |
OSCP Apps: Discount Suite | Wholesale App | Bundle & Upsell | Shipping Discount | and more...
Sato71
Tourist
18 0 3

Thanks for the info! When I try these options it centers them but not everything is aligned correctly - instead, is there a way I can align the "Quick Links" and "About Us" to the left?

footer.PNG