Designing The Shop Page

Creating a Custom WooCommerce Shop or Category Archive Page with Breakdance

This guide covers creating a  WooCommerce shop or category archive page in Breakdance. You can start with the default shop page in Breakdance and customize it to add elements like category information and shop filters.

Customizing the Shop Page

Accessing Breakdance Templates

1. Go to the WordPress admin and navigate to Breakdance > Templates.
2. Select ‘Add Template’ and choose ‘Shop Page and All Product Archives’.
3. Edit the template in Breakdance.

Creating a Two-Column Shop Page

1. Add a Columns element and set it to two columns.
2. Adjust the left column size to 30% width and add a Shop Filters element to it.
3. Add a Shop Page element to the right column.
4. Customize the Shop Page element and Shop Filters element to meet your needs.
5. Save the changes made in Breakdance.
6. Preview the custom shop page on the front end to see the applied filters and layout.

Applying Global Styles

It is recommended to use global styles for consistent branding across the site. This includes customizing colors, button styles, and other elements in the Global Settings > WooCommerce section.