WPPizza – A Restaurant Plugin for WordPress › Support › General Support › New WP Version breaks Grid
- AuthorPosts
- 7 December, 2024 at 2:03 am #69383
Hi Olly,
after updating to the newest WP Version the grid is broken … and in a really strange way. The Grid is implemented with the following shortcode:
[wppizza category=”traditionell” noheader=”1″ exclude=”106,108″ elements = “thumbnail, title, content, prices”]
It looks like this :
https://lockruf.com/wp-content/uploads/Screenshot-2024-12-06-155006.png
And when rolling back to the old WP version everything is fine again …
Any Idea what can cause this or can you fix this ?
Thx
Thomas7 December, 2024 at 2:06 am #69384This reply has been marked as private.7 December, 2024 at 2:08 am #69385This reply has been marked as private.7 December, 2024 at 12:10 pm #69387Has nothing to do with wppizza. WPPizza does not set image sizes like that.
it only ever gets the thumbnail depending on what’s set as thumbnail sizes
and generates and outputs something like this:<img width="64" height="64" src="http://[somedomain]/wp-content/uploads/2022/08/pizza-64.png" class="wppizza-article-image-thumb wp-post-image" alt="" title="Special Pizza" />
your theme – or some plugin – generates this:
<img loading="lazy" decoding="async" width="768" height="768" src="https://[somedomain]/wp-content/uploads/2024/10/pizza_pomodori.png" class="wppizza-article-image-thumb wp-post-image" alt="" title="Pizza POMODORI" srcset="https://[somedomain]/wp-content/uploads/2024/10/pizza_pomodori.png 300w, https:/[somedomain]e/wp-content/uploads/2024/10/pizza_pomodori-150x150.png 150w, https://[somedomain]/wp-content/uploads/2024/10/pizza_pomodori.png 768w, https://[somedomain]/wp-content/uploads/2024/10/pizza_pomodori.png 1024w, https://[somedomain]/wp-content/uploads/2024/10/pizza_pomodori.png 800w" sizes="auto, (max-width: 768px) 100vw, 768px">
you will also find that where your images look the right size the last declaration is
sizes="(max-width: 768px) 100vw, 768px"
instead of
sizes="auto, (max-width: 768px) 100vw, 768px"
i.e whatever generates the “auto” is your culprit. Only you will know whether that’s a theme or plugin. I can guarantee you though it’s not wppizza
7 December, 2024 at 5:22 pm #69388I experienced the same problem.
My solution:
In the custom CSS section, I added the following code:/* Article Images */
.wppizza-article-default .wppizza-article-image .wppizza-article-image-thumb {
width: 100px; /* Sets the width of all images to 100px */
height: auto; /* Adjusts the height proportionally */
max-width: 50% !important; /* Sets a maximum width limit */
}
/* end of article images */Thanks Umut
8 December, 2024 at 3:00 am #69394HEy Olly, thanks for checking out … I disabled everything exept the WP Pizza PLugin and set it to the Twenty Twenty-Fout Standard Team and it still look like s$%t …
I DOn’T say it is the WP Pizza PLugin – but it seems it does not work correctly with WP 6.7.1.
As soon as I do a rollback to the older WP Version everything is fine again …
So yeah … it seems to be the core WP but WP-Pizza should work fine with it… SO mayber you can check again please ?
I can also give you an admin login to the site if you want…
8 December, 2024 at 3:05 am #69396Args… Sorry… it seems to be this plugin : https://wordpress.org/plugins/exmage-wp-image-links/
Damn … Sorry again. If I upload the pictures directly it seems to work.
The CSS SOlution from Umut doesn_t work for me … bur maybe I find another way…🙁
8 December, 2024 at 12:36 pm #69398Just out of curiosity, I had a dig around. So below some comments which may (or may not) be helpful
Not exhaustive research though. Maybe it helps someone somewhere.>If I upload the pictures directly it seems to work.
Yup. If you upload pics the regular way with wordpress, it generates 4 distinct separate images scaled and/or cropped.
exmage-wp-image-links (other/similar plugins may do the same) simply uses the image you added which then gets resized via css and image attributes. No actual resizing/cropping is taking place.
Since WP 6.7 WP adds the ‘auto’ attribute – if it’s missing and in certain circumstances – to the image sizes attribute.
So if the actual (thumbnail) image is meant to be square – but the actual image is not – it will simply be distorted to make it square.As it turns out, you can actually turn this off with the filter below, but this might have implications elsewhere.
I did not want disappear all the way down that rabbit hole – so if you do that , make sure to check all your images / pages .
Perhaps it works or perhaps it’s just a starting point . All depends on your particular site setup and many other factors. Suffice to say, it’s out of my (wppizza) hands and evidently something that WP introduced to the detriment of these kind of plugins…//remove auto from image sizes attribute (if set to lazy) add_filter('wp_img_tag_add_auto_sizes', 'myprefix_img_tag_remove_auto_sizes'); function myprefix_img_tag_remove_auto_sizes(){ return false; }
8 December, 2024 at 11:56 pm #69400Wow Olly… thanks so much!!! That helped and now it works again 🙂 Thank you!!!
- AuthorPosts
- You must be logged in to reply to this topic.