Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #766593

    Hey,

    http://www.santamonicahotelbooking.com/
    I want to be able to specify a specific width and height for the all the images in a Masonry element

    Like this where the the images have 453 x 453 px
    Masonry

    How can I do that?
    Thanks
    Charlotte

    #766608

    Hey Charlotte,

    Wordpress is resizing by default when uploading images and if you want to have more control over image size you can use this plugin: https://wordpress.org/plugins/simple-image-sizes/.

    Best regards,
    Jordan Shannon

    #766619

    Hey Jordan,

    So there is no specific code I can add for that Masonry element that shows the images in the size I want?
    That would be a lot more convenient!

    Charlotte

    #766623

    Hi,

    You can make adjustments by searching the following in functions.php

    $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']['featured_large'] 		= array('width'=>1500, 'height'=>630 );						// 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'=>845, 'height'=>684 );						// images for portfolio entries (2,3 column)
    $avia_config['imgSize']['magazine'] 		 	= array('width'=>710, 'height'=>375 );						// images for magazines
    $avia_config['imgSize']['masonry'] 		 		= array('width'=>705, 'height'=>705 , 'crop' => false);		// images for fullscreen masonry
    $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
    $avia_config['imgSize'] = apply_filters('avf_modify_thumb_size', $avia_config['imgSize']);

    You can make needed adjustments here and remove cropping where you need to.

    Best regards,
    Jordan Shannon

    #766625

    Ok, thanks. But which line shall I make the change?

    #766776

    Hi,

    Would you be able to provide admin info? I would like to login and see how you have the page set-up in the ALB. That way I can tell you the exact line you need to change.

    Best regards,
    Jordan Shannon

    #766877

    Hi Jordan,

    I have added the login now.

    Thanks
    Charlotte

    #767518

    Hi,

    So you need to have all the images the exact same size?

    Best regards,
    Jordan Shannon

    #767521

    Yes, so can they be crop to one size?

    #767543

    Hi,

    I will try and get it done via css. Do you need it 453 x 453? That would mean the number of columns would have to adjust as well.

    Best regards,
    Jordan Shannon

    #767546

    Yes, thanks. That is good size.

    #769108

    Hi,

    Apologies for the late reply, but the largest I was able to get it while still keeping 2 columns was about 350px, otherwise you will have just 1 column with a single large image.

    Best regards,
    Jordan Shannon

    #769353

    Ok, thanks Jordan.

    Cheers
    Charlotte

    #769521

    No problem at all. If you need additional help, please let us know here on the forums.

    Best regards,
    Jordan Shannon

Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Specify a specific image size in Masonry’ is closed to new replies.