What this is
A small stylesheet that tidies the product pages. It changes no theme files, hides nothing, moves nothing, and can be taken out again by deleting it, saving and flushing the cache (steps below). The live preview is a copy of one Posh product page, with the stylesheet switched on and off in our own browser only. The real site has not been changed.
- The spec list becomes a tidy table.
- The description is easier to read.
- The selected tab is clearly marked on computers.
- Product names in "You may also like" are no longer cut off.
- Hover effects: Add to Cart keeps its blue hover colour and gains a soft shadow (with a 1px press when clicked), the tabs light up, and the product cards lift slightly.
Plus small colour fixes so text meets accessibility contrast rules (menu, breadcrumbs, grey text). You'll barely see them, but they matter for some customers.
- In Magento Admin go to Content > Design > Configuration.
- Find the store view in the list and click Edit in its row.
- Open Other Settings > HTML Head.
- In Scripts and Style Sheets, type
<style>, paste the whole ofposh-polish.css, then type</style>:
<style> ...paste posh-polish.css here... </style>
Add it below anything already in the box. Do not delete what is there. If your store view already has its own entry in this box, edit that one: the store view's entry overrides the website or default one.
- Click Save Configuration, then flush the cache (System > Cache Management > Flush Magento Cache).
To remove it: delete what you pasted, save, and flush the cache again. The shop goes straight back to how it is now.
Adobe's own help pages give the path above (Content > Design > Configuration, then Edit on the store view, then HTML Head). Adobe's pages do not mention the cache step, which is standard Magento practice. If you only want product pages changed, leave out the section marked "PART 2: SITE-WIDE".
Stylesheets can only change how things look. These need a developer to change what is on the page:
- "inc. VAT" and the delivery cost next to the price.
- Trust badges beside Add to Cart. "FREE DELIVERY ON MOST ITEMS & ALL ORDERS OVER £500" sits in the strip at the very top of the page, a long way from a £440 product.
- Make "shower tray sold separately" stand out next to the button, on the products where that applies. It is in the text already, but it is easy to miss.
- Hide "Be the first to review" on products with no reviews.
- Visible labels on the newsletter fields. The page code has labels, but they are empty, so the only hint is the grey text (First Name, Last Name, Email) that disappears as soon as someone starts typing.