To change Portfolio Overlay to Carousel on Mobile, you can do these.
- Use Portfolio Overlay
- Use code to add a Portfolio Carousel
- Use CSS to hide Carousel (Desktop) – hide Overlay (Mobile)
#1. First, follow this guide to add Portfolio Carousel.
#2. Find ID of Portfolio Overlay & Carousel.
In my example, we will have:
Portfolio Carousel (use Code Block)
#3. Use this code to Custom CSS
/* Hide Carousel on Desktop */
@media screen and (min-width:768px) {
section[data-section-id="6821eec05a6acf43f1f6e4fd"] {
display: none !important;
}
}
/* Hide Overlay on Mobile */
@media screen and (max-width:767px) {
section[data-section-id="67f782d36862e60e59dc2681"] {
display: none !important;
}
}
#6. Result
Desktop
Mobile
