How to Keep WooCommerce Layouts Exactly Like Storefront Theme in Blockbase

  • Hey everyone,

    I’m working on a custom block theme using Blockbase and trying to recreate some WooCommerce layouts exactly like they look in the Storefront theme. I’ve got two test sites – one with Storefront and another with Blockbase. The Storefront site is fully designed, and I want to match that design on my Blockbase site.

    The main issue is that the Blockbase theme styles are messing up my WooCommerce layouts. Take the my account page, for example. When I compare the two sites, the layouts look completely different. I want the my account page to look identical to the one in the Storefront theme.

    Is there a way to stop my theme’s styling from interfering with the WooCommerce layout? I’d love some advice on how to keep the original Storefront look.

    Any help would be great. Thanks in advance!

    (first image is from the storefront theme and the other is from the blockbase theme.)
    (ignore that the sidebar is to the right)

    https://ibb.co/1tmLNRDY

    https://ibb.co/G3x0FtQp

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hey @adahdb ,

    I see you’re looking to recreate the WooCommerce layouts from the Storefront theme within a Blockbase-based custom block theme. That makes sense, but I can understand why you’re running into challenges. Since both themes have their own built-in styling, their layouts won’t match perfectly out of the box.

    Both Storefront and Blockbase use the [woocommerce_my_account] shortcode but apply their own styling to match their design. So, if the My Account page looks different in Blockbase, that’s expected due to the theme’s styling.

    If you’d like to make Blockbase’s My Account page look more like Storefront’s, you’ll need to apply some custom CSS to adjust the styling or hide fields you don’t want to display.

    While we’re unable to provide custom code under our Support Policy, you might find help through Codeable or a Certified WooExpert if you need assistance with the implementation.

    I hope this helps point you in the right direction!

    Thread Starter adahdb

    (@adahdb)

    Hello.
    Thanks for the reply.

    Wouldnt it be possible to somehow just disable my themes styling for some blocks or pages? Out of the box, the my account shortcode should have the same design as the storefront one no? Also, where do i find the css for the woocommerce my account shortcode to replicate it? Or does the shortcode not have its own css styling and it just follows the global woocommerce css styling?

    Hello adahdb,

    Thank you for your reply.

    Your questions are related to customization and code changes, therefore they fall outside the scope of our support policy.

    You post these questions at the Woo Community Slack for answers from the WooCommunity community. Alternatively, you may also consult a professional WooCommerce developer. You can find a good developer at Codeable.io or WooExperts.

    Please let me know if you have any questions.

    Have a great day!

Viewing 3 replies - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.