Hi, I currently have testimonials on my Dawn theme homepage. In desktop view, they are a list. However in mobile view, I have set them as a showcase carousel. The only issue is when you slide to the next testimonial, you can still see some working from the previous testimonial. I did reach out to shopify, who’s answer was “it’s marginal” LOL which is besides the point. I do not like the look of it on my homepage. www.healingandher.com Please take a look and let me know if you can help.
Thanks!
Lol. I am not sure what is their meaning of “it’s marginal” but any way the code below should fix the mobile issue.
@media screen and (max-width: 749px){
#Slider-template--15845152325873__165351012669de39f7 .multicolumn-list__item.slider__slide {
margin: 0 1rem;
}
}
hi @HEALINGANDHER ,
I checked on your theme and provide a solve for you regarding issue you seeing.
You can go to the Online theme => Customize code => assets => base.css and then copy and paste the code below in that file:
@media only screen and (max-width: 749px){
.slider-mobile-gutter .slider.slider–mobile{
scroll-padding-left: auto !important;
}
.slider-mobile-gutter .slider–mobile.grid–peek.grid–1-col-tablet-down .grid__item{
width: 100%;
}
.background-none .slider-mobile-gutter .slider .multicolumn-card__info{
padding-left: 1.5rem;
padding-right: 1.5rem;
}
}
Hope can helpful to you!
Where do I insert this code?
Thank you!
Where do I paste this code?
Thanks!
Oh. @HEALINGANDHER ,
Sorry about that.
Go to your Admin store > Online store > Themes > Click Actions > Edit code
Open the base.css file under your Asset folder.
@media screen and (max-width: 749px){
#Slider-template--15845152325873__165351012669de39f7 .multicolumn-list__item.slider__slide {
margin: 0 1rem;
}
}
Hi, I have just gone through the whole file and I can’t see where I am replacing or entering this code?
In the Edit code view. Find the Asset folder, open the file base.css and add the code
Where abouts am I adding it?
Just at the bottom part of the base.css
Thank you! I had added that and it has worked. Can you please tell me how to move the pagination slightly closer to the testimonials, there is quite a large gap between the testimonial and the 1/6 page detail. Also, why when scrolling down my website, can I move the screen from side to side, causing the main page to go off centre?
I followed this video to create custom testimonial section for my shopify store with DAWN theme installed. I just copied the code and it’s done. It work for me.
Amazing video:
Hi, This is a good video. But the rows of the reviews are like the picture on mobile. i want one review a slide how can i fix this?
The same thing happened to me.
@MRamzan how can we fix it, please?
To fix it. We need to add some CSS code. If possible then please share the store URL. I will send you CSS code to add in your base.css Thanks.
@MRamzan this is the website: https://sandvollpro.com/
password: rtaunt
Ok perfect. Please give me sometime to write code for you. Thanks.
