[NicoModerator]

Hi There,

You might be using a plugin that could cause the image to be re sized. Try deactivating plugin so you see which on is causing the changes.

Cheers!

[Megan WParticipant]

I have. I have turned everything off to see if it changed and it didn’t, BEFORE I asked for help. To verify once more I just turned off the few plugins I use aside from the ones you require for X….

the same thing happens.

I understand this is a free support forum, but throwing out there that I should check the plugins after I spend hours trying to figure this out on my own and then another 45 minutes or so putting together examples to ask you for help, and for you to come back with an off the cuff “deactivate your plugins and try again” answer is infuriating.

[RadModerator]

Hi there,

It’s wordpress that resize and generates sizes based on registered sizes by add_image_size(). X dynamically compute your image sizes based on your layout size (and it’s uses the max size). For example, if your inside layout size 980px, then X will deduct spaces, and etc. from it and the resulting value will be registered as your image size. So your resulting image size will be like 800px or so.

Now that it’s registered, wordpress will generate images according to that. You may ask why layout size? and why 800px? It’s because in responsive layout, the columns and sidebars tend to collapse and becomes one column so it’s best if your image can maintain quality on both columnized and full width layout. And 800px is not that big, it’s almost same size as tablets and mobiles. If your 800px is still too big, then compression while maintaining quality is a must. Pixel size is still different from image file size, it is image file size that contribute bigger to loading performance.

Please note that regenerate your images every time you change your layout, or there are new added image size. You should install Force regenerate thumbnails plugin and use it. add_image_size() will not resize your existing images.

X registered the size in the name of entry, entry-cropped, entry-fullwidth, entry-cropped-fullwidth. And by checking your site, it’s correctly picking the registered size entry-cropped. But the actual generated image isn’t being picked. Thus, image regeneration is required.

<img width="709" height="473" src="http://www.apexautosports.com/wp-content/uploads/2013/11/IMG_26951.jpg" class="attachment-entry-cropped wp-post-image" alt="IMG_2695">

Thanks!

[Megan WParticipant]

Thank you for giving me a more extended thoughtful response.

So I’m gathering you’re telling me it’s pulling the correct image size but not the correct image. Meaning it’s calling for the correct 847wide picture but actually displaying the 709wide image?

I tried “regenerating” using a regenerating plugin and that didn’t change anything. Plus I don’t understand why now it will link to the actual resized file instead of the actual uploaded file either. Ugh, I’m going crazy.

Also I want to add that this is a newer occurrence. Happening only after updating to the newest X and child theme. Before this latest update I wasn’t having this problem, and those featured images still display the original image file names, not the ones with a -847 added to them.

[ZeshanMember]

Hi Megan,

I’m seeing that your caching plugin is disabled but still your website showing cached pages (see: http://prntscr.com/6a2f2s & http://prntscr.com/6a2dd2). Did you clear your caching plugin before disabling it? If not, please re-enable it, clear the cache and disable. If it doesn’t help either, please make sure you don’t have host caching feature other than wordpress plugin.

Thank you.

[Megan WParticipant]

So I’ve emptied the cache in the caching plugin now per your above instructions. It didn’t do anything. I checked my hostgator account for any sort of caching feature and there is none.

On thing that’s interesting to me now is I almost exclusively work on my laptop, a retina macbook pro 15″. Today I checked it out via our 21.5″ mac desktop and I have to say that the featured images look good. But both are displaying the 847 image?

Not to mention none of this would address the sudden change in whats happening.

Oddly enough I wanted to give a more basic theme a try and so i switched to twenty fourteen or whatever is most current, uploaded a featured image into a post, hit preview. It did the same thing. I switched back to X, hit preview and then it was clear. (all on my retina laptop)

[ZeshanMember]

Hi Megan,

Thank you for the clarification!

Perhaps the gzip compression in still active on your web server as your website is still showing cached pages. I’d advise contacting your web hosting provider in regards to caching.

Thanks!

[Megan WParticipant]

Ok I finally got a response back from hostgator saying this::

—-
At this time, I have renamed the old .htaccess file which did include some coding for HTTP caching. I have recreated the .htaccess with just the necessary WordPress handlers to load the site and it no longer appears to be showing cached content.
—-

So I cleared out my browser cache, regenerated the thumbnail for this page:
http://www.apexautosports.com/2000/testing-it/
and still no difference.

Like I mentioned in the previous post, I don’t really notice an image quality issue on my desktop mac, but its clear on my retina macbook, its clear on my iPhone 6 as well — which means that’s what others on a similar laptop/phone are seeing! Super irritating. Don’t really know what else to do… I feel I can only surmise that the theme or wordpress is pulling the wrong featured image for the size of my laptop screen/iphone?

There’s also no answer for why some posts are featuring the image name + the new size of 847x*** and others are showing the regular file name… I feel that must have something to do with whats going on.

Example: this post here — the image is large
http://www.apexautosports.com/2000/another-test/
when you right click to save the feature image it comes up as IMG_0867-847×635.jpg

but on this post here where the image is perfectly clear
http://www.apexautosports.com/2014/fancy-71-gauge-cluster/
right clicking to save the feature image gets you the regular name of IMG_0723-2.jpg ((NO addition of the image size 847x***))

[RadModerator]

Hi Megan,

You can optimize images on both different screen standard. Normal desktop screen is normally used, so if you wan’t to optimize your images under retina display then you must upload images twice as big as images you’re uploading for normal desktop screen.

It is still picking original images (uncropped) http://www.apexautosports.com/wp-content/uploads/2013/05/blkcuda.jpg . But it’s small for retina, so I think the problem now is image size you’re uploading.

Please check this http://www.leemunroe.com/designing-for-high-resolution-retina-displays/

The downside of big images is of course, it will be slow.

Let us know if that’s you want to do so we can just skip the issue about images not being cropped. Cropping is based from layout width, the computed layout width could be bigger than your upload images that’s why cropping isn’t applied on those images.

Thanks!

[Megan WParticipant]

No I don’t want to optimize for my retina screen, I just want it to go back to a couple months ago when the featured image displayed a nice perfectly clear image across all devices. Let’s just focus on the issue with the current featured images uploading and not displaying clear.

This image you reference above ::
http://www.apexautosports.com/wp-content/uploads/2013/05/blkcuda.jpg is the featured image on this page:
http://www.apexautosports.com/2013/just-finished-1971-hemi-cuda/

This posts featured image works perfectly fine, and if you right click on the featured image the image it gives you to download it blkcuda.jpg in it’s original 1024 width

The problem comes in later, AFTER I updated the theme.
Here’s a newer post:: http://www.apexautosports.com/2015/another-charger-showed-up-this-week/
The image quality is deteriorated, and if you right click on the image to download it, it gives you the changed version of 70_charger3-847×532, while the original image is here http://www.apexautosports.com/wp-content/uploads/2015/02/70_charger3.jpg and is originally 900px wide.

Whether or not you can see an image deterioration on the given screen, it’s still calling up the 847px wide version, unlike BEFORE the update, which is clearly the issue. I want the images to be handled like they were in the first post example, not the 2nd.

[ChristianModerator]

Hey Megan,

The reason X now uses a smaller version image is because many request so in order to make the page load faster. To use the original image, please add the code below in your functions.php.

function x_featured_image( $cropped = '' ) {

  $stack     = x_get_stack();
  $fullwidth = ( in_array( 'x-full-width-active', get_body_class() ) ) ? true : false;

  if ( has_post_thumbnail() ) {

    if ( $cropped == 'cropped' ) {
      if ( $fullwidth ) {
        $thumb = get_the_post_thumbnail( NULL, 'entry-cropped-fullwidth', NULL );
      } else {
        $thumb = get_the_post_thumbnail( NULL, 'entry-cropped', NULL );
      }
    } else {
        $thumb = get_the_post_thumbnail( $post_id, 'full' );
    }

    switch ( is_singular() ) {
      case true:
        printf( '<div class="entry-thumb">%s</div>', $thumb );
        break;
      case false:
        printf( '<a href="%1$s" class="entry-thumb" title="%2$s">%3$s</a>',
          esc_url( get_permalink() ),
          esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ),
          $thumb
        );
        break;
    }

  }

}

I’ve tested that in my test install. It’ll use the original image size for pages’ and posts’ featured image. The Portfolio will still use the option in the Customizer.

Hope that helps. 🙂

[Megan WParticipant]

That did help. It eliminated the issue.

But what do you mean it’s doing it because its getting many request?

[NicoModerator]

Great to hear.

In regards to X theme images, we uses optimized or small images so we could accommodate a lot of site visitor requests.

Hope it clears your mind.

Cheers.

[Author]

Posts