@KetanKumar store url; mysticmoods.co.uk. I have not added the section as the writing is not where it should be (centered). Also’ would you happen to know how to get rid of the padding - move the video at the very left ’ with no padding. Thanks
Topic summary
Users are seeking to create a “Video with Text” section in Shopify’s Dawn theme, similar to the existing “Image with Text” section, with autoplay and loop functionality.
Primary Solution:
- User vincentdh hired a coder and shared complete code for creating
video-with-text.liquidandcomponent-video-with-text.cssfiles - This involves duplicating the “Image with Text” section structure and replacing image elements with video elements
Common Issues & Fixes:
Mobile Display Problems:
- Videos not appearing on mobile devices
- Fix: Add CSS code to
base.cssmaking video position relative on screens under 749px
Video Freezing:
- Videos stop when selecting product variants
- Solution: Remove specific code from
media-gallery.js(line 84) that pauses all media - Alternative: Add play/pause buttons for manual control
Additional Improvements:
- User Spac-es provided enhanced code with play/pause buttons, better mobile animations, and additional customization options (alignment, captions, color schemes)
- Audio controls can be enabled by adding
controls="true"to the video tag
Ongoing Requests:
- Removing padding/white space around videos
- Adding colored backgrounds to text sections
- Making videos full-width
- Creating video columns without text
The discussion remains active with users requesting help for specific customization needs and styling adjustments.
1 Like