themes
themes copied to clipboard
Automattic
Blockbase: WooCommerce templates
Changes proposed in this Pull Request:
This PR styles the new block templates for Woo. To test this follow the instructions over at https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/4926 (Note: I had to use version 6.3.2 of the woo blocks plugin to get this working)
I added the mini cart next to the site title because I don't think we can add it into the navigation block yet. The position could use adjusting but I think we need to improve Blockbase header anyway because of https://github.com/Automattic/themes/issues/5078
I found some bugs that I avoided using the following:
- Woo 6.0.0 beta (https://downloads.wordpress.org/plugin/woocommerce.6.0.0-beta.1.zip)
- WC blocks v 6.4.0 (https://github.com/woocommerce/woocommerce-gutenberg-products-block/releases/tag/v6.4.0)
Product page:
Archive page (note: this doesn't show wide aligned with this PR until https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5230 is resolved):
Mini cart:
I opened the following upstream:
- https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5229
- https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5230
Looks like the archive template is being overridden by the taxonomy ones, I'm waiting on feedback to see if this is intended or not.
What stops us from using the templates added by WC?
We don't have to do anything for those to be available as soon as you install the plugin. This PR just ads wide width to them so they look better than the normal width that they get if we don't modify them.
In fact, the next step after this is to audit the rest of the templates that exist but are not block based already and check how they interact with the theme's CSS (I've seen that our padding for inputs make them too big in the checkout pages for example)
Exciting to see Blockbase adding support for WooCommerce. And thanks @MaggieCabrera for opening those issues in our repo!
I added the mini cart next to the site title because I don't think we can add it into the navigation block yet.
Right, there is some more info about this here: https://github.com/WordPress/gutenberg/issues/31387. I also wanted to mention that the Mini Cart block is still in development, so I'm not sure if it's safe to start using it in template parts given that it hasn't been released yet.
Related to that, is there any way to make the Mini Cart block to dynamically appear in the header only if WooCommerce is installed?
Right, there is some more info about this here: WordPress/gutenberg#31387. I also wanted to mention that the Mini Cart block is still in development, so I'm not sure if it's safe to start using it in template parts given that it hasn't been released yet.
Thanks for the link! This is an initial exploration so we are not adding anything yet, but thanks for letting us know. Also, having it in the navigation block would be ideal! I tried to add it there but it didn't show up for me.
Related to that, is there any way to make the Mini Cart block to dynamically appear in the header only if WooCommerce is installed?
Not from a theme perspective that I know of! From what I know, if a block is on a theme and the plugin is not present or not the version that includes the block, the user gets a "this block couldn't be found" on a placeholder instead.
Hi! I wanted to ask if there was any chance of adding in the menu into the WooCommerce templates? Right now for users with Blockbase child themes on their site, there's no menu showing up in the header.
This is how it looks on a jurassic ninja site, with WP 5.8.2, WooCommerce 6.0.0 and Gutenberg 12.0:
Here's my atomic site for comparison:
There's also a "sidebar" consistently appearing at the bottom of WooCommerce pages (but not others) with Blockbase:
Also, the site title on Woo pages is missing the site title class assigned to the H1 element on other template pages:
Woo template:
regular page template::
User report: 4641737-zen
@sophiegyo could you test with WooCommerce 6.1 RC2? Looking at your screenshots, it seems like block templates are not loading correctly. There have been some recent changes in WP 5.9 that made WC 6.0 not to properly detect block themes. We are looking into fixing this in WC 6.1.
@Aljullu I tested the RC on a jurassic.ninja site (I couldn't load the RC on Atomic, even with the Beta Tester plugin, as it kept switching to 6.0) and I couldn't reproduce the issues @sophiegyo described.
Here's a product page for reference:
Currently, the default Single Product template for Blockbase has a broken Quantity Element.
Screenshot: https://d.pr/i/Jz5L1J
@MaggieCabrera should I report it as a separate bug, or is this included in this PR?