Hi,
I have several portfolio pages and horizontal images look great, but vertical images don't because when they appear they are resized to fill the page which makes them bigger than the original file. I don't want to upload bigger files - I'd rather have the vertical images appear smaller. Is there a way to set a maximum size for them so they don't appear so big.
Thanks!
-Rob
Comments
Image size is set in three files. Firstly in php file by crop function. Second dependancy css file and third js file.
Please send me a screenshot how would you like to set it on your page and i will try to apply it in this files to create your skyfashion customization.
Kind regards
Please insert this photo on page and then please send me a link. I will try to resolve it on your wordpress.
Kind regards
As you can see it's much wider (and taller) than the screenshot I sent.
Thanks again for looking into this!
-Rob
Line
#107 add_image_size('apollo-portfolio-thumb', 500, 9999);
Then, I uncommented the following lines and use 'apollo-portfolio-thumb' instead of 'apollo-big-thumb'.
Line
#2231 $slide['src'] = $this->prepare_path($slide['src']);
#2232 $src = TPL_ADV . '/inc/timthumb.php?src=' . $slide['src'] . '&w=' . $wig
#2233 $attachment_id = $this->get_attachment_id_from_src($slide['src']);
#2234 $src = wp_get_attachment_image_src($attachment_id, 'apollo-portfolio-thumb')
#2235 $src = $src[0];
Next, I set img src to $src instead of $slide['src']
Line
#2236 echo '<div class="vert-item"><a class="alpha-scope alpha-scope-image no-bord er" href="' . $slide['src'] . '" rel="group"><img src="' . $src . '" ' . $slide['attrs'] . ' ' . $img_style . ' /></a></div>';
Then to center the image and make it responsive to mobile screen I use the following CSS.
<style type="text/css" media="screen">
.vert-item {width: 500px; margin: 0 auto;}
@media only screen and (min-width: 0px) and (max-width: 509px) {
.vert-item {width: 310px;}
}
</style>
Finally, I used the Simple Image Sizes plugin to generate the new image size for all my existing images. And new image upload will be automatically generated.
http://wordpress.org/plugins/simple-image-sizes/
Attached is my apolo13.php file for reference. Warning!! I made other site specific changes. So, don't just replace your file with mine.
You can see it in action here: http://colourmequinn.com/portfolio/nikki/
Thanks again!
-Rob