So I was posted some new things to my website and was changing the video at the top. The desktop on is fine. However, the mobile one is squished and terrible to look at. 
I used the Video Banner option. Not sure if I need to use something different or what I should so. If someone has a minute to help me it would be greatly appreciated. 
website: www.thedustybroomcloset.com
Hey @b3thanyj3an
The squished video on mobile is a common issue with the Video Banner section. It usually happens because the video was recorded or exported in a wide landscape ratio (like 16:9) and on mobile that gets compressed into a narrow space.
A couple of fixes:
In the theme editor, go to your Video Banner section and look for a setting called “Video height” or “Adapt section height to video.” Some themes let you set different heights for desktop vs mobile. Try switching it to “Adapt to video” if it’s set to a fixed height.
The better fix: use a different video for mobile. Record or crop a version of your video in a vertical or square format (9:16 or 1:1) and set it as the mobile video. Most themes with a Video Banner let you upload separate videos for desktop and mobile. If yours doesn’t, you can use the “Image with text” or “Custom liquid” section as an alternative that gives you more control.
If none of that works, try replacing the Video Banner with a “Slideshow” or “Image banner” section using a still frame from your video. Sometimes a strong static image works better on mobile than a compressed video.
One more thing I noticed while checking your store: you have several spam reviews from a “carolina peter”. I’d delete those ASAP since they hurt your credibility. You can manage them in your Judge.me dashboard.
Hope that helps, love the brand btw!
I’ll give Them a shot! And thank you I didn’t even notice I had the reviews they don’t show up on the apps side. I wonder why? I’ll take a look at it and get rid of them though. Thank you for getting back to me as fast as you did! I’m very grateful 
Consider this solution – How to upload video on website banner for mobile and dekstop - #5 by tim_1
What’s $section ?
Here $section is a special placeholder token used within the theme customizer. It acts as a shortcut that automatically targets the unique ID of the specific section you are currently editing.
When Shopify processes your code, it replaces $section with the actual wrapper ID generated for that block. Using this will only apply to that single video section.
Ok I made both videos just how you told me to. Uploads them to the files section. This is were I got stuck. You said go to online store > theme > customize. Ever since my Shopify updated I don’t have that anymore. So I have online store and then it says edit theme. *see picture* is this where you want me to click? Then when I’m into customize my website I go to the template side where it says video banner if I click it, I don’t have the option for a mobile video. I only have the option to put in the desktop. So is this the area where you want me to customize the CSS?
I’m sorry for so many questions. 
I appreciate any help. You’re willing to give me though. Don’t mind the federal quality. I’m working on the desktop and I took a picture from my phone. lol 
OK, I’m working on trying to fix this. I made two separate videos so that I can use one for desktop and one for mobile. I don’t have the option when I’m editing the video banner for a mobile one. One’s only giving me the option for the desktop.
don’t mind the photo quality I’m working on the desktop and I just took them using my phone lol. I also took care of those reviews that you mentioned. Thank you! Never would have seen them if you didn’t say anything.
Yes, what’s now “Edit theme” was called “Customize” earlier.
Just follow my solution I’ve linked above, one section for desktop video, another – for mobile one, each section has “Custom CSS” setting at the bottom – paste codes there.
Resize your browser window on desktop to make site width less than 750 pixels theme will switch to mobile view.
“Edit theme” also has a mobile icon at the top to do similar.
Your theme will switch to mobile view, hide desktop video section and show the mobile one – you will be able to configure that section too as you see fit.
Monsterdev’s solution is similar to mine, but the code is broken.
the general website development best practices is to always build for mobile first
mobile is less space and so if you can make it look good there you can make it look good with more space on desktop
Hi @b3thanyj3an
Since your current Video Banner section only has one video upload field, that section probably does not support separate desktop and mobile videos by default.
The squished mobile view usually happens because a wide desktop video is being forced into a narrow mobile layout. The cleanest fix is to either use a section that supports separate mobile/desktop video files, or add a custom video banner section with separate responsive height controls.
If Sidekick is available in your Shopify admin, you can ask it to create a new Online Store 2.0 section for this. You can use a prompt like this:
Create a new theme section called "Video Banner" for my Online Store 2.0 theme.
Requirements:
- Create only this file: sections/video-banner.liquid
- Use a Shopify-hosted video picker setting
- Add a poster image fallback
- Add optional heading, subheading, and button settings
- Add separate desktop and mobile height controls
- Use object-fit: cover so the video fills the banner without being squished
- Add an overlay darkness setting
- Make it responsive using CSS only
- Include a section preset so I can add it from the theme editor
- Do not modify any other theme files
After Sidekick creates the section, go to:
Online Store > Themes > Customize
Then open the page where your banner appears, click Add section, and select the new video banner section.
If you are not comfortable with code, I would duplicate your theme first before saving any AI-generated section:
Online Store > Themes > … > Duplicate
That way, you can test the new section safely without affecting your live store.