Store URL: https://nveda-main.myshopify.com/
In Home page help me to resize the video section (Screenshot attached) inline with instagram feed section.
Currently it is in full width of the website.
regards
Topic summary
A user seeks to resize a full-width video section on their Shopify homepage to match the width of their Instagram feed section below it.
Proposed Solutions:
Three different CSS-based approaches were offered:
- Option 1: Add a ‘container’ class to the video section file to constrain its width
- Option 2: Apply custom CSS targeting
.tp-videowithwidth: 68%,max-width: 100%, andmargin: 0 autoproperties, added to the bundle-swiper.css.liquid file - Option 3: Insert CSS code in the theme.liquid file before the
</body>tag
All solutions require accessing Online Store > Themes > Actions > Edit Code in Shopify Admin. The responses include screenshots demonstrating the implementation steps, though the specific CSS targeting and file locations vary between suggestions.
- In your Shopify Admin go to online store > themes > actions > edit code
- Find sections > find video-section file and add ‘container’ class
.tp-video deferred-media.video-section__media.deferred-media.no-js-hidden.gradient.global-media-settings {
width: 68%;
max-width: 100%;
margin: 0 auto;
}
Add this css at the bottom of Online Store->Theme->Edit code->Assets->swiper-bundle.scss.liquid
Hi @nveda
You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag
Hope this answer helps.
Best regards,
Victor | PageFly
Hello @nveda
It’s GemPages support team and glad to support you today.
You can follow these steps:
- Go to Online Store → Theme → Edit code
- Open your theme.liquid theme file
- Paste below code before :
Let us know how it works for you.
Best regards,
GemPages Support Team