Brizy disabling WooCommerce CSS grid when using ShortCode

Jay Ian Birbeck

• April 05, 2023 14:18

Hello!

A shortcode used for displaying WooCommerce products has started malfunctioning on my client's website. Instead of showing the expected 4 columns using the WooCommerce shortcode ([products limit="8" columns="4" orderby="oldest"]), it now displays a single blurry column.

This worked without issue for over a year but recently started causing problems. Upon examination, it appears that the CSS breakage originates from the Brizy editor, as it forcibly disables the CSS grid for these products. Please see the attached screenshot. Is there a way to deactivate this CSS? I tried overriding but since it's marked as '!important,' that has proven difficult. Thanks!

0

• 

  KC George

  • April 05, 2023 17:02
  • Edited

  Hi Jay,

  We apologize for this inconvenience. I will report this issue and we will work on fixing it. In the interim, please implement this work around.

  • Create a new page in Gutenberg to be set as homepage later
  • Add the shortcode block in Gutenberg and paste the woocommerce shortcode
  • Under Brizy Template, please add a Page Template and select the page you have just added in Step 1. Publish the template and click on 'Edit with Brizy'.
  • Import your homepage design to this new page 
  • Use the Brizy 'Content' element to display the woocommerce shortcode content  

  Please watch this video for more detailed procedure. https://jmp.sh/eHMTlasp 

  1
• 

  Jay Ian Birbeck

  • April 06, 2023 12:00

  Hi KC,

  Your solution worked perfectly; thanks!

   

  0

Please sign in to leave a comment.