How can I adjust video size on my product page?

Store Design

Topic summary

A user encountered an issue where product page videos play in a minimized player instead of full-screen. They included screenshots showing the problem on both desktop and mobile using the Streamline theme.

Solution provided:

  • Navigate to Online Store → Themes → Actions → Edit code
  • Open the base.css or theme.scss.liquid file in the Assets folder
  • Add the following CSS at the bottom:
.product-video {
  width: 100%;
  max-width: 100%;
  height: auto;
}
  • Save and preview changes

The original poster confirmed the solution worked and thanked the responder. The issue appears resolved.

Summarized with AI on November 18. AI used: claude-sonnet-4-5-20250929.
1

Hi i got a problem i uploaded a video on my product page image with some photo but when i play the video the video player is minimized and i wanted to know if there is a way to take the whole screen as u can see in the image i attached, for both destkop and mobile :
I use streamline theme

Help.PNG
Help.PNG1930×930 102 KB

Screenshot_20230724_013014_Chrome.jpg
Screenshot_20230724_013014_Chrome.jpg1080×1972 84.8 KB

2

Hello @Hasbullah ,

You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code

Go to Assets folder → base.css file or theme.scss.liquid file

Add this following code at the bottom of page

.product-video {
  width: 100%;
  max-width: 100%;
  height: auto;
}

Save and preview

Hope this can help. Let us know if you need any further support.

Transcy

3

Thanks for ur help have a good day

1 Like