Product setup
Match PressFlow to your shop without overwhelming it
Choose restrained front-end and admin colours, accessible button text and a product-page layout.
Guide source reviewed for PressFlow 1.25.1.
Open WooCommerce → PressFlow welcome → Colours, layout & content. Front-end and back-end colour settings are independent, so you can match the customer experience to your shop while keeping staff screens clear.
What each colour does
| Setting | Use |
|---|---|
| Accent | Main actions, selected price cells and selected-state details. |
| Text on accent | Text and icons on filled accent controls. |
| Main text / ink | Headings and ordinary reading text. |
| Background / paper | The neutral base for the interface. |
Start with your brand accent, a dark text colour and a light neutral background. Keep everyday navigation and large surfaces quiet. The accent should make the next action and selected choice easy to find.
PressFlow checks the foreground/background contrast for action controls. It can adjust an unsuitable pairing to maintain readable contrast. White works well on many midtone brand colours; a very pale accent may need dark text. The chosen background can differ slightly from the input swatch when contrast correction is necessary.
Choose a layout
- Sidebar: options alongside a summary that stays visible on suitable desktop screens.
- Stacked: the summary follows the options.
- Cards: a more compact two-column option layout on desktop.
Small screens collapse to a single column. Use the global welcome setting for the default. Override an individual product through Product data → General → PressFlow page layout when a product needs a different presentation.
Check the complete journey
After saving, check a selected graphical option, a selected quantity/date price, the main basket button, focus outlines and a disabled control. Check mobile and desktop. Test with your actual theme active: some themes apply very broad button rules, so a custom stylesheet may still need a narrowly scoped override.
Do not use colour as the only signal. Selected choices also have explicit markers, price choices carry selected state and actions retain readable labels. Keep custom icon and text overrides consistent with those states.
Related: Product content, Developer styling, Launch checklist.
Example screen
Illustrative screen using sample shop content. Your products, prices and available controls depend on the shop configuration.
Need a hand?
Contact the PressFlow team with details of what you are trying to do.