- This topic has 13 replies, 3 voices, and was last updated 8 years, 7 months ago by Andrew Misplon.
Tagged: ultra woocommerce
- AuthorPosts
- February 3, 2016 at 1:22 pm #2969
HouseofconcreteParticipantI have a problem with my WooCommerce Shop page in Ultra Theme. It doesn’t react to changes in templates e.g. to Full Width – No Title. That means the sidebar is still on the Shop page, which is the one I want to get rid of. In generel I have no oppurtinities to make changes the Shop page. The other Woocommerce pages (Cart, My Account, Checkout) works fine even with Page Builder template.
Please help. Thank you in advance.
February 3, 2016 at 4:42 pm #2973
Puro SupportKeymasterHi Houseofconcrete
Thanks for reaching out. We’ll take a look and report back shortly.
February 3, 2016 at 5:58 pm #2982
Puro SupportKeymasterThanks for the wait and for raising this challenge.
If anyone wants to use a child theme for this challenge, I’ve created one here:
https://purothemes.com/wp-content/uploads/2016/02/ultra-child-full-width-woocommerce-shop-home.zip
The child theme removes sidebar and page header for the shop page. Child themes can be installed from Appearance > Themes > Add New: Upload Theme.
Houseofconcrete, in your case, it might be easier if we use a CSS only solution. Activating a child theme causes Customizer and menu location settings to reset. This makes activating a child theme a little tiresome as you have to redo the above-mentioned settings. To try a Custom CSS only solution you’ll need a Custom CSS plugin like Simple Custom CSS. Once activated, go to Appearance > Custom CSS and insert:
/* WooCommerce */ .woocommerce.archive .entry-header { display: none; } .woocommerce.archive.sidebar #primary { border: none; width: 100%; } .woocommerce.archive.sidebar #secondary { display: none; } .woocommerce.archive.sidebar .site-content > .container { padding-top: 3.57143em; }
Hope that helps. Let us know how it goes.
February 11, 2016 at 12:17 pm #3018
HouseofconcreteParticipantSorry for this late reply. It worked very well and removed the sidebar. Thanks a lot!
However it seems I have generel problems editing my WooCommerce Shop Page. It’s like it isn’t completely compatible with the Puro Ultra Theme. Have you experienced this problem before?
February 11, 2016 at 12:39 pm #3019
Andrew MisplonKeymasterThanks for the feedback. I’d love to fix whatever problems you’ve run into. Could you perhaps provide further details on the shop page challenges you mention above. I’m sure I can solve them once I know more.
February 11, 2016 at 3:41 pm #3025
HouseofconcreteParticipantI have a problem when I go to Woocommerce settings > Products > Display, when I try to change catalog images size (or the other images settings for that matter) it doesn’t change anything on the shop page. Do you know why?
February 11, 2016 at 3:51 pm #3026
Andrew MisplonKeymasterThanks for your feedback. Ultra isn’t setting any WooCommerce image sizes. Are you regernating your thumbnails after making the image size change?
Please, see: https://docs.woothemes.com/document/using-the-appropriate-product-image-dimensions/
(Input the data and regenerate the thumbnails)
You can use the following to regen. thumbnails: https://wordpress.org/plugins/regenerate-thumbnails/
February 11, 2016 at 5:05 pm #3027
HouseofconcreteParticipantI have tried regenerating images now and still not working. All images on shop and product pages keep being the same default size. I think the problem is the same as earlier that theres a conflict between Ultra theme and the Shop page in WooCommerce. Can you provide any CSS solution like before but now just for image sizes?
Thanks in advance.
February 11, 2016 at 5:23 pm #3030
Andrew MisplonKeymasterThanks for your feedback. As far as I know, there isn’t anything in Ultra that’s setting WooCommerce image sizes. I’d be happy to test this for you. Please, use the Private Reply checkbox to send your URL and a set of temporary login details and I’ll take a look. What are the image sizes you’re changing to?
February 11, 2016 at 5:25 pm #3031
Andrew MisplonKeymasterOr, to quickly explain a little bit of the code that WooCommerce applies, please, view the below:
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product { float: left; margin: 0 3.8% 2.992em 0; padding: 0; position: relative; width: 22.05%; }
The above rule is outputted by a WooCommerce stylesheet called: woocommerce-layout-css. What it says is that each product should take up 22.05% of the page, that leaves space for four products a row. That’s why you’re not seeing a change on the shop page. How many products to want per row?
February 12, 2016 at 12:03 pm #3042
HouseofconcreteParticipantThanks once again for the support. It is really appreciated.
The above mentioned code worked fine. I would like to have three products pr. row and preferably center aligned. Can you provide the CSS style for that? That would be all from me now then.
February 12, 2016 at 9:41 pm #3053
Andrew MisplonKeymasterSorry for not being clearer. You don’t need to use the above CSS. I thought it might provide a clearer picture to show the CSS being outputted by WooCommerce. To change the products per row it’s easiest if we use a child theme, that way we can make use of the WooCommerce built-in CSS. I’ve created one here:
https://purothemes.com/wp-content/uploads/2016/02/ultra-child-woocommerce-3-rows.zip
Install from
Appearance > Themes > Add New > Upload Theme
and then activate.Activating a child theme in WordPress will, unfrotunately, cause menu location and Customizer settings to reset. Those will need to be reapplied.
Let me know how it goes.
February 14, 2016 at 12:46 pm #3059
HouseofconcreteParticipantIt’s me saying sorry for not understanding anything. I really liked the simple noobly-friendly Ultra theme design, but this Woocommerce is bad for my head 🙂
I have now applied the child theme for my site. It works fine with 3 products per row now. However I still miss the center alignment of the whole page. I have 3 products on the first row and 2 products on the second row. Especially the second row I want to align to the center.
However the child theme also changed the button colors to Woocommerce purple color. How do I change it back to theme color design?
Huge thanks once again. This will be my last requests.
February 14, 2016 at 3:20 pm #3064
Andrew MisplonKeymasterGlad to hear you’ve made progress 🙂
When activating any child theme in WordPress, unfortunately, menu location and Customizer settings will reset. If you’re using WooCommerce Colors plugin you can go back to the Customizer > WooCommerce and reapply your settings. There is unfortunately no way around the settings reset that occurs when activating a child theme.
To try change WooCommerce from a left aligned product layout to a center aligned one, try adding the following at Appearance > Custom CSS:
.woocommerce ul.products { text-align: center; } .woocommerce ul.products li.product, .woocommerce-page ul.products li.product { display: inline-block; float: none; }
- AuthorPosts
You must be logged in to reply to this topic.