Skip to the content
Docs

Header, footer and global styles

The Design page holds the parts that every page shares: header, footer, product card, cart, checkout and more. Pick a ready-made style, customize it, then publish once.

3 min readLast updated 23 Oct 2026

Some parts of your website look the same on every page: the header at the top, the footer at the bottom, the product card in every list. Instead of editing them page by page, you edit each one once under Design and publish it. That is why these are called Global styles.

Before you start#

  • Your website exists, and you have design edit permission (the owner always has it).
  • Read Page builder basics if you have never used the builder.

What you find on the Design page#

Open Design (the page title is "Store Design"). It shows a grid of cards. Use the pills All, Core Pages, Components and Modals to narrow it down.

GroupCards
Core PagesHeader, Footer, Homepage, Product page, Shop, Category, Shop filter, Cart, Checkout, Order page, Account, Content page, Not found
ComponentsProduct card, Bottom menu (phone), Floating buttons, Store theme
ModalsQuick view, Wishlist, Account window, Side cart

Cards for parts your website does not use are left out. The page also shows a Store styling checklist (publish your homepage, header, footer and colours, set up your store menu, add a favicon) and the live release number.

Change a part#

Every card has the same buttons:

  • Change style: choose from ready-made designs. You are asked first, and you can undo it.
  • Customize Design: opens the editor for that part, so you can change it block by block.
  • Toggle Customizer: simple switches to turn things on or off, move and size them (for example logo, menu, search and buttons in the header).
  • Reset to default: puts the Jukto default into your draft. Your live store changes only when you publish, and earlier published versions stay in the version list.
  1. 1

    Pick the part

    Open Design and find the card, for example Header.

  2. 2

    Choose a style

    Press Change style and pick a ready-made header you like. Confirm when you are asked.

  3. 3

    Fine-tune it

    Use Toggle Customizer for quick switches, or Customize Design for the full builder.

  4. 4

    Publish

    Publish from the editor. The card then shows Live version N, and every page uses the new header at once.

The Header & footer menus tile shows how many header and footer links you have. Press Configure to edit them. Menu links appear in the header and footer after you publish.

Cart tab, contact button and phone menu#

Three small parts are drawn on every page, above the content: a floating cart tab, a contact button and the phone bottom menu. Switch each on in Tools (the contact button and the phone bottom menu are on for a new website, the floating cart is off) and set how they look on the Design page.

Common problems#

I edited the header but the website did not change

It is still a draft. Publish it from the editor. The card says "Draft has unpublished changes" or "Not live" until you do.

Change style asks me to confirm

Choosing a ready-made style replaces your draft of that part. You can undo it. Your live website does not change until you publish.

A card I expected is missing

Cards for parts your website does not use (for example a shop page on a site without a shop) are left out.

Next#

Was this guide helpful?

Comments (0)

Anyone can comment. Please do not post phone numbers, passwords or customer details.

Never shown. Only used to tell you when someone replies.
0 / 2000