HOW to remove container on mobile from slide DAWN THEME

Solved

HOW to remove container on mobile from slide DAWN THEME

Filip02
Excursionist
29 0 7

Filip02_0-1734115824890.png

 

goorde.com

Password: Kurac

Accepted Solution (1)
Made4uo-Ribe
Shopify Partner
9666 2300 2869

This is an accepted solution.

Im not sure why your slideshow showing differently. Add this one. 

This code is only for this slideshow banner. So it wont affect the slideshow on the homepage. 

 

 

@media only screen and (max-width: 749px) {
    div#Slide-template--24098494415194__slideshow_7WPbtC-1 .slideshow__media.banner__media.media {
        display: flex;
    }

    div#Slide-template--24098494415194__slideshow_7WPbtC-1 .slideshow__text.banner__box.content-container {
        background: transparent;
    }

    div#Slide-template--24098494415194__slideshow_7WPbtC-1 .slideshow__text-wrapper.banner__content {
        position: absolute;
        top: 50%;
        bottom: 50%;
    }
}

 

 

And Save. 

Same instruction,. 

Result:

Made4uoRibe_0-1734206853590.png

 

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.

View solution in original post

Replies 3 (3)

Made4uo-Ribe
Shopify Partner
9666 2300 2869

Hi @Filip02 

From the mobile or desktop?

This is current mobile slidewho you have. 

Made4uoRibe_0-1734123062768.png

YOu remove the image on it. 

To add it on. 

  1. From your Shopify admin dashboard, click on "Online Store" and then "Themes".
  2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
  3. In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

 

@media only screen and (max-width: 749px){
div#Slider-template--23840841367898__slideshow_LHWffh .slideshow__media.banner__media.media {
    display: flex;
}
}

 

 

  • And Save.
  • Result:
  • Made4uoRibe_1-1734123150087.png

     

  • To remove the container in the dekstop, same instruction. 

 

 

.slideshow__text.banner__box.content-container {
    background: transparent;
}

 

 

  • And Save. 
  • Result:
    Made4uoRibe_2-1734123250718.png

     

 

 Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better! 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.
Filip02
Excursionist
29 0 7

Hi that work only for that slide i can t make it on this page slider https://goorde.com/pages/o-nama can you set it up

Made4uo-Ribe
Shopify Partner
9666 2300 2869

This is an accepted solution.

Im not sure why your slideshow showing differently. Add this one. 

This code is only for this slideshow banner. So it wont affect the slideshow on the homepage. 

 

 

@media only screen and (max-width: 749px) {
    div#Slide-template--24098494415194__slideshow_7WPbtC-1 .slideshow__media.banner__media.media {
        display: flex;
    }

    div#Slide-template--24098494415194__slideshow_7WPbtC-1 .slideshow__text.banner__box.content-container {
        background: transparent;
    }

    div#Slide-template--24098494415194__slideshow_7WPbtC-1 .slideshow__text-wrapper.banner__content {
        position: absolute;
        top: 50%;
        bottom: 50%;
    }
}

 

 

And Save. 

Same instruction,. 

Result:

Made4uoRibe_0-1734206853590.png

 

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.