Portfolio Thumbnails and Images « Support Forum | Kriesi.at

Support Forum » Propulsion

Portfolio Thumbnails and Images

12 posts from 5 voices

Started 1 year ago by tabishiqbal
Latest reply from Dude
This topic is not resolved

Tags:

tabishiqbal
Member

Hello.

This seems like an ongoing support topic for you guys and I'm just adding to it. I have searched the forums and tried everything but no luck.

WordPress Version.: 3.3.1
Theme: Propulsion

Issues:

01: Thumbnail image is cropped where it does not show the full image inside the box. ( I did change the size 450x400 to fit the image but originally it would not fit in the box.
Ex.: http://avenirtechnologies.co/wordpress/?page_id=150

02: When viewing the post the image is at a very large scale.
Ex.: http://avenirtechnologies.co/wordpress/?portfolio=mcemax

Note: When I use the plugin to regenerate the thumbnails it states (WordPress 3.1+ only). This should not be a problem as I have WordPress 3.3.1.

Steps taken:

01 As suggested in other posts I changed the dimensions in functions.php and regenerated the thumbnails.
02 Tried multiple varations of changing height/width as well as true/false for cropping however no changes were made.

The following is the current code I have in functions.php:

$avia_config['imgSize']['widget'] = array('width'=>36, 'height'=>36 );
// small preview pics eg sidebar news

$avia_config['imgSize']['post-format-image'] = array('width'=>630, 'height'=>999, 'crop'=>false);
// big images for post format image and gallery posts

$avia_config['imgSize']['fullsize'] = array('width'=>930, 'height'=>300, 'crop'=>false);
// big images for lightbox and portfolio single entries

$avia_config['imgSize']['featured'] = array('width'=>400, 'height'=>200, 'crop'=>false);
// images for fullsize pages and fullsize slider

$avia_config['imgSize']['portfolio'] = array('width'=>450, 'height'=>400, 'crop'=>false);
// images for portfolio entries (2,3,4 column)

Thanks for all the help!

Posted 1 year ago #
tabishiqbal
Member

Bump!

Posted 1 year ago #
Kriesi
Key Master

Hey! Not sure what exactly you mean: the cropping behavior can and should control the portfolio items just fine. On your site I wasnt able to find a portfolio just woocommerce products.

The product behavior is set in the woocommerce backend of the plugin, you will find input fields to modify the image proportions there.

Posted 1 year ago #
tabishiqbal
Member

Hey Kriesi, Sorry I was trying to fix the issue but no luck. Right now I have put up a portfolio with an image and changed the code. Here it is as follows:

$avia_config['imgSize']['widget'] = array('width'=>36, 'height'=>36 ); // small preview pics eg sidebar news
$avia_config['imgSize']['post-format-image'] = array('width'=>630, 'height'=>999, 'crop'=>false); // big images for post format image and gallery posts
$avia_config['imgSize']['fullsize'] = array('width'=>930, 'height'=>300, 'crop'=>false); // big images for lightbox and portfolio single entries
$avia_config['imgSize']['featured'] = array('width'=>930, 'height'=>340); // images for fullsize pages and fullsize slider
$avia_config['imgSize']['portfolio'] = array('width'=>450, 'height'=>335, 'crop'=>false); // images for portfolio entries (2,3,4 column)

However it still shows the image on the portfolio page as a huge image.

Thanks for the help.

Posted 1 year ago #
Devin
Moderator

Hi tabishiqbal,

You'll also need to regenerate the thumbnails for the images you've already added. Try using: http://wordpress.org/extend/plugins/regenerate-thumbnails/

Regards,

Devin

Posted 1 year ago #
NewNormal
Member

I'm having a rough time with these thumbnails and haven't really found an answer in the forums yet.

I'm uploading thumbnails for my store page at 212 x 212px. I'll upload these to my product pages & select "use as featured image." (http://dev.analogcraftsman.com)

In config-woocommerce/config.php, I've changed the following to:

//product thumbnails
$avia_config['imgSize']['shop_thumbnail'] = array('width'=>80, 'height'=>80);
$avia_config['imgSize']['shop_catalog'] = array('width'=>212, 'height'=>212, 'crop'=>true);
$avia_config['imgSize']['shop_single'] = array('width'=>212, 'height'=>212, 'crop'=>true);
avia_backend_add_thumbnail_size($avia_config);

In the Woocommerce/Settings/Catalog, I've changed all dimensions to 212x212 hard crop.

I can only assume everything should be set to leave my thumbnails alone & display them at their native 212x212, however they're still getting resized somewhere along the line as the thumbnails are always far blurrier than the original image of the same pixel dimension.

I've deleted & reuploaded thumbnails, downloaded the Thumbnail Regenerator plugin... Nothing is working.

Could somebody explain what I'm doing wrong?

Posted 1 year ago #
Devin
Moderator

Hi NewNormal,

I'm not sure what you mean. Can you point to a specific example in your site that this is happening?

Regards,

Devin

Posted 1 year ago #
NewNormal
Member

Right now - all of the thumbnails on the "Modules & Cases" page are becoming blurry. The original image files are clear, but when they're uploaded & chosen as the featured image for my item pages — they are displayed as slightly blurrier than the original. I can only guess the thumbnails are being resized at a slightly smaller resolution, then scaled back up?

For comparision, you can view the original image here: http://dev.analogcraftsman.com/products/gristleizer/gristle212/ — to compare with the Gristleizer product thumbnail shown here: http://dev.analogcraftsman.com/products/

Posted 1 year ago #
NewNormal
Member

Revised question: Is there a way I could upload an image with the thumbnail pixel dimension tag it as the "Featured Image" — then pull the Featured Images for the product page grid thumbnails? That would be ideal — still bypassing any thumbnail generation that's occurring now. That way I'd have a little more control over what my thumbnail image looks like, and could design the other page images without having to worry about how they'll crop in the thumbnail.

Posted 1 year ago #
Dude
Dude
You can try to add following css code to propulsion/css/custom.css or the quick css field:
```
#top .thumbnail_container img, #top .thumbnail_container a:hover img {
    height: 100% !important;
}
```
Currently it's not possible to use the featured image option for the thumbnail because the first "Featured media"/"slideshow image" is used as featured image.
Posted 1 year ago #
NewNormal
Member

Didn't help — the image is still getting blurred somehow. Tried emptying my cache & everything.
Again, compare the Gristleizer image in the product grid with this one: http://dev.analogcraftsman.com/wp-content/uploads/2012/03/gristle212.png — it's most noticeable around the knobs of the unit.

Is there any way at all use the wordpress "Featured Image" for the product grid thumbnail & have nothing to do with the "Featured Media/Slideshow" content on the product page itself? I know it's not currently possible — but I have no clue how to resolve this and think it might help to just keep that featured image (to be used as product grid image) from being touched by whatever is re-rendering the original image?

Or is there any way to hard code/override each individual thumbnail image in the custom CSS file?

Sorry for the trouble — just can't have a low-ressy image when the details matter so much.

Posted 1 year ago #
Dude
Dude

Did you try to change the slideshow behaviour? Go to Propulsion > Theme Options > Layout & Settings and change the slideshow behaviour by using the dropdown underneath the "Slideshow behavior on overview pages" headline. By going this way you can upload a preview image for overview pages and other images for the single entry slideshow.

Posted 1 year ago #