Foliovision › Forums › FV Player › How to … › Change video player aspect ratio
-
-
I would like to add more information:
I am adding FV player to my posts simply by entering my YouTube videos URL in my post body instead of using a shortcode, along with the “Handle WordPress audio/video” feature enabled. This allows me to fallback on YouTube if FV Player was ever disabled. This method seems to always default to 16:9 without a way to override this.
Although not my preferred method, I realize I can also create a shortcode for each video I need to upload and manually adjust to a 4:3 size. Although it seems even this method defaults to 16:9 if I do not override the size for each and every video.
Is there a way to default videos to their native aspect ratio or force an override to 4:3?
One other issue related to this topic is that even when manually adjusting a video’s shortcode to a 4:3 aspect ratio, in full screen on all devices the video gets stretched to the device screen size. This means watching a 16:9 video on an ultrawide monitor in full screen will crop the top and bottom of the video. Watching a 4:3 video on an ultrawide monitor crops so much that it makes it unwatchable. The same happens on tablets and mobile phones.
Is there a way to keep the video aspect ratio, or specify an aspect ratio for full screen video? Thanks!
Hello Jordan,
I have tested your issues and can agree that I have ran into some of these issues.
The video size defaults to the set default size in FV Player settings and not to the native size of the video. Perhaps we could fix this.
You can change the default video size, which can be changed in Settings -> FV Player Pro -> Sitewide FV Player Defaults -> Default video size
This setting also overrides the ratio of the videos embedded by handling WordPress audio/video. However, it means that all your videos would play in 4:3, so you would have to manually set the size in shortcode for 16:9 videos, if you have any.
As for the stretched video in fullscreen mode bug, I will make sure to forward this to the development team and see what we can do about it.
Thanks,
MariaThank you Maria! I must have missed the default video size option! This is now working perfectly. My only outstanding issue is full screen getting cropped. Once this is fixed, my website is just about complete. I look forward to what your development team has to say.
Another small issue I am facing is I would like to set the default ‘End of video’ action to show the splash screen for all videos. I can set this in the shortcode editor for each and every video, however there doesn’t seem to be an option to make ‘Show splash screen’ the default End of video action for all videos. This option seems to be missing from Settings > Actions > End of video section, and only appears in the shortcode editor under Actions > End of video.
Hello Jordan,
we will keep you updated on the fullscreen stretching issue.
Regarding the default splash image at the end of the video: sadly, as of now, you can set splash screen as an end of the video action only for individual videos by setting it manually in shortcode. That being said, making the option to set the default splash screen as a default end of video action, is definitely something to consider implementing. Thanks for the idea.
Thanks,
MariaHello Jordan,
regarding the fullscreen issue on 4:3 YouTube videos when using the logo setting – I found that using these CSS rules when in fullscreen fixes the issues:
max-width: calc( 100vh /3 *4 ); margin: 0 auto;
However since each video can have different aspect ratio we need to actually put this in using JavaScript. So we will work on that.
Thanks,
MartinThanks for the update Martin. All of my videos are 4:3 so this is fine. I tried adding this custom CSS to the ‘Additional CSS’ section of my WordPress site but it is not working. Can you help me out? This is what I have tried:
.flowplayer.is-fullscreen {
max-width: calc( 100vh /3 *4 );
margin: 0 auto;
}Just a note, this is not only happening to 4:3 videos but is happening to all videos. They are stretching to fit the width of the screen no matter what. So a 16:9 video gets cropped on a ultrawide 21:9 screen for example.
I imagine there will be an update to the FV Player plugin to address this in the future. If this is correct, do you have an approx. ETA?
Thanks for all your assistance since purchasing the Pro version. It has really been top notch and worth every penny.
Hello Jordan,
it should target the video engine element:
.flowplayer.is-fullscreen .fp-engine{ max-width: calc( 100vh /3 *4 ); margin: 0 auto; }
But that’s just an experiment. It needs to be properly checked and improved to handle the 16:9 video on 21:9 screen too. I should have more news regarding that this week.
Thanks,
Martin