Filter by Attribute not showing Gutenberg Site Editor
-
I’m customising both my archive-product and Product by Category templates in the site editor. The Filter by Attributes block is visible in the editor showing the number of products with the attribute applied etc as per screenshots below. However when viewing the archive pages on the frontend the Filter by Attributes appears then quickly disappears and there is the hidden attribute applied to the container div. Also the attribute container div is empty.
I really need to customise the archive pages but is that why this feature is not available? How can I work around this? Does it add a query variable to the URL to show those products? What are the work arounds?
Woocommerce 8.0.2
WordPress 6.3
Gutenberg plugin not activated (not sure if it is needed to get this working)https://imgtr.ee/image/3ejXj
https://imgtr.ee/image/3eJMM
https://imgtr.ee/image/3ei1u
-
Hello @mikednz,
Thank you for reaching out!
Could you please attach a copy of your site’s System Status report? You can find it via WooCommerce > Status. Select “Get system report” and then “Copy for support” (after you scroll down a bit)”. Once done, please paste it here in your reply or via a text-sharing service like https://gist.github.com/.
Look forward to hearing back from you.Thanks pasted below. I also have another issue where every product has these four error blocks appearing.
` WordPress Environment WordPress address (URL): https://170.64.145.15<br>Site address (URL): https://170.64.145.15<br>WC Version: 8.0.2<br>REST API Version: ? 8.0.2<br>WC Blocks Version: ? 10.6.5<br>Action Scheduler Version: ? 3.6.1<br>Log Directory Writable: ?<br>WP Version: 6.3<br>WP Multisite: –<br>WP Memory Limit: 256 MB<br>WP Debug Mode: –<br>WP Cron: ?<br>Language: en_US<br>External object cache: – Server Environment Server Info: Apache/2.4.57 (Unix) OpenSSL/3.0.2<br>PHP Version: 8.0.30<br>PHP Post Max Size: 1 GB<br>PHP Time Limit: 30<br>PHP Max Input Vars: 5000<br>cURL Version: 7.81.0<br>OpenSSL/3.0.2 SUHOSIN Installed: –<br>MySQL Version: 8.0.34-0ubuntu0.22.04.1<br>Max Upload Size: 512 MB<br>Default Timezone is UTC: ?<br>fsockopen/cURL: ?<br>SoapClient: ?<br>DOMDocument: ?<br>GZip: ?<br>Multibyte String: ?<br>Remote Post: ?<br>Remote Get: ? Database WC Database Version: 8.0.2<br>WC Database Prefix: wp_<br>Total Database Size: 22.22MB<br>Database Data Size: 16.16MB<br>Database Index Size: 6.06MB<br>wp_woocommerce_sessions: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_woocommerce_api_keys: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_woocommerce_attribute_taxonomies: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_woocommerce_downloadable_product_permissions: Data: 0.02MB + Index: 0.06MB + Engine InnoDB<br>wp_woocommerce_order_items: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_woocommerce_order_itemmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_woocommerce_tax_rates: Data: 0.02MB + Index: 0.06MB + Engine InnoDB<br>wp_woocommerce_tax_rate_locations: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_woocommerce_shipping_zones: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_woocommerce_shipping_zone_locations: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_woocommerce_shipping_zone_methods: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_woocommerce_payment_tokens: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_woocommerce_payment_tokenmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_woocommerce_log: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_actionscheduler_actions: Data: 1.52MB + Index: 0.61MB + Engine InnoDB<br>wp_actionscheduler_claims: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_actionscheduler_groups: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_actionscheduler_logs: Data: 0.38MB + Index: 0.34MB + Engine InnoDB<br>wp_commentmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_comments: Data: 0.02MB + Index: 0.09MB + Engine InnoDB<br>wp_gf_draft_submissions: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_gf_entry: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_gf_entry_meta: Data: 0.02MB + Index: 0.05MB + Engine InnoDB<br>wp_gf_entry_notes: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_gf_form: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_gf_form_meta: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_gf_form_revisions: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_gf_form_view: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_gf_rest_api_keys: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_links: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_options: Data: 4.08MB + Index: 0.13MB + Engine InnoDB<br>wp_pmxi_files: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_pmxi_hash: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_pmxi_history: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_pmxi_images: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_pmxi_imports: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_pmxi_posts: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_pmxi_templates: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_postmeta: Data: 2.52MB + Index: 2.97MB + Engine InnoDB<br>wp_posts: Data: 6.14MB + Index: 0.31MB + Engine InnoDB<br>wp_term_relationships: Data: 0.08MB + Index: 0.05MB + Engine InnoDB<br>wp_term_taxonomy: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_termmeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_terms: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_usermeta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_users: Data: 0.02MB + Index: 0.05MB + Engine InnoDB<br>wp_wc_admin_note_actions: Data: 0.06MB + Index: 0.02MB + Engine InnoDB<br>wp_wc_admin_notes: Data: 0.08MB + Index: 0.00MB + Engine InnoDB<br>wp_wc_category_lookup: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_wc_customer_lookup: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_wc_download_log: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_wc_order_addresses: Data: 0.02MB + Index: 0.06MB + Engine InnoDB<br>wp_wc_order_coupon_lookup: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_wc_order_operational_data: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_wc_order_product_lookup: Data: 0.02MB + Index: 0.06MB + Engine InnoDB<br>wp_wc_order_stats: Data: 0.02MB + Index: 0.05MB + Engine InnoDB<br>wp_wc_order_tax_lookup: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_wc_orders: Data: 0.02MB + Index: 0.11MB + Engine InnoDB<br>wp_wc_orders_meta: Data: 0.02MB + Index: 0.03MB + Engine InnoDB<br>wp_wc_product_attributes_lookup: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_wc_product_download_directories: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_wc_product_meta_lookup: Data: 0.09MB + Index: 0.13MB + Engine InnoDB<br>wp_wc_rate_limits: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_wc_reserved_stock: Data: 0.02MB + Index: 0.00MB + Engine InnoDB<br>wp_wc_tax_rate_classes: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_wc_webhooks: Data: 0.02MB + Index: 0.02MB + Engine InnoDB<br>wp_wt_iew_action_history: Data: 0.05MB + Index: 0.00MB + Engine InnoDB<br>wp_wt_iew_mapping_template: Data: 0.02MB + Index: 0.00MB + Engine InnoDB Post Type Counts acf-field: 1<br>attachment: 589<br>nav_menu_item: 9<br>page: 13<br>post: 7<br>product: 357<br>product_variation: 239<br>revision: 231<br>wp_block: 1<br>wp_global_styles: 4<br>wp_navigation: 6<br>wp_template: 9<br>wp_template_part: 1 Security Secure connection (HTTPS): ?<br>Your store is not using HTTPS. Learn more about HTTPS and SSL Certificates.<br>Hide errors from visitors: ? Active Plugins (8) Gravity Forms: by Gravity Forms – 2.7.12<br>Accordion Blocks: by Phil Buchanan – 1.5.0<br>Create Block Theme: by www.remarpro.com – 1.13.2<br>The Icon Block: by Nick Diego – 1.6.0<br>SVG Support: by Benbodhi – 2.5.5<br>WooCommerce Payments: by Automattic – 6.3.2<br>WooCommerce: by Automattic – 8.0.2<br>WP Migrate Lite: by WP Engine – 2.6.8 Inactive Plugins (4) Gutenberg: by Gutenberg Team – 16.4.0<br>Timber: by Jared Novack + Upstatement – 1.22.1<br>W3 Total Cache: by BoldGrid – 2.4.1<br>WooCommerce Eway Payment Gateway: by WooCommerce – 3.7.0 Settings API Enabled: –<br>Force SSL: –<br>Currency: NZD ($)<br>Currency Position: left<br>Thousand Separator: ,<br>Decimal Separator: .<br>Number of Decimals: 2<br>Taxonomies: Product Types: external (external)<br>grouped (grouped)<br>simple (simple)<br>variable (variable) Taxonomies: Product Visibility: exclude-from-catalog (exclude-from-catalog)<br>exclude-from-search (exclude-from-search)<br>featured (featured)<br>outofstock (outofstock)<br>rated-1 (rated-1)<br>rated-2 (rated-2)<br>rated-3 (rated-3)<br>rated-4 (rated-4)<br>rated-5 (rated-5) Connected to WooCommerce.com: –<br>Enforce Approved Product Download Directories: ?<br>HPOS feature screen enabled: –<br>HPOS feature enabled: –<br>Order datastore: WC_Order_Data_Store_CPT<br>HPOS data sync enabled: – WC Pages Shop base: #1214 - /shop/<br>Cart: #1215 - /cart/<br>Checkout: #1216 - /checkout/<br>My account: #1217 - /my-account/<br>Terms and conditions: ? Page not set Theme Name: Nurse Maude Block<br>Version: 0.0.1<br>Author URL:<br>Child Theme: ? – If you are modifying WooCommerce on a parent theme that you did not build personally we recommend using a child theme. See: How to create a child theme<br>WooCommerce Support: ? Not declared Templates Overrides: – Admin Enabled Features: activity-panels<br>analytics<br>product-block-editor<br>coupons<br>core-profiler<br>customer-effort-score-tracks<br>import-products-task<br>experimental-fashion-sample-products<br>shipping-smart-defaults<br>shipping-setting-tour<br>homescreen<br>marketing<br>mobile-app-banner<br>navigation<br>onboarding<br>onboarding-tasks<br>remote-inbox-notifications<br>remote-free-extensions<br>payment-gateway-suggestions<br>shipping-label-banner<br>subscriptions<br>store-alerts<br>transient-notices<br>woo-mobile-welcome<br>wc-pay-promotion<br>wc-pay-welcome-page Disabled Features: minified-js<br>new-product-management-experience<br>product-variation-management<br>settings<br>async-product-editor-category-field Daily Cron: ? Next scheduled: 2023-08-23 00:06:29 +00:00<br>Options: ?<br>Notes: 91<br>Onboarding: completed WooCommerce Payments Version: 6.3.2<br>Connected to WPCOM: No<br>Blog ID: -<br>Account ID: - Action Scheduler Complete: 1,782<br>Oldest: 2023-07-23 10:11:18 +0000<br>Newest: 2023-08-22 21:07:50 +0000 Failed: 8<br>Oldest: 2023-03-16 00:37:01 +0000<br>Newest: 2023-08-17 22:59:05 +0000 Pending: 1<br>Oldest: 2023-08-23 00:57:21 +0000<br>Newest: 2023-08-23 00:57:21 +0000 Status report information Generated at: 2023-08-22 21:38:12 +00:00<br>`
Hi @mikednz!
For the filters to work as expected, you must also add the Products block to your post or template; otherwise, nothing is displayed on the front end since there are no products to filter out the results.
Thanks @patriciahillebrandt yes I have a custom query loop as I want to be able to customise the output of the products loop so I have made a custom filter that simply changes the query variable to filter products.
Is there anyway to still have access to the filter block with a custom query instead of the products loop?
Also can you help with my second question about these broken blocks? Your site doesn’t include support for the “woocommerce/product-tab” block.
I have the following in my functions.php do I not need this anymore?
function wplook_activate_gutenberg_products($can_edit, $post_type){ if($post_type == 'product'){ $can_edit = true; } return $can_edit; } add_filter('use_block_editor_for_post_type', 'wplook_activate_gutenberg_products', 10, 2);
Hello @mikednz,
Thank you for reaching out!Thanks @patriciahillebrandt yes I have a custom query loop as I want to be able to customise the output of the products loop so I have made a custom filter that simply changes the query variable to filter products.
Is there anyway to still have access to the filter block with a custom query instead of the products loop?
WooCommerce blocks don’t use the same hooks as normal theme templates.
If you are working on creating a custom solution with WooCommerce blocks,?kindly refer to this section of the development repository. If you require assistance from a developer,?please check our list of trusted WooExpert agencies. ??
Also can you help with my second question about these broken blocks? Your site doesn’t include support for the “woocommerce/product-tab” block.
I have the following in my functions.php do I not need this anymore?
Are you trying to enable the block editor for WooCommerce products?
If so, kindly note that Gutenberg support hasn’t arrived to WooCommerce products yet. If you’d like to edit the layout of certain products using blocks, you can use a block-based theme like twenty twenty-three.
Link to image: https://d.pr/i/I4MRzwTo learn more about FSE themes, please check https://fullsiteediting.com/themes/.
Let us know if you have any other questions. :?)It’s been a while since you responded, so I’m marking this as resolved – we’ll be here if/when you need us.
- The topic ‘Filter by Attribute not showing Gutenberg Site Editor’ is closed to new replies.