Hello
I would like my heading go only half of the section for desktop only, how can I do that please
No text over product image
Topic summary
A user seeks to modify their Shopify theme so the heading section spans only half the width on desktop, keeping text separate from product images.
Proposed Solution:
- Navigate to Shopify Admin > Online Store > Theme > Customize
- Add custom CSS targeting the slideshow wrapper element
- The CSS code sets width to 50% and adjusts margin properties
Note: The provided code snippets and screenshot links appear corrupted or encoded incorrectly in the original posts, which may affect implementation. The discussion remains open with no confirmation that the solution was tested or resolved the issue.
Hi @elise1
To make the header occupy only half of the section on desktop, please follow these steps:
Step 1: Go to Shopify Admin > Online Store > Theme > Customize
Step 2: Add the following code into the CSS customization section of your theme.
m-slideshow > .swiper-container > .swiper-wrapper > div:nth-child(2) > .m-slide.m-slide--middle-left > .m-slide__wrapper {
width: 50% !important;
margin-left: 0 !important;
}
Here’s what it will look like once the code is successfully added https://prnt.sc/wY5gq8Mgxacr
I hope this helps!
Best regards,
Daisy