Support » Plugin: WooCommerce » Single Item Page Alignment Issues

  • I am having an issue with WooCommerce Single page Item thumb and Short Description area being to large and wanting to stack, I have tried resizing the Thumbnails which does not help, I have the same issue in almost any theme other than woo themes. I am wondering if there is something I can change to adjust ideally the Description area, so that I can have the images stay large and get rid of the empty space as seen in the photo. (http://www.awesomescreenshot.com/showImage?img_id=1755853)

    • This topic was modified 3 years, 1 month ago by Vitaimaging.
Viewing 9 replies - 1 through 9 (of 9 total)
  • Markup and styles vary between themes. Please post the url to a relevant page to enable the markup to be examined with browser tools.

    Try this custom css:

    
    .woocommerce div.product div.summary,
    .woocommerce-page div.product div.summary,
    .woocommerce #content div.product div.summary,
    .woocommerce-page #content div.product div.summary {
      width: 48% !important;
    }
    

    If your theme does not have a setting where you can enter custom css, you can use a plugin like this one:
    https://wordpress.org/plugins/simple-custom-css/

    That works great for the full screen display, unfortunately it breaks the mobile version forcing it all to be on half of the screen.

    Try adding this custom css for an improvement in mobile:

    
    @media only screen and (max-width:767px) {
     .product .jck-wt-all-images-wrap {
        float: none;
        width: 100%;
      }
    }
    

    However, you may need to get a developer on board to make a full job of styling at all resolutions.

    Vitaimaging

    (@vitaimaging)

    would it be possible to move the description beneath the product photo and remove the long description , reviews, and additional info?

    lorro

    (@lorro)

    In desktop, mobile or both? Would need the “Under construction” removing briefly.

    Vitaimaging

    (@vitaimaging)

    well as it is now mobile already stacks these items so no worries there It is only and issue with desktop, the code you suggested works great for desktop but breaks the mobile view, not sure if the second code did anything I didn’t see any change. Otherwise if I leave out the code the Desktop version is misaligned but the mobile version works fine. I don’t really want to use the other options beneath the product image and short description, So moving this section below and removing these items could solve both issues.

    lorro

    (@lorro)

    Has the theme changed? The markup doesn’t match what we started with. Desktop view look good here. I don’t see a description, gallery images or reviews, so it looks like you’ve fixed it.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Single Item Page Alignment Issues’ is closed to new replies.