Shopify themes, liquid, logos, and UX
Hi! I'm using Dawn theme. On the Footer section, is it possible to move this payment icons on the right instead and aligned with the Lower left text (the one with powered by shopify)? For desktop/laptop view only.
Or if not, can I just align them to the left instead so it would look more balanced
Thank you!
tryhangoverhelper.com
https://51d86a-2.myshopify.com/
Password: steiyi
Solved! Go to the solution
This is an accepted solution.
@HangoverHelper Please follow the below steps to move the payment icons to the right instead and align them with the lower left text (the one powered by Shopify) for desktop/laptop alone. Let me know whether it is helpful for you.
@media screen and (min-width: 750px) {
.footer__content-bottom {
display: flex;
flex-direction: row-reverse;
max-width: var(--page-width);
margin: 0 auto;
padding: 3rem 5rem 0 5rem;
align-items: center;
}
.footer__content-bottom-wrapper {
padding: 0 !important;
}
.footer__localization:empty+.footer__column--info {
align-items: flex-end;
}
}
Hi @HangoverHelper,
You can try this code by following these steps:
Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code
Step 2: Search file base.css , theme.css or styles.css
Step 3: Insert the below code at the bottom of the file -> Save
.footer__content-bottom.scroll-trigger.animate--slide-in {
display: flex !important;
flex-direction: row-reverse !important;
}
Here is result:
Hope this can help you
If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍😍
Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges: Get more sales with striking labels, badges, and banners from our 10,000+ available templates.
BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now
Hello @HangoverHelper ,
I understand you are looking to change the positioning of Payment Icons in the Footer.
If you are looking to align the payment icon above the left text (powered by Shopify), then you can implement the below code.
Copy and add the code at the bottom of the theme.liquid file before </body> tag and save
<style>
.footer__localization:empty+.footer__column--info {
align-items: baseline !important;
}
</style>
Output -: https://prnt.sc/OB-hltuLUuXA
I hope the code helps you.
Please share if you have any queries.
Thank you.
This is an accepted solution.
@HangoverHelper Please follow the below steps to move the payment icons to the right instead and align them with the lower left text (the one powered by Shopify) for desktop/laptop alone. Let me know whether it is helpful for you.
@media screen and (min-width: 750px) {
.footer__content-bottom {
display: flex;
flex-direction: row-reverse;
max-width: var(--page-width);
margin: 0 auto;
padding: 3rem 5rem 0 5rem;
align-items: center;
}
.footer__content-bottom-wrapper {
padding: 0 !important;
}
.footer__localization:empty+.footer__column--info {
align-items: flex-end;
}
}
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025