Solved

Centering the footer text on my "Spotlight Theme" using the "edit code" function.

obtainmercy
Tourist
12 0 0

I want to center the text/links at the bottom of my webpage. It's currently uncentered. I am using the "Spotlight Theme" and any help would be much appreciated. Thank you!

Accepted Solution (1)
Vinsinfo
Shopify Partner
157 56 50

This is an accepted solution.

@obtainmercy Please follow below steps and let me know whether it is useful for you.

1. Go to "Online Store" -> "Themes", click "Customize" button in the current theme.

2. Click footer section and paste below code in the "Custom CSS" field.

.footer__content-bottom-wrapper {
  justify-content: center;
}

priyavinsinfo_0-1708441282551.png  priyavinsinfo_1-1708441286962.png

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

View solution in original post

Replies 16 (16)

obtainmercy
Tourist
12 0 0

I can link the website if needed.

obtainmercy
Tourist
12 0 0

Links in replies. Thank you so much!

 

HELP.png

BrainStation23
Shopify Partner
260 43 41

Hi @obtainmercy 
Can you share your store URL and Probelm screenshot so that we can help you 

Brain Station 23 PLC
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email: js.team@brainstation-23.com
obtainmercy
Tourist
12 0 0
obtainmercy
Tourist
12 0 0

@BrainStation23 is onto it.. Follow that thread. Much love.

Vinsinfo
Shopify Partner
157 56 50

@obtainmercy Please share your store URL to help you on this.

obtainmercy
Tourist
12 0 0
BrainStation23
Shopify Partner
260 43 41

hi @obtainmercy 
You can try this code to resolve your issue
Go to online store->edit code-> go to section. footer.css file and replace bellow code 
In section. footer.css file line 53 

Your current code 
.footer__content-bottom-wrapper {
    display: flex;
    width: 100%;
}
Replace Code:
.footer__content-bottom-wrapper {
    
    width: 100%;
    text-align: center;
}
Just remove display:flex and add  text-align: center;

Redult:

BrainStation23_0-1708436595756.png

 

Brain Station 23 PLC
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
Email: js.team@brainstation-23.com
obtainmercy
Tourist
12 0 0

You help has done something.. and I appreciate it so much! So basically it did move.. but it's still not centered.. I'm using the same source code. https://obtainmercy.com/

Vinsinfo
Shopify Partner
157 56 50

This is an accepted solution.

@obtainmercy Please follow below steps and let me know whether it is useful for you.

1. Go to "Online Store" -> "Themes", click "Customize" button in the current theme.

2. Click footer section and paste below code in the "Custom CSS" field.

.footer__content-bottom-wrapper {
  justify-content: center;
}

priyavinsinfo_0-1708441282551.png  priyavinsinfo_1-1708441286962.png

 

Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

obtainmercy
Tourist
12 0 0

You help has done something.. and I appreciate it so much! So basically it did move.. but it's still not centered.. I'm using the same source code. https://obtainmercy.com/

obtainmercy
Tourist
12 0 0

Thank you for your help so far. I found the code you're talking about and it appears to already say that. Attached is the photo. 

 

HELP.png

obtainmercy
Tourist
12 0 0

I did this and changed line 300 in section-footer.css to 

 

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

obtainmercy
Tourist
12 0 0

@BrainStation23 is onto it.. Follow that thread. Much love.

Vinsinfo
Shopify Partner
157 56 50

@obtainmercy  It seems you have done some changes with the code, so the code we provided was not worked. You can just update the code from "text-align: right" to "text-align: center" in the highlighted code in the image below.

priyavinsinfo_0-1708501707577.png
To find this highlighted code, follow below steps,

1. Go to "Online Store" -> "Themes".

2. Click action button on the current theme and then select "Edit code".

3. Search "section-footer.css" file and then find the following line on the file.

.footer__content-bottom-wrapper:not(.footer__content-bottom-wrapper--center) .footer__copyright.

4. Then, you can update the code and save the changes.

priyavinsinfo_1-1708502278476.png


Please provide your support by click "Like" and "Accepted" if our solution works for you. Thanks for your support.

obtainmercy
Tourist
12 0 0

Thank you for your help so far. I found the code you're talking about and it appears to already say that. Attached is the photo. 

HELP.png