Search Results for 'image sizes'

Results from the Forum
Calin
tagDiv Staff

Hi,

Please read The Ultimate Guide To Image Sizes for WordPress from here -> https://wphero.io/blog/ultimate-guide-wordpress-image-sizes/
For a higher website speed on mobile we do not recommend very large images, because that will take more time to full load the pages.

Thank you for your understanding.

capk1
Participant
#0

Hello,

I downloaded your Wine Aroma demo to customize it for our site. Like so many others,my uploaded image becomes a blurry background image, its not sharp like the one sold with the demo. Now, probably unlike some of the other users who complained of the same thing, I am a graphic designer, so I understand about proper image sizes and ppi. I had to find where the the background image can be changed, because I couldn’t find instructions on that. Its in the CSS section. I then went to the Media Library, the demos background image, the one behind the wine bottles is 2560×900. So, I created and uploaded a file from photoshop which exactly matches that so it is also 2560×900 at a very high 468 PPI resolution, exactly the same as the image behind the wine bottle, yet it STILL shows up blurry. I used the “Cover” setting because the “Do Not Repeat” setting uploads a smaller image, still blurry. Whats worse is I have even re-uploaded the rolling hills, that is the image behind the wine bottles…it up Blurry! How is that possible when its supposedly the source image used!?! Why does this problem exist with Newspapers themes?? If it’s not a problem you need to create specific instructions on how to change it where to find it and how to upload it so that people don’t spend 5 hours trying to do it only to fail!

Also, I couldn’t find a satisfactory answer from your team that would resolve the blurry background issue. You need to speak with your original designers and developers to understand what they’ve done to create sharp background images. it is NOT an incorrect size or pixels per inch (ppi) issue. Please reply as soon as possible.

akisloukas
Participant
#0

Hello,
in some cases my image is smaller than its needed to look nice in style 4 and the visitors seeing a gray box. Is it possible to just stretch the small images to fit the size of the block?

Thank you

Simion C.
tagDiv Staff

Hi,

You should use images bigger than the required thumbnail sizes for good results
https://forum.tagdiv.com/theme-thumbs/
The theme will create thumbnails from the images you set as featured, these will be used in various elements.

They will be cropped by center top – https://forum.tagdiv.com/featured-image/
So the results will be different depending on what aspect ratio the image has and module used
https://forum.tagdiv.com/thumbnails-vs-featured-image-size/

So basically you can use bigger images as featured, only thumbnails from them will be used, this will not cause problems with performance by loading the full size of the images.

If the thumbs are not created properly, please check if the GD library PHP extension is enabled on the server
https://forum.tagdiv.com/thumbnails-fix-strange-looking-images-on-blocks/

Please let us know if you have more questions.

Thanks

Simion C.
tagDiv Staff

Hi,

You could experiment with different image sizes until you identify the perfect results. It will indeed be dependent on image aspect ratio as well and modules used. The thumbnails the theme creates are cropped center top
https://forum.tagdiv.com/featured-image/
https://forum.tagdiv.com/thumbnails-vs-featured-image-size/

As a note, using flex blocks or flex grids may be easier to manipulate the images in pages. You can choose a size for the image and align it
https://www.screencast.com/t/nT4OfTw3

Anna Zakrisson
Participant
#0

Hi,

I seem not to be able to upload images to my site if they are over ~600kb. Get HTTP error.
I am running Newspaper 9.1
I have tried all kinds of formats and sizes. I have also tried compressing images with TinyPNG.
I have removed large demo photos from the library in case their size prevented an upload – no success.

The images I can upload have too low quality and look terrible on the site. This is a very serious problem for me.
I would be extremely grateful for some assistance on how to proceed.

Best,
Anna

Simion C.
tagDiv Staff

Hi,

Can’t find any solutions online unfortunately, I searched for a while. You could search for different solutions or consider using plugins to display Instagram images, maybe some plugins have options to choose from multiple sizes.
Check some of these for example, and try some free plugins
https://premium.wpmudev.org/blog/12-instagram-plugins-for-wordpress-worth-installing/

Thanks

Simion C.
tagDiv Staff

Hi,

Predefined blocks and grids (all except flex blocks and grids) will use predefined thumbnail sizes, cropped by center top. The results will be different according to module used and also affected by the image aspect ratio
https://forum.tagdiv.com/thumbnails-vs-featured-image-size/
https://forum.tagdiv.com/featured-image/

Only with the flex blocks and grids you could control the images by some parameters. You could experiment with the flex blocks and grids which have options to manipulate the image
https://www.screencast.com/t/JqcubPWxoZ
https://www.screencast.com/t/MF6tn1kSSunH

There are quite a few block and grid designs created by our team which you can use, we will add grids as well. These are based on the flex blocks and grids
https://affiliate.tagdiv.com/#/load/Blocks
https://forum.tagdiv.com/tagdiv-cloud-library-plugin/

Thanks

Simion C.
tagDiv Staff

Hi,

From what I can see AMP is not activated for your posts. You simply have to install the plugin and activate it, to test add /amp at the end of the URL of a post page. The posts should look like this
https://demo.tagdiv.com/newspaper_crypto/td-post-ripple-ceo-and-ethereum-co-founder-bash-ico-industry/amp/

There is no menu currently for the AMP version, this and the design is inspired by the Yoast SEO website
https://yoast.com/social-media-optimization-with-yoast-seo/amp/
The header logo will be the one you set for mobile in the theme panel
https://www.screencast.com/t/sk3sDiyVW
If the logo is blurry test with a different image format and sizes, until a good result is found.

Ad codes for AMP will have to be entered in the dedicated AMP section, be sure to use the proper codes, for example for Adsense
https://support.google.com/adsense/answer/7183212?hl=en
https://www.screencast.com/t/vc3VzKSIEHTi

AMP will work properly for pages created with the default WordPress editor if you want to use it for pages, not with page builder content. The main purpose of AMP is speed, not loading heavy pages with blocks and grids.

Of course our plugin is optional, you can use other AMP plugins if needed. We will try however to improve it and add more options for it in future updates. Let me know if you have more questions.

Thanks

Simion C.
tagDiv Staff

Hi,

Maybe your featured images don’t have the adequate size. In this topic I found there are some recommendations in terms of size, which Facebook recommends
https://louisem.com/3838/facebook-link-thumbnail-image-sizes
Test with bigger images if possible.

Use the debugger to see how the shared post looks
https://www.wpbeginner.com/wp-tutorials/how-to-fix-facebook-incorrect-thumbnail-issue-in-wordpress/

Thanks

miguel_dimase
tagDiv Member

I’ve found the problem (sort of): Newspaper mess with tinyMCE’s images sizes according to the width of the screen, through (I think) editor-style.css.

With the menu on (https://www.screencast.com/t/Rh0NLQl9ipo) the right-aligned image IS reduced (at least in my screen).

With the menu collapsed (https://www.screencast.com/t/Z4pYKG477j4) the image is shown properly.

Please find out wich lines in which css should be commented to stop responding to changes in the width of the editor.

Thanks.

stuartmasson
tagDiv Member

Yes, that seems to have done the trick across all of our existing content as well, so hopefully that will help reduce load times.

The problem with this is that we’ve had to disable our retina images, which is not ideal for viewers with retina screens. Is this something that can be fixed for a future update?

It would also be really helpful to be able to use smaller image sizes than 696px as well. As you can see on our site, all of our thumbnails are in a 2:1 or 3:2 format, so the 324x400px option doesn’t work for us at all. A lot of our thumbnail sizes are quite small, so it would be better to be able to have something like a 300x200px or 200x100px resolution as it would make the thumbnail file sizes much smaller.

Can you please pass this on to the dev team to add to their list of future feature requests?

Many thanks.

stuartmasson
tagDiv Member

Hi Simion,

Thanks for your reply. I think we are getting somewhere.

The image width you mentioned of 1392px is double 696px, so presumably it’s pulling the retina version of the 696px thumbnails.

We use the Imagify image optimisation plugin, as owned/recommended by WP Rocket. It optimises for all thumbnail sizes used by the theme. I disabled the plugin then built a new page and created eight new posts to test, so it wouldn’t pull any old images. Link here, with one flex block to pull 696px images and one set for 324x400px images:
https://www.thecarexpert.co.uk/image-compression-testing/

Made no difference, was still pulling the 1392px and 648px (retina) images. Disabled all my other plugins apart from tagDiv ones and core plugins like bbPress, still no difference.

Went to the theme panel and deselected all the retina versions of the thumbnails, and presto! It now pulls the 696px and 324px images instead of the 1392px and 648px versions.

So it appears that the tagDiv theme panel settings are causing the flex block to pull the retina images rather than the originals, rather than a plugin.

Simion C.
tagDiv Staff

Hi,

I checked a few of the flex modules in your website, seems that indeed the full images or some unusual sizes are used instead of selected thumbnails. For example this module
https://www.screencast.com/t/lyt91bTX6z2
It uses a thumbnail size it seems of 1395x741px – https://www.thecarexpert.co.uk/wp-content/uploads/2014/07/car-finance-voluntary-termination-pcp-hp-agreement-e1476792854766-1392×741.jpg
That is not a theme created thumbnail and also not the full size of the image, quite unusual. The same image seems to have a 696px size created which should be used if selected
https://www.thecarexpert.co.uk/wp-content/uploads/2014/07/car-finance-voluntary-termination-pcp-hp-agreement-e1476792854766-696×370.jpg

I made few tests, selecting different sizes for the image in the block
https://www.screencast.com/t/ixvHrwCHL
https://www.screencast.com/t/GiFKbq3bu
They are loading correctly from what I can see. The sizes you select should be used. The smallest at the moment is the 324x400px size.

Do you maybe use any image optimization plugins or image delivery services? Worth testing without them if you do. Or investigate all plugins at once. Deactivate them all as a quick test (except theme plugins), check if this has any effect.
Also create a new test page and use a flex block, select the image size, see if the same thing happens there. Let me know what you find.

Thanks

stuartmasson
Participant
#0

Hi guys, hope you’re all well.

Have finally finished our first site using tagDiv composer and absolutely loving it. My only major problem at the moment relates to image thumbnail sizes when using Flex Block 1 – which we are using heavily because it’s so flexible.

This is our site: https://www.thecarexpert.co.uk/

Problem appears to be that the page is pulling and cropping the full-size images (usually 1200x800px or 1400x700px) for the thumbnails, rather than using the versions selected (696x0px).

As a result, images are taking up far too much size and time in page loading, according to this test I’ve run several times.
https://pageweight.imgix.com/jobs/a48a70f0-ff69-4dc1-a9cc-f6253a6cb7b4/

Any ideas on how I can fix this?

And secondly, assuming I can get this working, can you consider smaller thumbnail sizes for these blocks for a future update? Some of our thumbnails are very small, especially on mobiles, so we’d like to serve the smallest images possible (<200px wide).

heedozz
tagDiv Member

thank you for the reply.

The theme is that the width of the image to be regenerated is 324×160 and 324×235.

So I changed the 324×235 regeneration to 325×235 using the plugin called “Simple Images Sizes” and started to recognize it properly.
Simple images Size : (https://wordpress.org/plugins/simple-image-sizes/)

I think this is probably because it’s not compatible with the WP-Stateless plugin, which uploads images to the automatically Google Cloud.
WP-Steateless : (https://wordpress.org/plugins/wp-stateless/)

I’ll use it this way, and if I have a big problem, I’ll have to remove the plugin.

Even if there is an option to limit the image regeneration of this theme, it is not a level that can be ignored in regenerating capacity.

If i upload an image, i need 2.5x(Storage space) additional image.

Anyway thanks for checking my site and replies!

jalewa
Participant
#0

Hello… I want all images under my articles width should be automatically 100% and height as auto. As of now some image are big and some are small due to image image.

But i want all images width sizes inside the post should be 100%.

Please reply how i can do this.

simchris
tagDiv Member

You can disable image sizes not used from the theme panel. See the theme docs for more info.

u2them
Participant
#0

I’m working on a dev site, building of clone of existing site and trying to keep as much of their plugins and systems in place as to not rock the boat for them too much on transition. They use simple metaslider in header ad area on old site, in this template if I put it between div tags it pops properly for a second then gets super tiny, if I don’t use div tag then it’s super large. Suggestions on getting it to fit properly would be great. I don’t really want to do a giant header, I’ve tried changing spacing to 90 main menu, i’ve changed image sizes, but then things seem to stretch and get distorted. http://wyo4news.u2them.com Thanks

Simion C.
tagDiv Staff

The big page size would be because of the slider mainly, the images it displays are the full original sizes by default. The theme modules display thumbnails only.

For example one of the images in the slider is of this size
https://www.screencast.com/t/vMWgQlFW
While a module thumbnail – https://www.screencast.com/t/u2CV3tjYu

You could make the slider use a thumbnail too, in the slider settings
https://www.screencast.com/t/pZdWjVDinGq8
This should reduce the page size significantly.

The slider is a very complex plugin with an enormous amount of settings
https://www.themepunch.com/revslider-doc/slider-revolution-documentation/

Simion C.
tagDiv Staff

Hi,

The theme will generate I believe 19 thumbnails sizes for each image, WordPress will generate 3
https://forum.tagdiv.com/theme-thumbs/
Each one of the theme thumb sizes can be deactivated in the theme panel. Creating and serving thumbnails is much more efficient then serving full or resized image sizes.

What exactly is this error you are referring to? When does it happen? More details would be very helpful.

Thanks

Edward
tagDiv Member

https://forum.tagdiv.com/topic/a-wish-for-future-theme-versions-generate-thumbnails-for-featured-images-only/#post-162094

Note that WP makes images from anything added to the media manager, per the default sizes shown on the settings > media page for *all* themes, defaulting to those most commonly used by the default blog themes included with WP.

The only solution that works across all themes, is to simply use the FTP method for common images, and then use the media manager only for the ‘featured’ image for a story.

https://forum.tagdiv.com/topic/a-wish-for-future-theme-versions-generate-thumbnails-for-featured-images-only/

===
When I ran out of almost all the disk space on the hosting I had to manually delete all unused previews. Yes and it’s sad. Now I use ftp-Protocol to upload photos to the article.

And use the media manager only for the ‘featured’ image for a story.

UPD. Да, к сожалению, лишние превью пришлось удалять вручную. Может быть есть какой-нибудь плагин, который аккуратно это сделает за вас, надо искать…

Simion C.
tagDiv Staff

Hi,

Maybe you can check what files exactly occupy that space somehow. Note that the theme will create multiple thumbnails from the images you set as featured, that could be it
https://forum.tagdiv.com/theme-thumbs/
Disable unused sizes to save up space if that is the case. A list of the modules used by blocks and grids here
https://forum.tagdiv.com/theme-blocks-modules/

Bogdan B.
tagDiv Staff

Hi,

If you use a smart list, then you cannot re-size images. Each smart list has fixed image sizes for each specific smart list style.

Thank you!

tecky
tagDiv Member

Hi again,

My plan allows 300,000 inodes.

Okay, I’l try to disable some thumbnails. But the main problem is that for every image at the moment there are 19 thumbnails (different sizes)

Viewing 25 results - 601 through 625 (of 1,557 total)