Background color & product height adjustment

This topic has 10 replies, 2 voices, and was last updated 8 years, 1 month ago ago by Eva Kemp

  • Avatar: sotart
    sotart
    Participant
    February 23, 2016 at 11:58

    Hello,
    I have the following issues (http://imgur.com/RMCitNV):

    1. I changed the theme background to gray and
    a. there is a strange white border around the menu items and
    b. the first page number is totally black.
    c. Also although I have chosen a black background on the footer, it now shows as gray

    2. The products (paintings in my case) have different sizes and I see that the theme maintains a fixed pixel width and creates a proportional height. Can we change this and fix the height and have a proportional width? It will look much better.

    3. There is a sorting menu on the top left side. From where can I hide it or change the items in it?

    Thank you in advance

    Please, contact administrator
    for this information.
    9 Answers
    Avatar: Eva
    Eva Kemp
    Support staff
    February 23, 2016 at 12:33

    Hello,

    1. a). Please add this code in Theme Options > Custom CSS > Global Custom CSS:

    .header-type-12 .navbar-collapse .menu > li > a {
       border-left: none;
    }
    .header-type-12 .navbar-collapse .menu > li:last-child > a {
        border-right: none;
    }

    b). Use this code in Global Custom CSS:

    .pagination-cubic li span.page-numbers.current {
       background-color: transparent;
    }

    c). I’ve changed background color in static block row settings http://storage2.static.itmages.com/i/16/0223/h_1456226971_4221121_04b49a52d1.png

    2. Sorry, but there is no such option, you can only set specific height in Custom CSS for desktop section:

    .product-content-image img {
        height: 250px;
    }

    Also you can try to write “width” value and adjust values to your needs.

    3. To hide Woocommerce filter use this code in Global Custom CSS:

    .filter-wrap .woocommerce-ordering {
       display: none;
    }

    Regards,
    Eva Kemp.

    Avatar: sotart
    sotart
    Participant
    February 23, 2016 at 14:09

    Hello Eva & thank you for the so far corrections.

    1. The white frame around the menu remained there.
    2. As for the width/height issue, there must be something in the code that keeps the width fixed and distorts the image when the height is also fixed. IF we cannot find a way to bypass this issue, can we have an alternative image as thumbnail?
    3. On a single product page the title “Product description” is on white background and black letters, can I have gray background and white letters?
    4. There is a fixed menu header that follows the user when he scrolls, how to change the background color?
    5. On a single product page on the thumbnail there is the round button to create a full screen image. Its color is gray and blends in with the paintings. Here can I go and change color of the image?

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    February 23, 2016 at 15:36

    Hello,

    1. I fixed it. Please check menu now.

    2. Unfortunately there is no such option. You may refer to these articles:
    https://docs.woothemes.com/document/using-the-appropriate-product-image-dimensions/
    https://premium.wpmudev.org/forums/topic/how-can-i-custome-and-fix-woocommerce-product-image-size

    3. Use this code in Global Custom CSS:

    .meta-title {
       color: white !important;
    }
    .meta-title span {
         background: grey;
    }

    4. Add this code in Global Custom CSS:

    .fixed-header-area {
      background-color: #FFF;
    }

    Write your color value.

    5. You can change background color of that icon using this css code:

    .product-lightbox-btn {
       background-color: white;
    }

    Regards,
    Eva Kemp.

    Avatar: sotart
    sotart
    Participant
    February 23, 2016 at 16:17

    Hello & thank you for the so far help,

    1. On a single product page on the thumbnail there is the round button to create a full screen image. After changing the background color, the button does not work.

    2. Sometimes I press F5 or Ctrl+F5 to refresh and the changes do not appear. Is there a way to hard refresh?

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    February 23, 2016 at 16:59

    Hello,

    1. As I see it’s working fine:
    http://storage6.static.itmages.com/i/16/0223/h_1456243106_8954919_909dea9124.png
    Try to check it in another browser.

    2. There is no such option in the theme. It may be related to your browser or information is cached on a server of your hosting provider.

    Regards,
    Eva Kemp.

    Avatar: sotart
    sotart
    Participant
    February 24, 2016 at 10:09

    Hello,

    Regarding the catalogue/category thumbnails, as mentioned before by fixing the height of the thumbnails the images gets distorted. I tried in the woocommerce settings to crop images. It may not show the entire painting but at least it will avoid distortion. The problem is that the theme is not responding to the cropping! Am I doing something wrong? Will the cropping take place only in the catalogue/category images? I want to avoid the cropping in the single product page

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    February 24, 2016 at 10:30

    Hello,

    As I see images on single product pages aren’t cropped, only in catalog pages.
    Do you have problems on single product pages?

    Regards,
    Eva Kemp.

    Avatar: sotart
    sotart
    Participant
    February 25, 2016 at 22:09

    Hello Eva,

    For instance, in the http://www.sotart.com/product-category/compositions/
    all the images are distorted as the height is fixed by CSS and the width is fixed by woocommerce’s code. So a rectangular image gets squashed to a square one. I thought maybe there is a way to crop the images in the categories and NOT on the single product page. The woocommerce has some options on cropping but I did not notice any difference even when I regenerated the thumbnails

    Please, contact administrator
    for this information.
    Avatar: Eva
    Eva Kemp
    Support staff
    February 26, 2016 at 09:58

    Hello,

    In this case you have to remove fixed height value. If your original images have different dimensions they will be displayed differently on Shop page.
    You can check your products page with default Woocommerce theme Storefront https://www.woothemes.com/storefront/ too and you’ll see the default images behavior in Woocommerce theme.
    So this issue isn’t related to our theme. If you want all images to be displayed similarly they should have approximately similar sizes.

    Regards,
    Eva Kemp.

  • Viewing 10 results - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.