Features
Integrations Pricing Developers Guides

Design your storefront your way

Replace the built-in hero and promo bands with your own HTML and CSS.

Selling 1 min read 4 steps 1 screenshots

The header, product grid and footer stay ours. The band above your products and the band below them are yours to design, with placeholders that fill in your real figures.

1

Open the design studio

Design storefront sits beside View store on the Foocommerce page. It has its own page because two code editors and a live preview never fitted beside the catalogue.

app.paysana.co
The design studio: pick a band, write HTML and CSS, and preview it with your own figures.
The design studio: pick a band, write HTML and CSS, and preview it with your own figures.
2

Pick a band and start from the current one

Choose the welcome section (above your products) or the promo section (below them). Load current design drops the shipped markup in, so you are never starting from an empty box.

3

Use the placeholders

Tokens fill in your shop name, product and customer counts, order count and your bestseller’s name, price, image and sold count — so a custom band still shows real numbers rather than lorem.

4

Preview, then publish

The live preview substitutes the same placeholders the real shop does. Leave a band empty and the built-in design stays — that is how "do nothing, lose nothing" works without a second on/off switch.

Worth knowing

  • Scripts, forms and remote stylesheets are stripped from custom sections, and your CSS is scoped to the band — so a design cannot leak onto the cart or the checkout.
  • Because forms are stripped, a custom band cannot collect anything. Send people to your products instead.

Read next

Still stuck? Send us a message and a person will answer — usually within one working day.
Contact us

Ready to try it?
Start free today.

Join the businesses already using Paysana to collect payments, send invoices and grow.

Free plan forever · No card to sign up · Your own gateway
We use cookies to measure how this site is used and how well our advertising works. They are optional — the site works exactly the same either way. Read our privacy policy.