In this article, you'll learn how to change your website's colors, fonts and overall shape from your dashboard. These settings apply to the whole site at once, so it's the quickest way to make your site match your trucks, your logo or your uniforms.
To open the design settings:
- In the menu, click Website, then Content.
- Click the Design tab.
The Look & feel card at the top holds every setting in this article. Every page on your site follows these choices. Below it sits the Menu card, which is covered in a separate article.
Pick your colors
There are two colors, and each one has a job:
- Main color (headings, dark bands) is used for headings and the dark stripes that run across your pages.
- Accent color (buttons, highlights) is used for buttons and the bits you want to stand out.
To change one:
- Click the color square next to it and pick a color, or type a code like #1f3a5f into the box beside it.
- If you type a code, use a # followed by six characters. Until it's in that format you'll see Use #rrggbb in red beside the box.
Tip: If you have a brand color from your logo or signage, ask whoever made it for the six-character code. Typing it in gets an exact match.
Warning: If you save while a color code is still in the wrong format, that color isn't kept. Fix it until the red note disappears, then save.
Choose your fonts and headings
- Open Fonts and pick a pairing. Each one sets the font for headings and the font for body text, and the name tells you the feel, like Inter (clean, modern) or Merriweather + Lato (trustworthy).
- Open Headings and choose Whatever suits the font to let the font decide, ALL CAPS headings, or Normal case.
Set the header and footer layout
- Header layout: Logo left, menu right, or Logo centered, menu below.
- Footer layout: Four columns, or One line for a simpler footer.
Shape the corners and buttons
- Corners sets how rounded boxes and cards are: Soft corners, Square corners or Round corners.
- Button text chooses White text on buttons or Dark text on buttons.
- Button corners does the same job for buttons: Slightly rounded buttons, Rounder buttons or Pill buttons.
Note: If your accent color is light, like lime or yellow, pick Dark text on buttons. White text on a light button is hard to read.
Section backgrounds and trim
- Section backgrounds: Same background throughout, or Alternate white and page color so each section of a page stands apart from the next.
- Decorative trim adds an accent strip along banners and cards: None, Thin accent line or Roll-up door ribbing.
Save your changes
- Once you've changed anything, a Save changes button appears at the bottom of the card.
- Click Save changes. You'll see Saved when it's done. If it didn't go through, you'll see Couldn't save instead, and you can click the button again.
Your new look applies to every page. The top of the Website page says edits go live on your site within a couple of minutes, so give it a moment before you refresh your site to check.
Note: If you don't see any of this, your website may not be set up yet. In that case the Website page says so, and these settings appear once your site is live.