Designing The Cart Page

Creating a Custom WooCommerce Cart Page with Breakdance

This article discusses creating a custom WooCommerce shopping cart page using Breakdance.

Accessing the Cart Page in Breakdance

Opening and Editing the Cart Page

  1. On the front-end of your site, navigate to the cart page.
  2. In the WordPress admin bar, hover over ‘Breakdance’ and select ‘Open Cart’ to view the cart page in the WordPress admin panel.
  3. Finally, click “Edit in Breakdance” to edit the cart page.

Customizing the Cart Page

Adding a Cart Page Element

  1. From within Breakdance, add a Cart Page element to the page. This element displays the default WooCommerce cart.
  2. Consider using global styles for consistent branding across your site.
  3. Set brand colors in ‘Global Settings’ > ‘WooCommerce’ > ‘Colors’ for a cohesive look.

Making Specific Customizations

  1. Using the Cart Page element, you can adjust the cart layout, such as changing it to vertical or modifying the position of totals.
  2. Customize the styles of cart contents and totals, including background, borders, and shadows.
  3. Add additional elements like promotional messages or guarantees.

Finalizing the Custom Cart Page

After making the desired customizations, save the changes and preview the cart page to ensure it meets your requirements.