Move text box over more on slides- in STUDIO theme

Solved

Move text box over more on slides- in STUDIO theme

SKILLFULSTART
New Member
8 0 0

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 Screenshot 2024-03-31 at 8.50.30 AM.png

Accepted Solution (1)
niraj_patel
Shopify Partner
2391 516 515

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.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

View solution in original post

Replies 10 (10)
SKILLFULSTART
New Member
8 0 0

Are you able to help me write that code? That is the part I am not familiar with 

niraj_patel
Shopify Partner
2391 516 515

Hello @SKILLFULSTART 

you can do this through customizer
see the below image

techlyser_web_0-1711890917622.png

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com
SKILLFULSTART
New Member
8 0 0

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.

niraj_patel
Shopify Partner
2391 516 515

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.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com
SKILLFULSTART
New Member
8 0 0

THANK YOU SO MUCH!!! Worked like a charm 

SKILLFULSTART
New Member
8 0 0

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 

 

SKILLFULSTART
New Member
8 0 0

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 

niraj_patel
Shopify Partner
2391 516 515

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.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

ThePrimeWeb
Shopify Partner
2139 616 524

Hey @SKILLFULSTART,

 

Can you share the link to your store please? Thanks!

Was I helpful?

Buy me a coffee

🙂

Need help with your store? contact@theprimeweb.com or check out the website
Check out our interview with Shopify!
SKILLFULSTART
New Member
8 0 0

https://skillful-start.myshopify.com/?key=882c4f29a00830db1163ffa2b13aa5dc22bf6c2fe06a35e4a7f1872873...

 

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