Video Format 9:16 is Displayed 16:9 In The Player
Christian
Hello team, i have a video (mp4, local file, NO Vimeo or YouTube) in 9:16 format. I would like to display it in the same format. But the video module always forces the 9:16 video into a 16:9 format. This is not social media compliant these days.
Unfortunately, the code snippet from another forum request (https://www.joomshaper.com/forum/question/11933) doesn't work when I add it to the custom CSS of the page.
Code snippet not working: "#sppb-addon-1645097871383 .sppb-video-block.sppb-embed-responsive.sppb-embed-responsive-16by9 { height: 966px; width: 641px; }"
Note: The "" are not included in the code.
How can I display my video correctly in 9:16 format using CSS code? Or is there another way than CSS? Is the video player in PageBuilder up to date?
Greetings, Chris
Version PB: 5.3.2
Ofi Khan
Accepted AnswerHello Christian
Apology for the inconvenience. Please share your administrator access and the page with video addon here to check the issue. Use the Hidden Content box to share the credentials. Make sure that you have a full site backup with you before sharing.
Best regards
Christian
Accepted AnswerHello Ofi,
unfortunately, my boss has forbidden me to grant admin access. But the problem can be easily reproduced with a short portrait video (9:16). Insert a video on a page, and you will see that PageBuilder's player displays it in a 16:9 format. However, it should be displayed in 9:16 format as it is.
Best regards Christian
Ofi Khan
Accepted AnswerPlease use this CSS to addon style settings. Then you will able to remove the black background from the left and right side of the video.
.sppb-addon-video-local-source{
width: auto;
}Christian
Accepted AnswerHello Ofi,
your solution wasn't quite what I was looking for, but it was better than what I had. Thanks to your CSS file, I now knew what to look for (.sppb-addon-video-local-source).
Then I found the code in the forum (https://www.joomshaper.com/forum/question/38?order=newest)
.sppb-addon-video-local-source { position: relative; }
.sppb-addon-video .sppb-addon-video-local-video-wrap { padding-top: 0%; position: relative; line-height: 0px; }
This works perfectly and is exactly what I was looking for. Now the video is displayed correctly in 9:16.
Many thanks for your help Christian
Ofi Khan
Accepted AnswerYes, this is a better solution than mine. Please accept the answer that helped you. It will be then easier to find the solution for the other users with the same issue. There is a button to accept answer after each comment.
I have a humble request too. It would be very kind of you if you can manage some moment to give us feedback on
This will inspire us to improve.