[Łukasz WParticipant]

Hi,

when I’m using X Theme (it’s ok with others) the section “Product Image Sizes” in WooCommerce > Settings > Products disappears. Any advice?

Thanks.

[RadModerator]

Hi Lukas,

Thanks for writing in.

It is intentionally disabled for X. X uses its own media sizes for theme and woocommerce. X dynamically uses image sizes based on content layout size. It’s not good with the responsive theme to use static and small images just like woocommerce default sizes. Imagine a 150×150 thumbnail size being displayed on single column layout on mobile which could have 400px width.

Cheers!

[Łukasz WParticipant]

The problem is that my site have super low scores at Google Page Speed since it’s using full resolution photos for catalog listing and product pages (like 2000x2000px), so my images take around 10mb bandwith for main page! Resizing each photo manually before uploading to wordpress is kind of step back when it comes usability.

I would like to set it to reasonable amount considering my needs. For example for my market I don’t care about retina displays at all since there is super low amount of them.

[RadModerator]

Hi Lukaz,

2000×2000 is so big, normally, X generated sizes are just between 600px to 1200px as the layout width is just almost 1200px. Unless you’re setting your layout to 2000px screen width?

Your 2000px image should be scaled based on registered image sizes. And if not and since some older uploads never get converted, then you may try using force regenerate thumbnails to resize/crop them for you.

And if you still wish to enable woocommerce image size options then follow this.

Because this requires a template change, I’d advise that you setup a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

Add this code at your child theme’s functions.php

function enable_product_settings() {
   remove_filter( 'woocommerce_product_settings', 'x_woocommerce_remove_plugin_settings' );
}

add_filter('admin_init', 'enable_product_settings', 20 );

add_action('init', 'default_woocommerce_thumbnails', 99 );

function default_woocommerce_thumbnails() {
    remove_action( 'woocommerce_before_shop_loop_item_title', 'x_woocommerce_shop_thumbnail', 10 );  
    add_action( 'woocommerce_before_shop_loop_item_title', 'x_woocommerce_shop_thumbnail_v2', 99 );
}

function x_woocommerce_shop_thumbnail_v2() {

  GLOBAL $product;

  $stack            = x_get_stack();
  $stack_thumb      = 'shop_catalog';
  $stack_shop_thumb = $stack_thumb;
  $id               = get_the_ID();
  $rating           = $product->get_rating_html();

  woocommerce_show_product_sale_flash();
  echo '<div class="entry-featured">';
    echo '<a href="' . get_the_permalink() . '">';
      echo get_the_post_thumbnail( $id , $stack_shop_thumb );
      if ( ! empty( $rating ) ) {
        echo '<div class="star-rating-container aggregate">' . $rating . '</div>';
      }
    echo '</a>';
  echo "</div>";

}

Then just use force regenerate thumbnails plugin right after changing your image sizes. Using small image is not really good, we can’t cover any issue it may cause. If you worry about performance, then caching and CDN is a good choice for hosting medium to large images.

Hope this helps.

[Nicolas ZParticipant]

Hi support,

On the same subject, I have problems with the image size of the simple product. It seems that the featured image product is not resize..
However the products lists looks fine.

I am using the last versions for X, visual composer and woocommerce shortcodes for visual composer.

I can’t find where the problem comes from.

Thanks for your help,

Greatings

[Nicolas ZParticipant]

This reply has been marked as private.

[RadModerator]

Hi Nicolas,

Conversion works, and in fact successful. Though, it’s not picking the X’s registered image sizes. It’s picking your product attachments.

These are the sizes,

//
    // Featured images.
    //
    // Theme support for featured images and thumbnail sizes.
    //

    add_theme_support( 'post-thumbnails' );
    set_post_thumbnail_size( 100, 9999 );
    add_image_size( 'entry',                   x_post_thumbnail_width(),      9999,                                   false );
    add_image_size( 'entry-cropped',           x_post_thumbnail_width(),      x_post_thumbnail_cropped_height(),      true  );
    add_image_size( 'entry-fullwidth',         x_post_thumbnail_width_full(), 9999,                                   false );
    add_image_size( 'entry-cropped-fullwidth', x_post_thumbnail_width_full(), x_post_thumbnail_cropped_height_full(), true  );

And this is what being shown,

<img width="2000" height="1333" src="http://jolane7.ch/wp-content/uploads/2015/01/08.2000.jpg" class="attachment-entry-full-ethos wp-post-image" alt="08.2000">

attachment-entry-full-ethos is from old setup as the sizing is not stack specific anymore. Could be that you have still older setting (re-saving wont fix it), or you have older customization that still uses this. Would you mind letting me know what are they? It might helpful if you can disable them while we’re testing.

If you can provide your ftp login credentials too, then that will be helpful and I can directly check your templates.

Thanks!

[Nicolas ZParticipant]

This reply has been marked as private.

[RadModerator]

Hi Nicolas,

I was able to connect once, but then got kicked out and unable to connect after the first try. There could be a firewall doing that. Please check.

And for the meantime and since new update is available, you may wish to update your copies as there are newly added fixes and feature changes. Please check this https://theme.co/x/member/forums/topic/release-notes-x-v3-2-0-x-shortcodes-v3-0-0/ before doing so. Do some backups just in case your update fails.

Thanks!

[Nicolas ZParticipant]

This reply has been marked as private.

[Nicolas ZParticipant]

Hi support !

I manage something in doing this by css :

.woocommerce li.product, .woocommerce-page li.product {
    width: 100%;
}

.woocommerce .cols-4 li.product, .woocommerce.columns-4 li.product {
    width: 30% !important;
}

I don’t know if it’s the perfect way to do this, but it seems good.
Unfortunately I have another problem with the upgrade ; the white background which i can’t find the class.
http://jolane7.ch/?page_id=90

Thanks for all,

Best regards

[Nabeel AModerator]

Hi again,

Glad you’ve sorted it out! You can change the white background by accessing the following class:

.page .site {
background-color: #333 !important;
}

Hope this helps!

[Author]

Posts