Styling

The Styling features make it easy to customize Commerce7’s CSS styling variables in the WordPress admin panel, without needing to edit code.

All the settings from the documentation page Overriding Commerce7 Styles are exposed for General, Forms, Buttons, Messages, Header, and Account Blocks.

A new Styling section, Store, is included for styling the collections and products pages.


Additional Styling Settings

In addition, several new settings are also included for extra customization styling of buttons, the header, and store pages.

Buttons

Additional styling under Buttons includes:

  • Primary button text hover color
  • Primary button border width
  • Primary button border style
  • Primary button border color
  • Primary button border hover color
  • Alt button text hover color
  • Alt button border width
  • Alt button border style
  • Alt button border color
  • Alt button border hover color

Header

Additional styling under Header support an alternative header theme, enabling a different header style presentation. These styles include:

  • Alt header text color
  • Alt header notification
  • Alt header cart count background
  • Alt header cart count background focus
  • Alt header cart count text color
  • Alt header side cart shadow
  • Alt header dropdown shadow
  • Alt header dropdown hover

Find out more about using the Alt Header.

Store

Additional styling under Store enables customizing the collections and products pages. These styles include:

  • Collections background color
  • Collections product background color
  • Collections product background hover color
  • Collections product outline
  • Collections product outline hover
  • Collections product shadow
  • Collections product shadow hover
  • Products background color
  • Products details background color
  • Products image background color
  • Products sidebar background color