How can I center footer links with a logo on the side?

[sweetchin23]

Hi, can anyone help me? I want my footer links to be centered but the logo beside it is preventing it. 

please see the image. Thank you in advance.

[websensepro]

Hi, @sweetchin23.

KIndly share your store URL and password!

[sweetchin23]

https://halo-m.com/password
yiflow

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the Bottom of the file:

.footer-block.grid__item.footer-block--menu {
text-align: center;
}
.footer__content-top.page-width {
align-items: baseline;
}

[sweetchin23]

hello, I want it to be like the above image. Thank you.

 

[websensepro]

Hi, @sweetchin23.

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code just above tag </body>

<style>
.footer-block.grid__item.footer-block--menu {
    text-align: center !important;
}

.footer-block-image {
    justify-content: center;
}
</style>

Result:

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

[Anshul_arora]

Hello @sweetchin23 ,

I understand you are looking to display the footer links in between the logo and Instagram icon.

You can fix this issue by implementing the below mentioned steps-:

1. Go to Online store -> Themes -> Click on Three dots(Action) -> Edit code

2. Now, Search for the theme.liquid file and open it.

3. Next, add the below mentioned code at the bottom of the file before </body> tag.

<style>

.footer-block.grid__item.footer-block--menu {
width: 40%;
}

</style>

4. Save it.

After implementing the code output will look like this https://prnt.sc/bqNlTtHgoVg0

I hope it helps

Please let me know if you have any issue or need any further assistance.

Thank you.

[Made4uo-Ribe]

Hi @sweetchin23 

check this one. 

• From your Shopify admin dashboard, click on "Online Store" and then "Themes".
• Find the theme that you want to edit and click on "Actions" and then "Edit code".
• In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

.footer-block-image {
    justify-content: center;
}
.footer__blocks-wrapper.grid.grid--1-col.grid--2-col.grid--4-col-tablet {
    width: 66.66%;
    text-align: center;
}
.footer__content-top.page-width {
    max-width: 100%;
    justify-content: space-between;
}

• And Save. 
• Result:
• 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!