Shopify themes, liquid, logos, and UX
Hello,
I have never had this issue on other themes, but the text on the slides in Studio theme just don't seem to be over far enough, If I have something on Top left, I want it to be over more to the left and up more, same goes if I choose to have It on the right. Is there any custom CSS I can use for this so my text moves over more?
Screen shot attached of the text I want to be over more to the left and closer to the top
Solved! Go to the solution
This is an accepted solution.
You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (min-width: 750px){
.banner__content.banner__content--bottom-left {
align-items: flex-start !important;
}
.slideshow__text-wrapper.banner__content.banner__content--bottom-left.page-width {
padding-left: 0 !important;
margin-left: 0 !important;
}
}
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.
Are you able to help me write that code? That is the part I am not familiar with
Hello @SKILLFULSTART
you can do this through customizer
see the below image
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.
Yes I know I can move it that way, but currently the position in that photo I attached is Top left, that is as far as it will move over, I want it to be over more than the standard customizer options.
This is an accepted solution.
You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (min-width: 750px){
.banner__content.banner__content--bottom-left {
align-items: flex-start !important;
}
.slideshow__text-wrapper.banner__content.banner__content--bottom-left.page-width {
padding-left: 0 !important;
margin-left: 0 !important;
}
}
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.
THANK YOU SO MUCH!!! Worked like a charm
I do have one more question. If I want all my slides to always have 0 margins like this how can I do this easily, It looks like that applies it to just that one slide only , but If I add a new one and want the text on the right it has margins again
I meant to reply to you below but it went to myself - if I want this applied to all slides, even new ones, how can I do this. It seems it only applied on that one slide. If I add another with text to the right it doesn't do it
You can add code by following these steps
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (min-width: 750px){
div#Slider-template--16694202073264__slideshow .page-width {
margin: 0 !important;
padding: 0 !important;
}
}
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.
Hey @SKILLFULSTART,
Can you share the link to your store please? Thanks!
I want more options than just the standard drop down, as you can see it doesn't move it that far over with the options it gives me in the theme
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025