FROM CACHE - en_header

DEBUT THEME - How to remove the white box in mobile version slides show?

Solved
Lolovic
Excursionist
28 0 4

Hi guys

1. I have removed the slick dots and arrow from the mobile version. How do I remove the white box from the mobile version as well?

2. How can I move the shop now button and/or other wordings to the bottom of the picture?

Thank you

fqeff.JPG

Accepted Solution (1)

Accepted Solutions
oscprofessional
Shopify Partner
13848 2107 2714

This is an accepted solution.

Hello Lolovic,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.css.liquid

@media screen and (max-width: 749px){
.slideshow__text-wrap--mobile {
    background-color: transparent;
    top: -3.2rem;
}
}
If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant

View solution in original post

Replies 18 (18)
oscprofessional
Shopify Partner
13848 2107 2714

Hello Lolovic,
Please share your site url.
So that i can check and let you know the exact solution here.

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant
Lolovic
Excursionist
28 0 4
oscprofessional
Shopify Partner
13848 2107 2714

This is an accepted solution.

Hello Lolovic,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.css.liquid

@media screen and (max-width: 749px){
.slideshow__text-wrap--mobile {
    background-color: transparent;
    top: -3.2rem;
}
}
If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant
Lolovic
Excursionist
28 0 4

It works perfectly. Thank you

RawCutSB
Tourist
7 0 2

I could not get this to work what exactly and where exactly do I past code in. You mention bottom do mean the very bottom of all code lines? 

gbanks789
New Member
2 0 1

Thank you! This worked for me. Now, how do I move the button and text so that they do not lay directly over the image?

Ebcswim
New Member
5 0 0

Hi I got rid of the box over the picture but I have two slideshows and there is loads of padding underneath each one so there is a big white gap between each slide show, can you help??

oscprofessional
Shopify Partner
13848 2107 2714

@Ebcswim ,

Share the store URL with screenshot

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant
Ebcswim
New Member
5 0 0

HiOscprofessional, thanks for reply. It’s ebcswim.com but it’s password protected while I work but I can take off if you need. I used your above code and now looks like this: 

5D7946D5-2CFC-46D8-B739-80056788A061.png

3559FFAC-D2FD-4C39-94C6-931ED03A77E4.png

 ideally I would just like shop button on the bottom of the images, but I would be ok if not possible and button stays where it is, if there wasn’t these massive white gaps…….

thanks 

oscprofessional
Shopify Partner
13848 2107 2714

@Ebcswim ,

Password

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant
Ebcswim
New Member
5 0 0

Ebcswim - the live theme isn’t the one where i used your code I used that on a duplicate - but you can see the issues on this one perfectly - thanks 

Ebcswim
New Member
5 0 0

Hey osc, did you manage to look with the password ebcswim? Thanks 

oscprofessional
Shopify Partner
13848 2107 2714

@Ebcswim ,

@media only screen and (max-width: 600px) {

div#shopify-section-16450244219d6b7b8c {
margin: 0;
padding: 0;
}
.slideshow__text-content.slideshow__text-content--mobile.slideshow__text-content--mobile-0.text-center {
padding: 0;
}
}

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

 

 

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant
candyman1
Excursionist
15 0 5

I don't have a theme.css.liquid option. Could I just add this in the bottom of Theme.CSS?

oscprofessional
Shopify Partner
13848 2107 2714

@candyman1 ,

Yes

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant
Fashionfactor
New Member
1 0 0

Hi There, it worked but the font color on the mobile become black, how can i turn it to white.

 

thanks 

oscprofessional
Shopify Partner
13848 2107 2714

@Fashionfactor ,

Please share the screenshot.

If helpful then Please Like and Accept Solution. Chat on WhatsApp | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87 | Hire us | Guaranteed Site Speed Optimization | Website Free Audit | Shopify Theme Customization | Build Shopify App | Custom Pricing Wholesale App | Shopify SEO | Digital Marketing | Shopify Strategies Consultant
Prettypups1
New Member
1 0 0

Hey!

 

My Asset's folder doesn't have 'theme.css.liquid' Please advise.