A Shopify store owner reports that product videos (except the first one) display too small when clicked on mobile devices. They want all product videos to match the size of the first video and product images.
Proposed Solutions:
Two support representatives offered CSS code modifications:
</body> tag in the theme.liquid filebase.css with specific padding adjustments (170% padding-top)Key Issue:
The store owner clarified they want to resize videos only while keeping image sizes unchanged. PageFly-Victor explained this limitation stems from the theme’s product media design and cannot be easily modified with CSS alone.
Outcome:
The discussion remains unresolved. PageFly-Victor ultimately recommended using a page builder app (like PageFly) for more flexible design control, suggesting the store owner explore options in the Shopify App Store based on their needs and budget.
The size of the product videos besides the first one are too small when clicked on (See video attached bellow). I would like the product videos to all be the same size when clicked on (See images below). Help from a professional or any solutions would be very much appreciated.
Here is the link to my store: https://wizzful.com/products/kommilife-portable-cat-dog-water-bottle-food-feeder-drinker-poop-dispen…
Hello @aarxn8 ,
To can increase the size Product video on mobile, you can checkout my suggestion below to make it:
Eg:
It show like this when you add my code:
I hope you find the answer helpful.
Kind & Best regards,
GemPages Support Team.
Hi @aarxn8
This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Add this CSS at the bottom
Online Store ->Theme ->Edit code
Assets ->base.css
.product__media.media.media--transparent.gradient.global-media-settings {
padding-top: 170% !important;
}
Hope you find my answer helpful!
Best regards,
Victor | PageFly
Is it possible to just change the size of the videos but leave the other pics as the size they are. Check out the video attached by clicking on the link below. Thanks for your help
Is it possible to just change the size of the videos but leave the other pics as the size they are. Check out the video attached by clicking on the link below. Thanks for your assistance.
This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
it’s the design of your product media, so we can’t help more
When you access the page with admin rights, this tab will appear to help you manipulate, you just need to click on the action and turn it off.
Hope you find my answer helpful!
Best regards,
Victor | PageFly
I’m not sure what you’re talking about admin rights and turning something off. And just to clarify there is no way to get all of my product media the same size?
This is Victor from PageFly - Shopify Page Builder App
This belongs to the design of the product media of the theme you are using, I recommend you use a page builder app to make it easier to design your page
Hope you find my answer helpful!
Best regards,
Victor | PageFly
Could you recommend a page builder app please
Hi @aarxn8 ,
There are a lot of options for you to choose from Shopify App Store, but which one is best will depend on your demand and budget.
You can give it a try and pick one for your store!
Best regards,
Victor from PageFly - Shopify Page Builder App