New Shopify Certification now available: Liquid Storefronts for Theme Developers

Dawn 9.0 Footer Quick Links Line Spacing

5 0 1



I'd like to adjust the line spacing of only the Quick Links menu box in the footer section. Currently the line spacing is quite large. I would like to be tighter - more like single spacing for any additional links. 


Also, I would like to change the font side of the links. 


My current view is the Blue background. I would like it to look like the white background (line spacing and font size)


Thank you!


Screenshot 2023-04-02 at 10.09.17 PM.png

Screenshot 2023-04-02 at 10.09.09 PM.png

Replies 7 (7)
Shopify Partner
5587 1260 1166

Hello @JustLitWicks ,


It's the GemPages Support Team and we are glad to assist you today!


Could you please share your store URL ( with the password if your store password is enabled ) then I can see and suggest something for you?


Best regards,
GemPages Support Team

GemPages - Build any high-converting store pages for any business

- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
5 0 1



my Url is

I am not comfortable putting my password on a public forum. Please let me know if an alternative solution is possible

Shopify Partner
33 3 1

For these types of small changes you can just find the chrome developer tools and inspect the links, there's even a color picker in the chrome dev tools so you can see what your changes look like. What you described sounds like you need to change the background color of the container and changed the margin of the links.


If you go into chromes dev tools you can play around with it without worrying about breaking anything, once you find something you like then you can update your site's css.
-Headless Shopify Ecommerce Agency
-We specialize in site speed optimization and have already achieved 4 100s in google lighthouse
Shopify Partner
2405 223 533

Hello @JustLitWicks,

I am Gina from flareAI app helping Shopify merchants get $6Million+ in sales from Google Search, on autopilot.

To adjust the line spacing and font size of only the Quick Links menu box in the footer section, you can use custom CSS code. Below are the steps to do this.

1. Go to your Shopify admin panel and click on "Online Store" > "Themes".
2. Find the theme you are using and click "Actions" > "Edit Code".
3. In the left-hand column, click on "Assets" and then click on "theme.scss.liquid" to open the file.
4. Scroll down to the bottom of the file and add the following code:
/* Adjust Quick Links menu box line spacing */
.site-footer .footer__quicklinks ul {
line-height: 1.2;

/* Adjust Quick Links menu box font size */
.site-footer .footer__quicklinks a {
font-size: 14px;

5. To change the background color of the Quick Links menu box to white, add the following code to the same file:

/* Change Quick Links menu box background color to white */
.site-footer .footer__quicklinks {
background-color: #fff;

6. Save the changes to the file and refresh your website to see the changes take effect.

Adjust the values in the code as needed to achieve your desired line spacing and font size. You can also change the font family or color by adding additional CSS code.


flareAI : Get Sales from Google Search, on Autopilot
$10+ billion in eCommerce on Google Search, every day. Find out how much you are missing
5 0 1

Hi Gina, 


I do not have theme.scss.liquid as an option under assets. 


Screenshot 2023-04-06 at 5.53.53 PM.png

Shopify Expert
2942 394 414

Hi @JustLitWicks

Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

147 16 17

Hi @JustLitWicks 

Follow these Steps:

Go to Online Store Edit Code Find theme.liquid file or base.css

Add the following code in the bottom of the file above </body> tag {
    line-height: 10px;