Hi unfortunately I'm ending up with different video ratios. Some of them are «real» 9:16 and some of them are slightly taller. With the added CSS code from Judith now all the «real» 9:16 are cropped on the sides. https://gotomo.myhostpoint.ch/
Is there a way to make the ratio adaptive? so the video wrapper takes the dimesions of the video? Or is any one having another idea?
thanks that works nicely. But: As long as I do not put a shaddow on the item/box. In such a case the white boarder to the left and right apear. https://gotomo.myhostpoint.ch/
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
All works fine. But as you can imagine, placing several videos directly slows down the page dramaticly. Because one video is aprox 2MB I think I should prefere the vimeo embed version. see last row: https://gotomo.myhostpoint.ch/
BUT: I'm facing the same issue with the white boarder left and right. I tried to adapt your css code. Did not work. As well the video should be aoutoplay.
Do you have any trick to do so? Again sorry for re-opening...
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Hi There
I have several Videos with different Aspect Ratios to place.
But the Nectar Video Player allows only Aspect Ratio 9:16.
(See the Screencast to the right is cropped, because the video is higher)
Can I use custom aspect ratio via CSS?
Or is there a better way to solve this?
I have tried embedded code as well. But there was no autoplay or loop.
Thanks for your help.
Link to the site: https://gotomo.myhostpoint.ch/
Hello Oliver,
Please try this css:
Thanks.
Awesome! Thanks a lot!
Hi unfortunately I'm ending up with different video ratios.
Some of them are «real» 9:16 and some of them are slightly taller.
With the added CSS code from Judith now all the «real» 9:16 are cropped on the sides.
https://gotomo.myhostpoint.ch/
Is there a way to make the ratio adaptive? so the video wrapper takes the dimesions of the video?
Or is any one having another idea?
Hey Again,
Please remove the CSS provided by Judith and use this instead:
Thanks
ThemeNectar Support Team
thanks that works nicely.
But: As long as I do not put a shaddow on the item/box.
In such a case the white boarder to the left and right apear.
https://gotomo.myhostpoint.ch/
Could you remove all Custom CSS so we can take a look.
Thanks
ThemeNectar Support Team
ok, removed.
Could you provide the aspect ratio for each video and add an Extra Class to each column that has the video so i can write up custom CSS for it.
Thanks
ThemeNectar Support Team
done.These are the IDs and the ratios:
videoregular 9:16
videohoch 207:454
videoquer 16:9
videoquadrat 1:1
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Thanks
ThemeNectar Support Team
Perfect! Thank you very much!
I'm really sorry, to open it again :-(
All works fine. But as you can imagine, placing several videos directly slows down the page dramaticly. Because one video is aprox 2MB
I think I should prefere the vimeo embed version.
see last row: https://gotomo.myhostpoint.ch/
BUT: I'm facing the same issue with the white boarder left and right. I tried to adapt your css code. Did not work.
As well the video should be aoutoplay.
Do you have any trick to do so?
Again sorry for re-opening...
Hey Again,
Sure, no issues.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Thanks
ThemeNectar Support Team
Perfect! I adopted it for the other dimension/ratio as well. Works fine.
Only Issue: they do neither loop nor autoplay....
can I fix this?
I am afraid, the autoplay feature is not available when using the embed method.
Thanks
ThemeNectar Support Team
even using the embed code in a iframe woulkd not work?
You can try using an Iframe as with that i believe you can set the autopay attributes.
Thanks
ThemeNectar Support Team
Ok , thanks anyway for you great support.