Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #19430

    Hi,

    The greyscale images on my portfolio imagebox are all showing slightly smaller than the color images, and you can see the larger color images underneath them at the bottom. Please help me correct this.

    Thanks,

    #103656

    Hi,

    Can you give us a link to your website?

    Try adding this on your custom.css

    #top #main .greyscale-image {
    width: 100%!important;
    height: 100%!important;
    }

    Regards,

    Ismael

    #103657

    http://yuri-suzuki.com/wp/

    I am new to this – where in the .css file should I copy the codes above?

    Thanks,

    #103658

    Hey!

    Please add it to the very bottom of css/custom.css

    Regards,

    Peter

    #103659

    Thanks for your reply. I added the code to the custom.css, but it still doesn’t solve the issue. Was i suppose to change a setting to load this custom.css?

    The link to the portfolio is as follow.

    http://yuri-suzuki.com/wp/?page_id=22

    Please help!

    #103660

    Hi,

    I think the problem is that you changed image sizes but did not regenerate the thumbnails. If you want to keep the cool effect just add this

    #top #main .greyscale-image {
    width: 245px !important;
    height: 200px !important;
    }

    But you really need to either install http://wordpress.org/extend/plugins/simple-image-sizes/ plugin, and ‘regenerate these specific images. Or just delete the image in Media and upload it again. That should fix the issues.

    Thanks,

    Nick

    #103661

    Hi,

    The above code solved the issue of the small greyscale thumbnail image size. However, the color thumbnails that shows up when pointer hovers over does not match the greyscale image on top (The overall size is now the same, but the color version appears to be rescaled instead of the greyscale one that is cropped). Is there a way to add a code to tell the color thumbnails to crop instead of rescale?

    I also installed the simple-image-sizes plug-in. I believe that I have to set up a new image size to validate here. Could you let me know what “thumbnail-name” I should be using here to specify the crop dimension of the portfolio thumbnails to 245px x 200px?

    Thanks,

    #103662

    Hi,

    for you to have 245x200px images you will either need to (a) only upload your images in the *same aspect ration* but larger (490 x 400 for example ) (b) upload your images any larger size but *crop your images down* to 245×200 automatically.

    If you want them that size, please open functions.php file and look for lines 27-37. As you can see a large number of images get controlled here including the portfolio ones. I would change portfolio_1, portfolio_2, portfolio_3 and portfolio lines in that block

    to look like this if you do not want to crop (a) option above

    $avia_config['imgSize']['portfolio'] = array('width'=>245, 'height'=>9999, 'crop'=>false);

    (b) if you want them cropped to exact size use this code instead (but do not use both)

    $avia_config['imgSize']['portfolio'] = array('width'=>245, 'height'=>200, 'crop'=>true);

    Once you -reupload the images with the option for greyscale turned on, you will get ‘correct size’ overlays. If you change the above without changing the images, you will not see results.

    Thanks,

    Nick

    #103663

    Hi Thanks for your help.

    I would like to pursue option (a) , resize the thumbnail images instead of cropping them. However, does this mean that all my portfolio single entries have be re-sized to match the aspect ratio of 245×200?

    In the Angular Demo Page, I see portfolio entries that are in different aspect ratio (some are 1:1) and the grey scale thumbnails of these entries are working perfectly. How did you achieve this?

    #103664

    Hi,

    Yes, though match the aspect ratio , not the size. You can change the aspect ratio to whatever you want, however all images in the protfolio should match it, otherwise there will be stretching, blurring or cropping.

    If you look here http://www.kriesi.at/themes/angular/template-files/portfolio-4-columns/ you will see for example the image of the kid with a frozen tongue, the thumbnail is cropped when you compare it to the original image. If you don’t mind cropping, then you can use any larger sized images then your settings

    http://wordpress.org/extend/plugins/simple-image-sizes/ <– please install this plugin. In your Settings > Media , the plugin will display all image sizes from within the theme to give you better control. Just please be aware when you change the sizes, the images already uploaded do not automatically resize. Instead you will either need to re-upload them, or use the regenerate button which is also a part of the plugin.

    Thanks,

    Nick

Viewing 10 posts - 1 through 10 (of 10 total)

The topic ‘Portfolio Greyscale Imagebox issue’ is closed to new replies.