- This topic has 15 replies, 2 voices, and was last updated 4 years ago by
.
Hello Support,
I am trying to improve the image quality on my site and I hope you could help me with the following:
What is the optimal image size for:
- Main featured image for blog post (large)
- Content image within the blog post
- Related Post at the end of the blog post
- Blog Category
- Small featured image on blog’s homepage
Moreover, how are the respective image size related to the default settings as follow:
- Thumbnail Size (default: 150×150)
- Medium Size (default: 300×300)
- Large Size (Default: 1024×1024)
Are these images being used by the theme in the first place?
I tried searching for various content and help on this but to no avail. Thus I’m helping you can provide some insights to this. Thank you!
Hi @pzl,
I hope you are well today and thank you for your question.
It is different for various thumbnails as listed below.
Normal thumbnails – 660px X 420px
Portrait thumbnails – 420px X 660px
Square thumbnails -660px X 660px
Landscape large thumbnails – 1200px X 675px
So you can set larger thumbnails size 1200px X 675px
The size of the content images added in the blog post or page is not controlled by the theme.
Best regards,
Shufflehound teamThank you for the specification. I understand that the larger thumbnail should be set at 1200×675 (which I have been doing so for my blog).
Moreover, I will like to understand whether and how I should adjust the default settings from WordPress in order to accommodate to the theme’s picture size.
For instance, I used web inspector and realised the the small featured image on the homepage is 236×150. As such, I’m not sure which thumbnail will be used (based on the information that you have provided). Accordingly, I will like to adjust the setting to improve page load speed.
Thank you!
Yes, it also takes the default Thumbnail Size (default: 150×150) that you have set on your website so please change it accordingly and use the below plugin to regenerate the exisintg thumbnails.
https://wordpress.org/plugins/regenerate-thumbnails/
Got it, I shall change the Thumbnail Size in WordPress’s Media settings from 150×150 to 236×150.
How about the image for the following?
- Related Post at the end of the blog post
- Blog Category
Where does the theme take the image size from? Is it from Medium Size and Large Size in the WordPress settings?
Thank you for helping me to optimise these sizes.Related Post at the end of the blog post
They are normal thumbnails having size 660px X 420px.
Blog Category
It’s a large image size set in the site Media settings.
Thank you so much for the information. May I ask if the following steps will help to correct the image sizes to its optimal size on my blog?
1. Small featured image on homepage
Change thumbnail from WordPress’s Media settings from 150×150 to 236×150.
2. Related post at end of blog post
Upload and activate Jevelin’s custom plugin and add
set_post_thumbnail_size( 660, 420, true );
3. Blog Category
Change thumbnail from WordPress’s Media settings from 1024×1024 to 1200×675.
Once the 3 steps are done, I will regenerate the thumbnails using the above mentioned plugin. Thereafter, all existing images and new uploads will use the new settings. Am I getting it right? Thank you!
May I ask if the following steps will help to correct the image sizes to its optimal size on my blog?
You don’t need to do anything, just let the default settings work and the image sizes will display appropriately as displayed on the below demo website.
Yes, the image sizes are displayed in the right manner. However, the scale is usually larger than required. As a result, it leads to a slower loading time – reflected in GT Metrix. Hence, I’m trying to optimise everything in order to improve the overall loading speed of the site (especially because my site uses a number of images) by using images of the right size.
Ok, I understood.
In that case, you can either use image lazy loading to speed up site loading or develop custom code.
Developing custom code for custom functionality is beyond the scope of support that we provide here. Please see https://themeforest.net/item/jevelin-multipurpose-premium-responsive-wordpress-theme/14728833/support
If you are not a developer then you can consider hiring a developer to develop it for you. You can hire a developer from any freelance site. Shufflehound recommends the developer https://www.upwork.com/freelancers/~011652ffec8865c6d5
Yes, I’m using lazy load to speed things up. However, I was wondering if changing the size as above will help to improve the overall site since all images will be the right fit and be not scale to size.
Yes, it will do help.
Thank you for the confirmation. Can I also check in case there is incompatibility in the future, e.g. new sizes due to theme updates, can I revert all the settings to what it used to be, and regenerate the thumbnails again?
Yes, you can revert the changes back and regenerate the thumbnails and there won’t be any incompatibility.
Thank you so much. I shall do so accordingly. I really appreciate your patience to help me optimise my site!
You are always welcome here 🙂
