How to make the video on home page smaller? It’s too long as far as height I want it shorter. Dawn theme
website :https://lextensionsllc.myshopify.com
Topic summary
A user seeks to reduce the height of a video displayed on their homepage using the Dawn theme, finding it currently too tall.
Proposed Solutions:
-
CSS approach (GemPages): Add custom CSS to the base.css file setting
max-height: 800pxfor the.shopify-section videoselector to constrain video dimensions. -
Video format recommendation (PageFly-Victor): The current 9:16 (vertical) video format causes cropping issues when height is reduced. Suggests converting the video to 16:9 (horizontal) aspect ratio for proper display at smaller heights, with a video conversion tool provided.
Status: The discussion remains open with two different technical approaches offered—one focusing on CSS constraints and another addressing the root cause through video reformatting. No confirmation yet on which solution the user implemented or whether either resolved the issue.
Hello @Lextensions88
Could you please share your store password then I can see and suggest something for you?
Best regards,
GemPages Support Team
@GemPages Mykari
You can follow these steps:
- Go to Online Store → Theme → Edit code
- Open your base.css file and paste the following code below:
.shopify-section video {
max-height: 800px;
}
If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team
Hi [email removed]Lextensions88,
This is Victor from PageFly - Landing Page Builder App
Because your video is formatted 9:16 so when you resize the height or min-height for it the video will crop and not be good. you can try to change the video format to 19:6 to show it correctly. You can try to use my video convert
https://cdn.shopify.com/videos/c/o/v/aa885b5e8a97406b95e50090cf1e2993.mp4
Hope my solution works perfectly for you!
Best regards,
Victor | PageFly