Shopify themes, liquid, logos, and UX
Hi
Is there anyone that can help me with the coding to move the text in the home page image banner
It is currently selected as centralised but i wish to move it up further to the top so it will not block my image too much.
Any help is much appreciated.
Thanks
Solved! Go to the solution
This is an accepted solution.
Hi @FFPNF ,
This is Victor from PageFly - Landing page builder, I’d like to suggest this idea for solution:
Step 1. Go to Online Store -> Theme -> Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before </body> :
<style>
@media (max-width: 767px){
.banner__box.content-container.content-container--full-width-mobile.color-accent-2.gradient {
padding-top: unset;
position: relative;
top: -60px
}
}
</style>
Hope my answer will help you.
Best regards,
Victor | PageFly
This is an accepted solution.
Hello @FFPNF
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.
@media screen and (max-width: 749px){
.banner:not(.banner--mobile-bottom):not(.email-signup-banner) .banner__box {
position: absolute;
top: 0;
bottom: 0;
}
}
This is an accepted solution.
Hello @FFPNF
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.
.banner__content {
padding: 2rem !important;
}
This is an accepted solution.
Hi @FFPNF ,
This is Victor from PageFly - Landing page builder, I’d like to suggest this idea for solution:
Step 1. Go to Online Store -> Theme -> Edit code
Step 2. Open your theme.liquid theme file
Step 3. Paste below code before </body> :
<style>
@media (max-width: 767px){
.banner__box.content-container.content-container--full-width-mobile.color-accent-2.gradient {
padding-top: unset;
position: relative;
top: -60px
}
}
</style>
Hope my answer will help you.
Best regards,
Victor | PageFly
Hi Victor
This works for mobile.
If i wish to change it on desktop, is there another code?
This is an accepted solution.
Hello @FFPNF
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.
.banner__content {
padding: 2rem !important;
}
Do you have one for mobile version?
This is an accepted solution.
Hello @FFPNF
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.
@media screen and (max-width: 749px){
.banner:not(.banner--mobile-bottom):not(.email-signup-banner) .banner__box {
position: absolute;
top: 0;
bottom: 0;
}
}
Hello @FFPNF
If my solution is helpful to you please like my post
Hi! I'm having a similar issue. I would be so thankful for your help! Could you send me a message?
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