I'm writing regarding two issue I'm having with the
portfolio.
1. When the portfolio is showcasing all the thumbnails, these
thumbnails are a little trimmed on the sides. So it doesn't respect the
original 16:9 aspect ratio. How can i fix this?
2.Once you open a portfolio item, if this is a vimeo video,
the video has two thin black bars above and below which doesn't belong to the
video. What can I do to fix this?
I have attached an image with screenshots of both issues to
be more clear.
1. Portfolio trim the photos because you have the possibility to add different images size, and the thumbnail width and height will remain the same and the image is cover background centered.
2. We set for the video a padding value for the height to keep the usual video aspect ratio. You can modify it by adding this in Theme Options > Styling Options > Custom CSS:
Thanks for your quick response. You're very helpful and
awesome!
Regarding issue nº 1. I see your point and that's a clever
thing for the portfolio to do. However, since I intend to only post videos on
my portfolio, the thumbnail images are always gonna have exactly the same
aspect ratio 16:9 (being all the images 1920x1080 resolution, which is the same
as my full hd videos). So, I figure if I change the default way the portfolio
displays the thumbnails (which must be an aspect ratio of 3:2 or similar) for a
new aspect ratio of 16:9, the portfolio wouln't have to trim my thumbnail images
anymore (since both would have the exact same aspect ratio and they would fit
perfectly). I think this makes sense, doesn't it?. So, if you see what I mean
and it's possible, I would love if let me know where or how to change this.
Regarding issue nº2. I tried your tip, and changed the
values from .video-container
{ padding-bottom: 56%!important;} to .video-container { padding-bottom: 55%!important;}
and it worked great on my pc+firefox (not blackbars above
and below the video anymore). Cool! However, today, I was able to test it on a
different computer and browser (a mac and Chrome) and it displays now the black
bars on the sides of the videos. I have attached an image to show you
this.
Hi,
I'm writing regarding two issue I'm having with the portfolio.
1. When the portfolio is showcasing all the thumbnails, these thumbnails are a little trimmed on the sides. So it doesn't respect the original 16:9 aspect ratio. How can i fix this?
2.Once you open a portfolio item, if this is a vimeo video, the video has two thin black bars above and below which doesn't belong to the video. What can I do to fix this?
I have attached an image with screenshots of both issues to be more clear.
Thanks for your much appreciated help!
1. Portfolio trim the photos because you have the possibility to add different images size, and the thumbnail width and height will remain the same and the image is cover background centered.
2. We set for the video a padding value for the height to keep the usual video aspect ratio. You can modify it by adding this in Theme Options > Styling Options > Custom CSS:
.video-container { padding-bottom: 56%!important;}
You need to modify the padding value to fit exactly for your video.
Regards
Thank you.
Clapat Support
https://www.clapat.com/
Review Envato Item Support Policy
Hi again!
Thanks for your quick response. You're very helpful and awesome!
Regarding issue nº 1. I see your point and that's a clever thing for the portfolio to do. However, since I intend to only post videos on my portfolio, the thumbnail images are always gonna have exactly the same aspect ratio 16:9 (being all the images 1920x1080 resolution, which is the same as my full hd videos). So, I figure if I change the default way the portfolio displays the thumbnails (which must be an aspect ratio of 3:2 or similar) for a new aspect ratio of 16:9, the portfolio wouln't have to trim my thumbnail images anymore (since both would have the exact same aspect ratio and they would fit perfectly). I think this makes sense, doesn't it?. So, if you see what I mean and it's possible, I would love if let me know where or how to change this.
Regarding issue nº2. I tried your tip, and changed the values from .video-container { padding-bottom: 56%!important;} to .video-container { padding-bottom: 55%!important;}
and it worked great on my pc+firefox (not blackbars above and below the video anymore). Cool! However, today, I was able to test it on a different computer and browser (a mac and Chrome) and it displays now the black bars on the sides of the videos. I have attached an image to show you this.
Thanks again for your great support.
The percentage can be fine tuned: Try:
video-container { padding-bottom: 55.1%!important;}
Fot the portfolio thumbnails also change the bottom padding:
.portfolio-item .portfolio-image {
padding-bottom: 54%;
}
Thank you.
Clapat Support
https://www.clapat.com/
Review Envato Item Support Policy
Great! It worked perfectly!
Thanks for your help.