Spotlight Theme Footer Help

Store Design
1

Hi everyone!

I have two questions. This is pertaining to the Spotlight theme.

  1. The footer. How do I center the text. It looks great on desktop but would look much better if centered on mobile devices.

  2. Under the sections on the homepage, under “Collection List” how do I center the heading?

I really appreciate any assistance anyone can provide.

My website is www.PPFMerch.com

Thank You!

2

Hi @Justin34

This is Amelia from PageFly - Landing Page Builder App

You can try this code by following these steps:

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

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

@media (max-width: 767px){

.footer-block, .footer-block li a {

text-align: center !important;

justify-content: center !important;

}}

a.full-unstyled-link {

text-align: center;

}

Hope that my solution works for you.

Best regards,

Amelia | PageFly

3

Hi,

First to center the headings in the collection list you need to add the following code in that section on the custom css code.

card__heading {text-align: center;}

4

To make the footer centered on mobile devices

Go to online store then click on edit code
Search for base.css file
Add the below code at the end of the file
Save

@media only screen and (max-width: 768px) {
footer-block__heading {text-align: center !important;}
}

@media only screen and (max-width: 768px) {
footer-block__details-content {text-align: center !important;}
}

5

Hi Natasha… would that be the collection-list.liquid within the edit code? Where within that code would I post that code?

Thank you :slightly_smiling_face:

6

No you don’t need to work on the code for this go to your online store then customize the section where you added the collection list must have a feature to add css code just paste the code into it directly