Home Forums Weaver Xtreme Theme Cannot Center Woocommerce Shop items

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #64773
    taffy
    Participant

    Hello!

    I’ve googled for css and tried to use many suggestions to center align the products in my shop page using Custom CSS (I tried Additional CSS – WP Setting as well as some others) to no avail. Only two products so far, and they are left aligned. No luck searching Woocommerce support (yet) See:

    https://dixieaaoffice.com/dco-store/

    Any suggestions appreciated. Thanks!

     

    #64775
    scrambler
    Moderator

    Are you trying to center the three items in the page, or center the product description at the bottom?

    The first one would not be very useful as ultimately you will have more product and they will take the whole space.

    #64777
    taffy
    Participant

    Thanks Scrambler

    I was asked to center the three items (not the descriptions underneath), but you are right – eventually there might be more items later on. We’re going to trash the first test item soon, leaving the two which will be over to the left. Not sure if it would hurt to have items centered even if products grow to more than one line or if centering would have a negative effect later. But if it were just pasting in some CSS I could always delete it later. Any ideas would be appreciated. Roger

    #64783
    scrambler
    Moderator

    Doing that would necessitate top undo woocomerce styling and redo it differently and may cause problems when you will have more products on several rows

    .woocommerce .products ul, .woocommerce ul.products {text-align:center;}
    .woocommerce ul.products li.product, .woocommerce-page ul.products li.product {float:none;display:inline-block;}

    But that may break other part of the site

    #64804
    Weaver
    Keymaster

    Note: We’ve just discovered a problem with how Weaver lays out products on a shop page depending on the sidebar layout you use. This may or may not be relevant to your issue described here.

    This will be fixed in a new release of Weaver Xtreme within a week.

    #64809
    MikeDrum
    Participant

    This might not help long term, but I just used Woocommerce short codes instead of actual pages.

    #64810
    taffy
    Participant

    Thanks MikeDrum. Using shortcodes still does not allow formatting such as centering. I did a test page using [products] shortcode, centering it on the page. All are still left justified.

    At this point I will tell our team it’s not practical to center products. It’s really not that important and there is no easy risk-free fix. Thanks to Scrambler and the forum.

    #64813
    Weaver
    Keymaster

    Are you talking about products on the shop page (where multiple items are listed), or on a single item’s page (WordPress single page view of a post – which is actually what Woo each Woo product is)?

    If the latter, it is possible there may be issues until the new version of Weaver Xtrem is released later this week.

    #64815
    taffy
    Participant

    shop page.

    #64840
    Weaver
    Keymaster

    I don’t think that is anything that can be easily controlled by the theme or custom css.

    Woocommerce wraps the product list in <ul class=”products columns-6″>. There seems to also be rules for switching to 2 columns for mobile devices.

    There might be options in Woo to set these, or you could contact Woo support to see if they have custom css or other ways to change the layout of the products on the shop page.

     

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.