- This topic has 13 replies, 2 voices, and was last updated 2 years ago by
David.
-
AuthorPosts
-
April 24, 2020 at 5:49 am #1253221
Kevin
I noticed that the theme loads the images in standard size 800×450 even on small screens.
Do you have a script to put in functions.php that makes the theme load thumbnail sizes (375×175) on mobile devices with a screen smaller than the one I specify?
I saw something similar done here on the forum for Page Hero, but I want a code that does this for all images in the article, just like wordpress does with thumbnails in the archive that instead of image.jpg loads image-375×175.jpg
April 24, 2020 at 6:08 am #1253263David
StaffCustomer SupportHi there,
can you link me to a page or post where i can see the issue ?
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/April 24, 2020 at 6:31 am #1253304Kevin
Not quite a problem, I want mobile devices to open images with the extension -375×175.jpg set to thumbnail.
Article: https://skdesu.com/e-verdade-que-no-japao-nao-tem-exercitos/
Normal size: https://i2.wp.com/skdesu.com/wp-content/uploads/2020/04/faj1.jpg?w=1200&ssl=1
As I want on mobile devices https://i2.wp.com/skdesu.com/wp-content/uploads/2020/04/faj1-375×175.jpg?w=1200&ssl=1
April 24, 2020 at 6:39 am #1253317David
StaffCustomer SupportWordPress is responsible for displaying the Image HTML. By default it will use
src-set
which provides all the various image sizes.However it looks like you’re using a lazy loader which is changing that behaviour.
Can you try disabling the lazy loader ?Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/April 24, 2020 at 6:48 am #1253339Kevin
I do not believe it is the problem, even deactivating it does not change the size … AMP does not have a Lazy Load and also has open giant images.
April 24, 2020 at 8:55 am #1253693David
StaffCustomer SupportThe Theme is not responsible for how an Image is output within your Content. It is a WordPress function. But your site is not displaying the default WordPress HTML and this is due to your lazyloader or AMP plugins.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/April 24, 2020 at 9:47 am #1253799Kevin
I use Generatepress on 3 sites, some don’t have a cache plugin, others display the src-set, but even those with the src-set tag don’t share the image link 375×175.jpg
I thought it was a jetpack thing or cache plugin really, but even disabling them all. Clearing cache, including CDN cache, testing on the 3 sites, the image uploaded by my cell phone is full size.
Perhaps because the image I want to appear is the tumbnail. I’m not sure if that’s the reason. If so, WordPress is not able to do this by default.
I looked for you because I want to make a theme-level addition, because I want the single.php images to load a mobile version. Doing so could break and disappear in future updates, I also have no idea, so I expected you to have some function script, I searched on Google but none worked.
And of course, I’m here too because I found an article that solved this problem, but with the background image of the Page Hero headers.
https://generatepress.com/forums/topic/change-hero-header-background-image-size/page/2/
April 24, 2020 at 10:16 am #1253885David
StaffCustomer SupportI have taken a look to see what my phone is loading. And each of the images are being served differently. Some more correct then others. For example this is the 2nd image down ( the one with the Japanese flag illustration ):
You can see this markup includes
src-set
variants – a 750w and a 375w image.This is how i would expect Jetpack or any lazy loader to behave.
But some images are just serving a large image.
Is there a way to tell Jetpack to regenerate those thumbnails maybe?Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/April 24, 2020 at 10:31 am #1253922Kevin
I understand, it is likely that this problem I will be able to solve, but what I don’t understand is because, even the image with the srcset, of a mobile device when copying the image link, it takes the 750w link.
Maybe it’s my crazy, I can’t say if even copying the link to the full image, the one loaded was actually 375w.
April 24, 2020 at 10:43 am #1253944David
StaffCustomer SupportIf the device has Retina or HD Display support it will generally grab the x2 image – so on my iPhone it was loading the 750px.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/April 24, 2020 at 11:14 am #1253973Kevin
Mine is iphone, so it is explained … Even on the desktop if I leave the browser window small, it will load the entire image right? Now it’s easier to solve, thanks. Now it’s time to find out why some images display srcext and others don’t. Thank you very much for your patience and time. xD
April 25, 2020 at 3:21 am #1254729David
StaffCustomer SupportIf the resolution requires it then yes it will load the larger image.
I tested your site using GTMetrix and there was no complaint about images being rescaled – so it sounds like the correct image sizes are being requested.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/April 25, 2020 at 4:08 am #1254771Kevin
This problem never really affected me, because 800px wide is a small size, even for today’s smartphones. I thought only if I could reduce the size of the pages with AMP, but what really makes them slow is ADS.
I’m still curious to understand why most images don’t appear in the srcset. I usually clean the DB manually, do these srcext stay in the DB? And did I just black out? lol
April 25, 2020 at 6:27 am #1254899David
StaffCustomer SupportHaha 🙂
I think the issue is related to the JetPack lazy loader as it is generating the images and the HTML to display them. But i don’t use Jetpack so i am unsure of what you need to do to get them to rebuild those images. Have you checked with their support ?Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.