How to reduce footer font size on mobile version of our website?

[neverlandvineya]

Hi! We’re trying to reduce the font size in the footer only of the mobile version of our website, which is currently looking like the snapshot below.

Is there any code we can insert in our footer CSS section to reduce the font size please? Our website is www.neverland-wine.com. Thanks!

[Moeed]

Hey @neverlandvineya

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

RESULT:

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[neverlandvineya]

Amazing, thanks Moeed! It works, but now is there a way we can

1. Place the ‘Language’ menu and Social Media icons next to each other? and

2. Place the list of pages currently beneath the Social Media icons next to the list currently above the Social Media icons so that it looks like two columns next to each other?

Thank you!

[DaisyVo]

Hi @neverlandvineya

I hope you are well. You can follow our instructions below:

1/ Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
2/ From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
3/ Copy the code below and paste it there

Here is the code for Step 3:

@media screen and (max-width: 768px){
footer.footer * {
    font-size: 14px !important;
}
}

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.

[neverlandvineya]

Hi Daisy,

Thanks for your suggestion! Unfortunately the code suggested doesn’t change the layout of our footer on our mobile version of the website. If you have any other thoughts on this, we’d be grateful, if not, thank you either way!

[DaisyVo]

Hi @neverlandvineya

May I see where you added the code from your end? It would be great if you can share the screenshot as well

[neverlandvineya]

Sure!