Home › Forums › Weaver Xtreme Theme › Cannot Center Woocommerce Shop items
- This topic has 9 replies, 4 voices, and was last updated 2 years, 1 month ago by
Weaver.
-
AuthorPosts
-
July 9, 2020 at 15:43 UTC - Views: 38 #64773
taffy
ParticipantHello!
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!
July 9, 2020 at 23:25 UTC - Views: 32 #64775scrambler
ModeratorAre 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.
July 10, 2020 at 00:14 UTC - Views: 29 #64777taffy
ParticipantThanks 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
July 10, 2020 at 16:15 UTC - Views: 31 #64783scrambler
ModeratorDoing 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
July 11, 2020 at 19:40 UTC - Views: 21 #64804Weaver
KeymasterNote: 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.
July 12, 2020 at 11:13 UTC - Views: 23 #64809MikeDrum
ParticipantThis might not help long term, but I just used Woocommerce short codes instead of actual pages.
July 12, 2020 at 14:00 UTC - Views: 14 #64810taffy
ParticipantThanks 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.
July 12, 2020 at 16:09 UTC - Views: 13 #64813Weaver
KeymasterAre 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.
July 12, 2020 at 16:31 UTC - Views: 8 #64815taffy
Participantshop page.
July 16, 2020 at 21:19 UTC - Views: 12 #64840Weaver
KeymasterI 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.
-
AuthorPosts
- You must be logged in to reply to this topic.