dawn theme how to make blog as grid on mobile

Store Design
1

Hi, I would like to make on mobile view on homepage, the blog section as grid (and not slide)

website https://smartappartde.myshopify.com/

password 1234

Thanks for your help

2

taahahhahahhahh

3

sorry

4

Hello @urbantis ,

Go to online store > edit code > search bas.cc file and add this code in the end :

@media only screen and (max-width: 767px) {
  ul#Slider-template--17432269586522__featured_blog_UtidtP {
    display: grid;
  }
}

Thanks!

5

Hi @urbantis

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.css / based.css file and paste the code in the bottom of the file.
@media screen and (max-width: 989px) {
    .slider.slider--tablet {
     
        flex-wrap: wrap !important;
   
    }
}
@media screen and (max-width: 749px) {
    .grid--peek.slider .grid__item:first-of-type {
        margin-left: 0px !important;
    }
    .blog__posts {
    padding: 10px 20px !important;
}
.slider-mobile-gutter.scroll-trigger.animate--slide-in .slider-buttons.no-js-hidden {
    display: none;
}
}

Result:

websensepro_0-1749032331612.png
websensepro_0-1749032331612.png430×578 185 KB

websensepro_1-1749032336354.png
websensepro_1-1749032336354.png427×570 184 KB

If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!
Use our Big Bulk Discount app to boost your sales! :rocket: (https://apps.shopify.com/big-bulk-discount). Easy to set up and perfect for attracting more customers with bulk discounts. Try it now and watch your revenue grow!

If you are happy with my help, you can help me buy a COFFEE