changing video size on desktop view

[getsunlight]

Hi, I have been trying to configure the script to make the desktop view for a vertical loop video smaller for desktop, but i couldn't find it. I'm using Dawn theme with custom video autoplay liquid from (https://websensepro.com/blog/how-to-add-autoplay-video-section-in-shopify-without-app-dawn-v15/).

The website loads ok on mobile, just too big on desktop. Other codes shared here didn't work.

Any help welcome!

Site: www.getsunlight.sg

[Sweans · Accepted solution]

Hi @getsunlight ,

To address the issue with the vertical loop video size on the desktop view, you can add custom CSS to adjust the video dimensions. Here's how to do it in the Dawn theme:

1. Go to Online Store > Themes.
2. Click on Actions next to your current theme and select Edit code.
3. In the code editor, locate the theme.liquid file. This is typically found under the Layout folder.
4. Scroll to the bottom of the theme.liquid file, and just above the closing </body> tag, add the following custom CSS code:

<style>
@media only screen and (min-width: 768px) {
.wbs-pck__image__wrapper {
height: 100vh; /* or your preferred height*/
}
}
</style>

5. Click Save to apply the changes.

This approach allows you to customize the size of your video on desktop devices, ensuring it doesn't appear too large.

If you need further assistance, feel free to reach out!
I hope this helps! If it does, please like it and mark it as a solution!

Regards,
Sweans

[BSS-TekLabs]

- Here is the solution for you @getsunlight 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.wbs-pck__image__wrapper {
    height: 100vh !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[getsunlight]

Hi, thank you!

is there a way to retain the height so that the ceiling light is in full display, but to scale it down in general? It would be ok with borders at the side.