- NewspaperRetina Images
- NewspaperThumbnails – Fix strange looking images on blocks
- TutorialsExisting content
- NewspaperUsing the theme with existing content
Thanks Chrish for your advice. I was using Smush plugin to compress. I will now manually do everything and will regenerate thumbnails to smaller version.
Just a quick follow up for old timey sake, for those coming late to this party:
IMAGE COMPRESSION
QUICK TIPS:
Test a post page with GTMetrix.com — this will show you what you need to do to improve speed specifically, for example giving you examples you can download of optimized images for the post page you test to see how that impacts you.
Also, to compress thumbnails, you can change the default compression per my guide in your wp-config file, then “regenerate thumbnails” to make smaller versions. (AND: you should be backing up your site before you mess with it, obviously!)
Alternate advanced method of compression:
download complete image folder to your PC via FTP for backup then use one of the various PC software apps to compress/process all images, then re-upload via FTP. Here is one for Windows, as just one of many examples: http://icompressor.blogspot.in/
Or, if that makes no sense or is too difficult; make backup first, then try this nifty plugin, which is a PAID service after the first 100 images; but useful to test if it works for you:
https://wordpress.org/plugins/tiny-compress-images/
Test a post page with GTMetrix.com — this will show you what you need to do to improve speed specifically, for example giving you examples you can download of optimized images for the post page you test to see how that impacts you.
Also, to compress thumbnails, you can change the default compression per my guide in your wp-config file, then “regenerate thumbnails” to make smaller versions. (AND: you should be backing up your site before you mess with it, obviously!)
Alternate advanced method of compression:
download complete image folder to your PC via FTP for backup then use one of the various PC software apps to compress/process all images, then re-upload via FTP. Here is one for Windows, as just one of many examples: http://icompressor.blogspot.in/
Or, if that makes no sense or is too difficult; make backup first, then try this nifty plugin, which is a PAID service after the first 100 images; but useful to test if it works for you:
https://wordpress.org/plugins/tiny-compress-images/
good day, i recently purchased your theme and after installation, the images are not displaying. I did a few regenerate and yet, images are not showing,please i need a solution
I have all icons set properly. I disabled all plugins, cleared cache, checked with my hosting company for possible issues. I installed and activated this recommended plugin to regenerate thumbnails. Still not working.
Hi Catalin, I am still facing problem on thumbnails. I had installed Thumbnail Upscale and Force Regenerate Thumbnails plugins. Recreated all old thumbnails (settings>>regenerate option) but still thumbnails not appearing with the post title on home page. Is it because I am using a virtual composer template and the image is in a tab?
post:http://mbahunt.in/maharshi-dayanand-university-mdu/ (check contact details tab for image)
Home page: http://mahunt.in/
Thanks in advance. Have a nice day!
Hi,
This is not a bug. You simply did not regenerate your thumbnails after changing themes. our theme needs to create it;s own thumbnails for blocks to display images properly. Please use this guide: https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/
Hope this helps.
Thanks.
Thanks for that. Can’t believe I forgot about the block settings. However, I turned off the thumbnail for the size I wanted the full image to replace, then I regenerated the thumbnails, but the full size image still won’t appear in the thumbnail’s place–I get an image placeholder that reads “Enable thumb from Theme Panel –> Block Settings”. I also deleted the cache and nothing seems to work.
When I inspect the code, it looks like the site is still trying to pull the thumbnail instead of using the full image.
EDIT: So, when I switched back on the thumb on block setting, the full image appeared in place of the thumb. Because I’m certain I’ll be regenerating thumbnails frequently (still building the site), I went ahead and altered the size of that particular generated thumbnail in the td_config.php file. My question about that is this: I’m using a child theme, but edited the parent version of the td_config.php file–how should I go about setting it up so that my changes don’t get wiped out upon theme update? Should I place a copy of the td_config.php file in my Child theme folder? Thanks!
Hi,
The problem you face is the thumbnail not being used on this block so the images get their full height that is different from one another so the post title is in different places on different modules.
Please make sure you have this thumbnail checked in the them panel: http://screencast.com/t/VB8zIcfTm0xS and then follow this guide to regenerate your thumbs: https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/
Thanks.
I have regular wordpress galleries in quite a few of my posts. They are set to 1 column and image size is “full” but when displayed in the theme (post) the images seemed to be restricted vertically to a height of 385 – so all the pictures looked different sizes instead of filling the post area.
While running the recommended “thumbnail regenerate” plugin, now the gallery I was experimenting with shows as giant cropped thumbnails. How do I get the theme to just recognize the wordpress gallery as it is without manipulating the pictures sizes or cropping?
Thanks
Hello TagDiv,
I need to find the settings for where I can change the thumbnail sizes?
I have had work done on block dimensions and now the thumbnails do not align – I have used the regenerate thumbnails plugin but this does not fix all the issues.
How can I change the actual thumbnail sizes in the core files?
Where are these located?
Thanks,
Hi,
Tried the regenerate plugin but it didn’t fix the problem. The theme update Newsmag.zip was uploaded as usual through wordpress. Deactivating plugins didn’t work either.
Anything else?
Hi
Please make sure that you update the theme according with our documentation: https://forum.tagdiv.com/newsmag-how-to-update-the-theme/ also try to deactivate all plugin except Visual Composer clear all caches then test again. Also I’ve checked your site and noticed that the thumbs are not properly generated for some images. Try to regenerate your thumbnails following this guide: https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/ and check the site again.
Thanks!
Hello stax,
Please notice that our theme does not have such an option as you want. Also, please notice that each block uses a specific thumb which crops the each featured image from your posts.
Please take a look over the below explanation and try to understand a bit how it works the thumbs in the theme. Please check here ->>
Our theme uses the system of cropping from center to top. The theme uses thumbs to reduce the page size and speed up page loading time. From each image uploaded are generated thumbs for each thumb size used by the theme. Basically, when a post it’s displayed on the page in a block, the featured image displayed is not the one which you uploaded in the media file, it’s a thumb cropped from the original image at the precise dimension. To change the picture orientation most likely you will need a different cropping system. We use a WordPress function – add_image_size() – you can read about it here – https://codex.wordpress.org/Function_Reference/add_image_size – and here – http://www.davidtan.org/wordpress-hard-crop-vs-soft-crop-difference-comparison-example/
Our theme crop (cut) thumbnails in some cases to avoid creating a lot of thumbnails in order to reduce to load more spaces on the server.
If you don’t have the possibility to upload large images you could use a combination of plugins to upscale the thumbs – Thumbnail Upscale and Force Regenerate. For more information about these kinds of plugins, please consult their documentation here -> https://wordpress.org/plugins/thumbnail-upscale/ -> https://wordpress.org/plugins/regenerate-thumbnails/ Also, please ensure that the functionalities of these plugins are not affected by the other untested plugins that could create interference through the theme. Please notice that these types of plugins are not tested with our theme and we cannot provide support for the theme. We recommend them because a lot of our customer uses and they were satisfied to their functionality.
Thanks for your understanding!
Hi
I forgot to mention that you have to regenerate the thumbs after you change the values in td_config.php. If the plugin retina 2x does not work that it’s the only way to increase them image’s quality for mobile.
Also I’ve checked you site and it works fine on both mobile and desktop devices, also you don’t have any error messages in browser’s console: http://screencast.com/t/RKKy0u2lUMP
Note that if you load bigger images on mobile the site’s page speed will be affected a bit as the page size it’s bigger.
Thanks!
Hi ,
After i use the plugin Retina 2x to regenerate all the image, its seem better now, but mobile version is down.
I got the below error message when i using mobile to my site
Read time out at usr/lib/per15/site_perl/5.8.8/Net/HTTP/Methods.pm line257
Also, when i using desktop version but in mobile screen size, its show many error which It never seen before.
Error message: retina.min.js?ver=1.4.0:10 HEAD http://insolenews.com/wp-content/uploads/2016/06/yeezy-750-grey-glow-release-date-537×360@2x.jpg 404 (Not Found)
I del the plugin, this issue still here
Hello.
I have a problem with old thumbnails – they do not displayed correctly because of size differences.
I cannot use plugins such as “regenerate thumbnails” because my images stored in Amazon S3 and the plugin simply does not work that way.
Is there an elegant method to solve this issue? It is super important for me.
hi I follow your step,
1- add the below code to function.php
add_filter(‘jpeg_quality’, function($arg){return 100;});
2- install Regenerate Thumbnails plugin and regenerate all the thumbnails.
But it still in low resolution when i using mobile.
Can you help to fix it??
Thanks,
Hi
That happens because in some situation the same thumb it’s displayed in a bigger container than on desktop. In these situations the image it’s stretched with css and its quality it’s lower.
Try to increase the value of WordPress’s compression following this link: http://www.wpbeginner.com/wp-tutorials/how-to-increase-or-decrease-wordpress-jpeg-image-compression/ then regenerate the thumbnails: https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/ and test the site again.
Thanks!
Hi,
I just installed your theme and face some problems. I am using WPML to switch between english and german language. I know, you told me, that the theme is not certified for the use with WPML.
Still, I wonder, why the english page (https://www.offroaddance.com) looks fine (besides the thumbnails which I have to regenerate), while the german version (https://www.offroaddance.com/?lang=de) looks completely smashed.
The preview of the german home page looks just fine. German and english version are identical besides, that I gave the german category id´s for the different blocks.
Do you have an idea, what could be the problem or how this can be solved ?
Additionally, I am having some maps on my post pages (i.e. https://www.offroaddance.com/black-rock-mountain-road-arizona-strip-english/). The map should show up below the text “And here is an overview of the area, we visited:”.
The maps are loaded in a div element as iframe and I am using the following custom css code to scale them for the content area width:
.embed-container {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
width: 100%;
height: auto;
}
.embed-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
Unfortunately, the maps are not showing up, if I use this custom css. If I remove it, the map shows up, but uses the complete width of the content block + sidebar area and doesn´t stay within the content area.
Maybe you are also having an idea about this ?
Thanks in advance for your help.
Hi,
The best thing to do in this situation is make sure you do not use many different blocks and modules on your site. Try to use just a few of them and remove the thumbnails for the rest. That way you can reduce the thumbnails created for each image: http://screencast.com/t/MKOAdlcAUs9C
After you disable some of the thumbnails, you can use the ‘force regenerate’ plugin and regenerate your thumbnails.
Thank you!
Hi,
Please make sure you have the thumbnails active in the theme panel: http://screencast.com/t/hyq216nO3 (if you change settings here regeneration of the thumbs will be required again)
You can try to use an alternative regeneration plugin like ‘force regenerate’
You can also try to disable all plugins excepot visual composer, clear cache and reset cdn files to rule out a plugin conflict.
If your thumbs still do not show up, please send us an email at contact@tagdiv.com and provide wp-admin so we can inspect your site. Also include a link to this topic so we can identify you.
Thank you!
Hi.
I’ve installed Regenerate Thumbnails, I’ve pressed the “Regenerate All Thumbnails” button, but I don’t see in the page the correct sizes.
The web is https://www.butarque.es
I don’t have installed any optimizer images plugin.
What else can I do?
Thank you.
Hi,
It seems your site does not use a thumbnail for that module’s images. Please make sure you have this thumbnail active: http://screencast.com/t/Ee3rTOnEPzW and remove any image optimization tools you might have like photon from jetpack for example. And then regenerate your thumbnails. Please follow this guide: https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/
Thank you!
Hello,
Please make sure you remove any image optimization tools such as photon of jetpack, then regenerate your thumbnails. Please follow this guide: https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/
Let us know how it goes.
Thank you!
