[KiljanParticipant]

Hi!
X version 4.4.2
Wordpress Version 4.5.2
Stack: Integrity
Child theme: YES
SITE
–

I have embedded a non-16:9 video in my blogpost. However, depending on the different screen/window sizes I use the video displays black bars around the video.
However, in the wordpress visual post editor the ascpect ratio displays fine without black bars, so I guess it has something to do with how the responsive x theme changes.
Here are two screenshots:
in the visual editor:

In the site:

Is there anything I can do about that?

[KiljanParticipant]

i have also posted a topic on the vimeo help forum, so that you can see:
https://vimeo.com/forums/help/topic:282571

[JoaoModerator]

Hi Kiljan,

Would you have the URL of your website so we can have a closer look?

Thanks,

Joao

[KiljanParticipant]

I have already written the url in the first post. It says SITE

[Rue NelModerator]

Hello There,

Please your page and update the video embed code. You can make use of this code instead:

<div style="margin-left: auto; margin-right: auto; max-width: 600px;">
<iframe src="https://player.vimeo.com/video/166491845" width="600" height="1080" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe></div>

Hope this helps.

[KiljanParticipant]

It didnt work on mobile:

Here is the URL http://kiljano.se/2013/03/basta-svenska-offline-kartorna-for-ios-iphone/
(FYI: I posted it in the first comment)

[KiljanParticipant]

Hi, this is the code I used now and it kind of works:

<div style="margin-left: auto; margin-right: auto; max-width: 335px;">
<iframe src="https://player.vimeo.com/video/166491845" height="600" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe></div>

I had to play around with it and removed the width from the ifram, and its better, but not good and it is still resizing the video and showing the black bars.
I would just like the video to be responsive without showing the black bars.
I know I can embedd an instagram video and it will not show black bars, why is it not possible to maintain the video aspect ratios?

Thanks for you help and you time.

[KiljanParticipant]

I see that I have written that it kind of works, but I want it to work perfectly.
I dont want to see the black bars ever, is that possible?

[RadModerator]

Hi there,

You should wrap your embed code with this shortcode [x_video_embed][/x_video_embed]( http://theme.co/x/demo/integrity/1/shortcodes/responsive-video/ )

We know the iframe has a static size, and the only way to make it responsive is to force it through its container. If you wish to control its width, then apply it to the shortcode, (eg. [x_video_embed style=”width: 600px; margin: 0 auto;”] )

Hope this helps.

[KiljanParticipant]

The [x_video_embed][/x_video_embed] seem to only embedd videos with a 16:9 aspect ratio, since my video not that aspect ratio, it looks even worse. (in this case i a screen recording of a standing iphone screen)

This is the code I used:
[x_video_embed]<iframe src="https://player.vimeo.com/video/166491845" width="600" height="1080" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>[/x_video_embed]
This is how it looks:

[Rue NelModerator]

Hello There,

I have check your video on my phone. This is what I’ve got:

Does this mean that the issue has been resolved? Please let us know.

[KiljanParticipant]

No, that is because I´m using this code:

<div style="margin-left: auto; margin-right: auto; max-width: 335px;">
<iframe src="https://player.vimeo.com/video/166491845" height="600" frameborder="0" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe></div>

But that is an inconvenient solution, It means I have to refresh and check out on two, three screens until I find an exact height vs max-widht setting that works without settin the video width to small so that it will look wierd on desktop. I can live with it, but I would like to know if there is a solutions that will give me a standing video that also is responsive.

Here it is not mentioning standing video formats:
http://theme.co/x/demo/integrity/1/shortcodes/responsive-video/
It only features these aspect ratios:
type: “16:9,” “5:3,” “5:4,” “4:3,” or “3:2.”

If there isn´t a [x_video_embed][/x_video_embed] shortcode for standing format video, I think you should consider having it, since standing videos are most likely to be more and more common.

[Rue NelModerator]

Hello There,

We certainly appreciate the feedback! This is something we can add to our list of feature requests. This way it can be taken into consideration for future development. All of these items are discussed with our team internally and prioritized based on the amount of interest a particular feature might receive.

Thanks!

[KiljanParticipant]

So I was right in assuming that standing video does not work in the responsive video shortcode? I didnt get any real answer.
I wrote:

I can live with it, but I would like to know if there is a solutions that will give me a standing video that also is responsive.

[ChristianModerator]

Yes. X supports 16:9 landscape video only. 9:16 or portrait video is not supported. Removing the black bars and making it responsive would require custom development which regretfully falls outside the scope of our support.

Thank you for understanding.

[Author]

Posts