[Resolved] Image preview in CRED edit form, full size
This thread is resolved. Here is a description of the problem and solution.
Problem:
CRED edit post forms, with image upload fields, shows the existing image in FULL-SIZE not a "mini-version" of the image.
Solution:
150x150 px thumbnail is generated natively by WP core as the_post_thumbnail and this should be generated regardless of Toolset or CRED or theme.
To forcefully resize images, you can follow any one of the ways below:
1. Add this css in CRED form >> CSS editor section -- this is the easiest option:
This support ticket is created 7 years, 3 months ago. There's a good chance that you are reading advice that it now obsolete.
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.
After upgrading CRED to latest version, CRED edit post forms, with image upload fields, shows the existing image in FULL-SIZE not a "mini-version" of the image.
Breaks layout and looks very strange.
Attaching images for before update and after.
Thank you for contacting Toolset support. I am not able to reproduce this issue at my end with latest Toolset CRED.
1. Could you please try to check it by deactivating all third-party plugins (except Toolset) and switching back to the Default Theme (e.g. Twenty Sixteen theme) to see for any possible conflicts with any of the plugins or themes?
2. Please delete all sort of caches in your site plugin cache (if any), CDN / server cache (if any), browser cache too. Would be useful by creating a new CRED form or test with a different image.
3. Further, you can also check it by deactivating Layouts plugin or by adding CRED form directly into a View / Content Template.
Regarding your questions:
1. Disabling all other plugins but Toolset - image still in full-size
2. no cache plugin is active
3. Activating Toolset starter theme. With toolset active. All other plugins off. Image is not expanding entire page but still larger than before update. (100% width instead of 150px)
I have found what is causing the problem.
I do not know from where it originates but the developers can probably tell...
Cred 1.8.8
The preview image is loaded with an element.style {max-width: 150px;}
Cred 1.9.1
No element.style, no other size limitations,
Toolset Starter Theme 1.4.2
The theme modifies the image size with a custom style in style.css;
img, .wp-caption {max-width: 100%; height: auto;}.
Disabling the 100% width makes the image expand to full-size
Another finding:
I reviewed other forms (cred 1.9.1 active) with image upload fields. They load the generated 150x150px version of the image and has therefore no need of any css, correcting the image size.
The post in question, does not have a 150x150 version of the full-size image.
Why, I do not know ... but it's not relevant for this problem
Conclusion
Cred 1.9.1 needs to either reimplement the element.style from v1.8.8 or add a function that checks if there is an 150x150px version to use as preview image. If not, some kind of action.
2. Please try to check it by deactivating all third-party plugins and switching back to the Default Theme (e.g. Twenty Seventeen theme) to see for any possible conflicts with any of the plugins or themes.
I understand your concern, but what I am trying to say is 150x150 thumbnails are created natively by WP core and these are always generated. And CRED is inheriting that same thumbnail function in Uploaded image preview. So you need to see why your site is not generating 150px thumbs in general. You can test this by uploading an image directly in backend of WP editor or featured image section.
You can add this in your theme’s functions.php file to exclusively generate 150x150 thumbs in your site.
Right now we don’t have any way to enforce or crop thumb directly on the page (except loading 150px thumb). I have submitted a feature request to have more control on the preview image in the recent past as well.
I added my own css to my theme, but I wanted you to know that this change causes problems if, for any reason, there is no 150x150 image.
A very simple solution is to take back the element.style that CRED 1.8.8 had
Our 2nd tier has checked this issue and below is the response:
“ We rely on the Thumbnail Size stored. I don’t think this is good, but it’s also no BUG.
I just filed a request that enables you to control the size of those Images.
Maybe we should also add an option to force that, and if no thumbnail the user must pass another size.
And it was doing same thing in last CRED versions as well. It was not resizing anything, I tested this in CRED 1.8.x and up.
We always either render the whole thing or the size stored as thumbnail.
Please can you show us how that worked? In my test with the old CRED it always calls the whole image, just as in the new version, when no Thumbnail exists. “
If we miss something, maybe you can show us that it was behaving different? (Screen-recorded video or screenshots along with html/css code where you can see those classes applied.
Also, it would be great if you can test in a fresh WP install or in any other site. Because the issue can be only in this particular site somehow. Thanks
There must be some confusion here.
Quote
"In my test with the old CRED it always calls the whole image, just as in the new version, when no Thumbnail exists"
Yes that is what I am saying too.
Our 2nd tier also said that we can’t see element.style class in old CRED version, as I get to know there was no such class applied by old CRED too. So if you can show it to us with screenshots and inspect on the code, css file line number etc. Then I can forward that info for further review of this issue again.