Forum Replies Created

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • in reply to: Product Thumbnail to Fit Image Orientation #86435

    That did it, Nick! Thank you for all the help, brother! The site’s looking good and functioning real well.

    *Resolved*

    All the Best,

    Joe

    in reply to: Product Thumbnail to Fit Image Orientation #86433

    Sorry about that Nick – I got my definitions mixed up.

    I meant to ask about keeping the thumbnail_container but allow it to link to the product page when clicked. Would this be doable?

    Thanks for looking out!

    in reply to: Product Thumbnail to Fit Image Orientation #86431

    Thank you for all the help. With a little back and forth on the code I was able to get it to react correctly.

    Would it be possible to modify the echo “<div class=”thumbnail_container”>; code that you supplied early to take it off of the related products?

    Example

    And modify column widths to fill empty space/left-align products. So far, influencing the number of columns cuts off the product images.

    Example

    in reply to: Product Thumbnail to Fit Image Orientation #86430

    I got it all product images to fit on the shop catalog and related product sections. The process is documented below:

    1. All instances of “width:100%;height:auto;” for images in woocommerce-config > woocommerce-mod.css were removed.

    http://www.thedesignguys.co.uk/woocommerce-image-blurring-problem

    2. The below codes was placed into woocommerce-config > config.php

    //echo "<div class='thumbnail_container'>";
    echo "<div class='thumbnail_container_inner'>";
    echo get_the_post_thumbnail( get_the_ID(), 'shop_catalog thumbnail_container' );
    echo $link;
    echo "<a class='button show_details_button $extraClass' href='".get_permalink($post->ID)."'>".__('Show Details','avia_framework')."</a>";
    if(!empty($rating)) echo "<span class='rating_container'>".$rating."</span>";

    echo "</div>";
    //echo "</div>";
    }

    3. Image parameters were placed into woocommerce-config > woocommerce-mod.css via this code. (this instance was for images with a 300px max-width)

    .attachment-shop_catalog.thumbnail_container.wp-post-image {max-width:300px; height:auto; max-height:300px; width:auto;}

    4. Image parameters for related products/upsells were placed into the same document, woocommerce-config > woocommerce-mod.css

    .related ul.products li.product img, .upsells.products ul.products li.product img, .related ul li.product img, .upsells.products ul li.product img{ height:100%; height:150px;  width:auto; max-width:600px;
    }

    in reply to: Product Thumbnail to Fit Image Orientation #86428

    Hey Nick,

    I love that code. I think it’s doing something really good. It cleaned up a lot on the hover and I really appreciate the static ‘show details’ button. Now I feel there is an image constraint issue left. It seems like the prior code you supplied is accommodating varying product image dimensions, it just may now call for some sort of height-max? They do exist in my Woocommerce and WordPress settings, but don’t seem to be affecting these.

    What do you think?

    Example [1]

    Example [2]

    Example [3]

    Again, thank you so much.

    in reply to: Product Thumbnail to Fit Image Orientation #86426

    Hey Nick/Crew,

    I went through the link you mentioned and followed the instructions. I went into the WordPress Media Settings as well and turned off ‘hard crop’. This did a pretty good job after I re-uploaded the images. I made a few other customizations to the code and have attempted further ones.

    There are only two things left which I am sure are minor corrections, but tough for me to figure out. Here’s what is left:

    – I would like to fit the product thumbnail containers to the product images contained within them. Also, the height of the landspace product image container is larger.

    Example

    – I am finding that the lanscape product image is not accommodated width-wise on the product page layout. Perhaps there is a max/min value that would do it?

    Example

    Again, if there is more information required, let me know. I feel like I’m just over-looking a set of values and may have to deal with values on the product page coding.

    Thank you again.

Viewing 6 posts - 1 through 6 (of 6 total)