-
Posts
-
This has been so confusing that I have made a quick video (with audio) to better explain our issues we are facing with the Enfold theme and WooCommerce settings:
Video: http://www.screenr.com/4cdN
In the video I talk about 400×900 on the product image (landing page) but visually you see I tried a dimension that I pulled from Inspect Element and tried a smaller size (448×572) based on that. But it still clips off.
We already adjusted the settings in WooCommerce thumbnails settings, regenerated images, etc.
Please please escalate this and address urgently. Here is the home page: http://bit.ly/1bLZSXj
Regards,
DanielHey vegaspro!
I’m still not quite clear on what the issue is from the video but image dimensions are handled in multiple ways depending on what you are trying to do. If its for the single product page the image is always going to be constrained by the width of the container the image is in but the source is from your settings in the WooCommerce settings.
If you want an image to be wider than the current container on the single product page you need to change the layout of your single product pages. For example: http://kriesi.at/documentation/enfold/change-woocommerce-single-product-page-layout/
This allows you to change the grid sizes within a function for your child theme.
Regards,
DevinWooCommerce has the image size settings in WooCommerce Settings>Products in the “Product Image Sizes” section. The plugin then outputs those images into the pages.
You can choose for images to be cropped or not cropped.
You can try using this plugin to see every thumbnail setting site wide along with their crop values: http://wordpress.org/plugins/simple-image-sizes/
This isn’t something I’ve ever seen not work for someone which is why I’m still not clear on what the issue is. The image sizes can be changed which will be reflected in the *source* of the page but in order to change the *container* sizes you need to change the number of columns in the shop or on a single product page the grid sizes used for the two content sections.
The image is getting cropped at 448×510. There is no setting in the theme with those image dimensions on either edge :http://bluby.com/demos/corporate/1/wp-content/uploads/448×572-448×510.jpg
#2 – As I mentioned above the image size is based on the container in which the image is located when you are look at the single product page. You would need to change the grid used on the single product page like in the code snippet here: http://kriesi.at/documentation/enfold/change-woocommerce-single-product-page-layout/
Think of the single product page as 2 columns. The left column is the product image which is set to use “four” of the available twelve units in the themes css grid. The right column holds the product information and uses “eight” units.
The theme sets these div wrappers in the config-woocommerce>config.php file to replace the default WooCommerce divs. The functions in the documentation link lets you use your own wrappers to replace those. If you only replace the grid units you can easily change the layout of the page in that same 2 column structure.
That whole example snippet of code on that page changes the layout to give you a right sidebar by also adding in
get_sidebar();wrapped inside three units of the grid (as the “three units” classes).What you can do is use the same code except remove the get_sidebar and then modify the grid units to change the single product layout.
By default the single product image will be 450 pixels wide. The height is then scaled by WordPress to fit that width. If the option in WooCommerce is set to crop then it crops to fit the other edge.
If however the vertical edge is above 999 pixels (or whatever value is set for that edge) then WordPress sizes the image from that edge instead. Again, you can change the amount by which WordPress and WooCommerce do this in the WooCommerce settings.
Without seeing what all of your image settings are first hand I really can’t even guess where that image is pulling its size from or if its set to be cropped or not.
It looks like to me that the image for the archives is set to be cropped, when WordPress resizes the longest edge to fit the smallest dimension it then crops the image. So you get this final image for that page: http://bluby.com/demos/corporate/1/wp-content/uploads/448×572-448×510.jpg
I have no idea what customizations you’ve done thus far but by default the category image above product categories will be sized using:
$avia_config['imgSize']['entry_with_sidebar'] = array('width'=>710, 'height'=>270); // big images for blog and page entriesIn the functions.php. In my Dev install I just did a quick test:
If you need assistance in customizing the theme files, WooCommerce templates via functions or new templates then you will need to look into a freelance developer. Support is not available for customization or for debugging customization already done.
Hey!
If you want to set a different thumbnail size open up wp-content/themes/enfold/config-woocommerce/config.php and search for:
if($layout == 'fullsize') $image_size = 'entry_without_sidebar';Replace entry_without_sidebar with any other thumbnail size of your choice. You can also define a new size with: http://wordpress.org/plugins/simple-image-sizes/ , then regenerate the images with: http://wordpress.org/plugins/regenerate-thumbnails/ and at least replace entry_without_sidebar with the custom image size name.
Cheers!
PeterWhen you say “Replace entry_without_sidebar with any other thumbnail size of your choice.” what do I enter there? 700px?
Hi!
Thank you for the update.
You can select accross these thumbnail sizes which you can find on functions.php starting on line 91.
$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 ..............You can choose among 15 thumbnail sizes. If you want to use the “widget” thumbnail size with 36x36px image dimension. Just replace the code Dude suggested with this:
if($layout == 'fullsize') $image_size = 'widget';Regenerate the thumbnails after or upload them again.
Regards,
Ismael
- You must be logged in to reply to this topic.