-
Posts
-
Hi,
I’m working on an ajax portfolio page with Enfold and I’m having trouble determining the best image size to upload for the portfolio “featured image” — Or the image that shows up in the grid. I’m thinking it will just be a two column portfolio page, however, if I decide to use three columns a suggested image size would be useful as well.
Also. I will most likely display a slideshow of each portfolio item when you click on the ajax grid, so I would also like to know what size image should be used there (assuming it is a different size than the featured/grid image).
I really appreciate all the great support here for this awesome theme. I just seemed to get stuck when I was trying to size images for the portfolio and every time I uploaded photos the page would look really distorted and disorganized.
Thanks again!
-Chris
Hi Chris,
There isn’t really a “best size” since the theme will create re-sized thumbnail images for the various grids and columns. Starting with something like 900×600 will give you a large enough size that it will never get stretched to fit a too-large area as long as its in a column.
The demo for the ajax portfolio uses images that start at 988×642. See: http://kriesi.at/themes/enfold/files/2013/04/dash-iphone2.jpg . Which generates http://kriesi.at/themes/enfold/files/2013/04/dash-iphone2-495×400.jpg for the three column view http://kriesi.at/themes/enfold/portfolio/portfolio-ajax/ .
So starting with a large enough image size to fit the smaller uses will give you the best result but how big to start with is up to you and what you have available.
For additional reference on all the image sizes the theme creates you can view the functions.php file starting at line 63.
Regards,
Devin
Awesome thanks. This helps a ton!
One other question about the sizes (it might have the same answer).
What about the sized for the AJAX slides how or gallery. I’m not too worried about the sizes on the actual portfolio page since there is plenty of room. But since the AJAX portfolio opens a window within the page to show a sideshow/gallery images that are too large seem to really distort the AJAX display. I don’t think the theme resizes those images, so is there a best practice for image sizes there?
Thanks!
-Chris
One more thought.
Is the image that gets reduced for the portfolio images the one that is attached as the featured image for the portfolio item?
Hi,
You can see all image thumbnail size on functions.php
/*
* Register additional image thumbnail sizes
* Those thumbnails are generated on image upload!
*
* If the size of an array was changed after an image was uploaded you either need to re-upload the image
* or use the thumbnail regeneration plugin: http://wordpress.org/extend/plugins/regenerate-thumbnails/
*/
$avia_config['imgSize']['widget'] = array('width'=>36, 'height'=>36); // small preview pics eg sidebar news
$avia_config['imgSize']['square'] = array('width'=>180, 'height'=>180); // small image for blogs
$avia_config['imgSize']['featured'] = array('width'=>1500, 'height'=>430 ); // images for fullsize pages and fullsize slider
$avia_config['imgSize']['extra_large'] = array('width'=>1500, 'height'=>1500 , 'crop' => false); // images for fullscrren slider
$avia_config['imgSize']['portfolio'] = array('width'=>495, 'height'=>400 ); // images for portfolio entries (2,3 column)
$avia_config['imgSize']['portfolio_small'] = array('width'=>260, 'height'=>185 ); // images for portfolio 4 columns
$avia_config['imgSize']['gallery'] = array('width'=>710, 'height'=>575 ); // images for portfolio entries (2,3 column)
$avia_config['imgSize']['entry_with_sidebar'] = array('width'=>710, 'height'=>270); // big images for blog and page entries
$avia_config['imgSize']['entry_without_sidebar']= array('width'=>1030, 'height'=>360 ); // images for fullsize pages and fullsize slider
//overwrite blog and fullwidth image on extra large layouts
if(avia_get_option('responsive_layout') == "responsive responsive_large")
{
$avia_config['imgSize']['gallery'] = array('width'=>845, 'height'=>684 ); // images for portfolio entries (2,3 column)
$avia_config['imgSize']['entry_with_sidebar'] = array('width'=>845, 'height'=>321); // big images for blog and page entries
$avia_config['imgSize']['entry_without_sidebar']= array('width'=>1210, 'height'=>423 ); // images for fullsize pages and fullsize slider
}The one use for the portfolio featured image is this:
$avia_config['imgSize']['entry_with_sidebar'] = array('width'=>710, 'height'=>270); // big images for blog and page entries
$avia_config['imgSize']['entry_without_sidebar']= array('width'=>1030, 'height'=>360 ); // images for fullsize pages and fullsize sliderRegards,
Ismael
Ok. So does it really even matter what size image I upload? It sounds like the theme will rescale it anyway.
I only ask because I uploaded some large images to the AJAX portfolio (screenshots mostly) and they looked pretty bad when you clicked on the portfolio item and the image expanded.
Thanks again!
You can use a different image entirely by uploading it to the options for the ajax portfolio display.
For example, this first item when viewed in the ajax view is the phone image but on the single page is different.
The image size should be at least 684 pixels wide.
- The topic ‘Image Sizes for Portfolio Previews’ is closed to new replies.