How to center footer items (broadcast theme)

Solved

How to center footer items (broadcast theme)

TimTakeTwo
Excursionist
28 0 6

Hello my website and page is

 

https://taketwojewelry.com/pages/about-take-two

 

I would like to center the footer social icons on both desktop and mobile.

Can someone please help? Thank you.

 

TimTakeTwo_0-1708389635195.png

 

Accepted Solutions (2)

EBOOST
Shopify Partner
1292 327 391

This is an accepted solution.

Hi @TimTakeTwo ,

May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code

EBOOST_1-1672356985580.png
2. Assets/theme.css
3. Add code below to end of file

.footer__block.footer__block--social {
	flex: 0 0 100%!important;
}
.footer__block.footer__block--social .socials {
	justify-content: center!important;
}

 

 

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips

View solution in original post

StephensWorld
Shopify Partner
1400 174 384

This is an accepted solution.

Hey @TimTakeTwo 

 

 

Go into your admin > online store > themes > customize > click into the "footer" section from the left-hand menu > add the following coding to the "Custom CSS" area:

 

.socials {
  display: flex;
  align-items: center;
  justify-content: center;
}

 

custom CSS.png

 

Then click into the "social" block within the 'footer' section, and change the "Column width" to 100. 

 

column width.png

 

Save changes, and then you should be good-to-go! 🙂

★ Did my post help? If yes, then please like and accept solution. ★

https://stephens.world
support@stephensworld.ca

View solution in original post

Replies 4 (4)

EBOOST
Shopify Partner
1292 327 391

This is an accepted solution.

Hi @TimTakeTwo ,

May I suggest to update code these steps:

1. Go to Store Online-> theme -> edit code

EBOOST_1-1672356985580.png
2. Assets/theme.css
3. Add code below to end of file

.footer__block.footer__block--social {
	flex: 0 0 100%!important;
}
.footer__block.footer__block--social .socials {
	justify-content: center!important;
}

 

 

- Hope can help. If you find my reply helpful, please hit Like and Mark as Solution
- Need a Shopify developer? Contact email: eboost10@gmail.com
- Visit our site: https://www.eboosttech.net to view and download shopify themes and magento2 extensions free
- ❤❤DONATE ❤❤Coffee tips
TimTakeTwo
Excursionist
28 0 6

Thank you!!

StephensWorld
Shopify Partner
1400 174 384

This is an accepted solution.

Hey @TimTakeTwo 

 

 

Go into your admin > online store > themes > customize > click into the "footer" section from the left-hand menu > add the following coding to the "Custom CSS" area:

 

.socials {
  display: flex;
  align-items: center;
  justify-content: center;
}

 

custom CSS.png

 

Then click into the "social" block within the 'footer' section, and change the "Column width" to 100. 

 

column width.png

 

Save changes, and then you should be good-to-go! 🙂

★ Did my post help? If yes, then please like and accept solution. ★

https://stephens.world
support@stephensworld.ca

TimTakeTwo
Excursionist
28 0 6

Thank you!!!!!!!!!!!!!!!!!!!!