How can I rearrange social icons and add 'Follow us' in the footer?

[jehan70]

Hi there,

Please let me know, how i can move social icons under newsletter and add ‘Follow us’ above them?

[oscprofessional]

@jehan70

Please share the store URL ?

[infoatcodelab7]

@jehan70

Please share your site URL,
I will check out the issue and provide you a solution here.

[infoatcodelab7]

@jehan70

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

.footer-block--newsletter {
    flex-direction: column;
    align-items: flex-start;
}

[oscprofessional]

@jehan70

.footer-block--newsletter {
    display: flex;
    flex-direction: column;    
align-items: flex-start;

}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->base.scss.liquid

[Moeed]

Hey @jehan70
Follow these steps

1. Go to Online Store
2. Edit Code
3. Add below code in the bottom of theme.liquid file above

[jehan70]

@infoatcodelab7

It worked, but how to add ‘Follow us’

[PageFly-Victor]

hi @jehan70

You can follow this step to make “follow us” on footer

Step1: go to navigation => click footer menu

Step2: add menu item

Step 3: add title you want and link URL then click save

Hope this answer helps.

Best regards,

Victor | PageFly

[DelightCart]

@jehan70 Please send me store url.

[infoatcodelab7]

@jehan70

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > section-footer.css and paste this at the bottom of the file

.footer-block__newsletter + .footer__list-social::before {
	content: 'Follow Us:';
	position: relative;
	left: 0;
	width: 100%;
}
.footer-block__newsletter + .footer__list-social{
  justify-content: flex-start;
}

[jehan70]

@infoatcodelab7

It worked, thanks

Can you add space between signup bar and follow us text?

[infoatcodelab7]

@jehan70

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > section-footer.css and paste this at the bottom of the file

ul.footer__list-social.list-unstyled.list-social {
    padding-top: 20px;
}