← Back to Help Center

Edit Template

This guide walks you through customizing your one-page website using the Edit Template page. You'll find four tabs: General, Navigation, Theme, and Media.

General

This is where you set up the basic identity of your website, including your logo and favicon.

Setting Up Your Logo

Your logo appears in the top-left corner of your website. You can choose between a text-based logo or an image.

Using a text logo:

  1. Open the General tab.
  2. Select "Text" as your logo type.
  3. Type your business name in the text field that appears.
  4. Save your changes.

Using an image logo:

  1. Open the General tab.
  2. Select "Image" as your logo type.
  3. Upload your logo file (PNG or JPEG, max 2 MB).
  4. Use the built-in image editor to crop or adjust if needed.
  5. Save your changes.

A nail salon called "Glaze" could use a text logo for a clean, modern look, or upload a custom-designed logo image for a more branded feel.

Adding a Favicon

A favicon is the small icon that appears in browser tabs next to your page title.

  1. Scroll to the favicon section on the General tab.
  2. Upload your icon file (ICO or PNG format, max 512 KB).
  3. For best results, use an image that is 32x32 or 64x64 pixels.
  4. Save your changes.

Upload a small version of your logo or a simple icon that represents your brand.

Navigation

This is where you manage the menu links that appear at the top of your website. Each link scrolls visitors to a specific section on your page.

Adding a Menu Item

  1. Open the Navigation tab.
  2. Add a new item to the list.
  3. Enter a label (the text visitors will see, such as "About Us" or "Pricing").
  4. Enter the target (the section ID it should link to, such as #about or #pricing).
  5. Make sure the item is toggled on so it appears on your site.
  6. Save your changes.

Reordering Menu Items

  1. Drag and drop items in the list to change their order.
  2. The order here matches the order in your website menu.
  3. Save your changes.

Hiding a Menu Item

  1. Toggle an item off to hide it from your menu without deleting it.
  2. You can toggle it back on at any time.

If your "Team" section isn't ready yet, toggle its menu item off until you've added team member content.

Theme

This is where you control the visual design of your website: colors, navigation bar style, and fonts.

Choosing a Color Scheme

A color scheme applies a coordinated set of colors across your entire website with one click.

  1. Open the Theme tab.
  2. Browse the available preset schemes (such as Luxury, Modern, Natural, Rose, Ocean, and others).
  3. Click on a scheme to select it. The active scheme is highlighted with a green border.
  4. All color fields update automatically to match.
  5. Save your changes.

A beauty salon might choose the "Rose" scheme for warm, elegant tones, or "Luxury" for a premium gold-and-black look.

Customizing Individual Colors

If none of the presets are quite right, you can adjust individual colors.

  1. Select any preset as a starting point, or choose "Custom" to start from scratch.
  2. Use the color pickers to adjust the colors listed below.

Use the color pickers to adjust the colors listed below.

Color Description
Primary your main accent color (buttons, highlights)
Secondary dark backgrounds for contrast sections
Accent hover effects and gradients
Background light section backgrounds
Text body text
Heading heading text
  1. Save your changes.

Start with the "Modern" scheme, then change the primary color to match your brand's exact blue.

Styling the Navigation Bar

  1. Scroll to the navbar section within the Theme tab.
  2. Choose a layout style: "Default" (left-aligned) or "Centered."
  3. Set the background color, text color, and underline color for menu links.
  4. Toggle "Sticky" on to keep the menu visible as visitors scroll.
  5. Toggle "Transparent" on if you want the menu to blend into the hero section.
  6. Save your changes.

For a modern look, enable both sticky and transparent so the navigation floats over your hero image and stays accessible while scrolling.

Choosing Fonts

  1. Scroll to the typography section within the Theme tab.
  2. Select a heading font (used for titles and section headings).
  3. Select a body font (used for paragraphs and general text).
  4. Choose a base font size (from small at 14px to large at 18px).
  5. Preview your font combination at the bottom of the section.
  6. Save your changes.

Pair "Playfair Display" for headings with "Inter" for body text to create an elegant yet readable combination.

Media

This tab provides a read-only overview of all images used across your website sections.

Reviewing Your Section Images

  1. Open the Media tab.
  2. Browse the grid to see all uploaded images, grouped by section (hero, about, gallery, and so on).
  3. Note that images are managed in the Sections page, not here.

Updating Section Images

  1. Navigate to the Sections page from your dashboard menu.
  2. Open the section you want to update (for example, "Hero" or "Gallery").
  3. Upload, replace, or remove images within that section.
  4. Return to the Media tab on the Edit Template page to verify your changes.

To update your hero background image, go to Sections, open the Hero section, upload your new photo, and then check the Media tab to confirm it appears correctly.

Previewing and Publishing

Before making your changes public, you can preview them.

  1. Click the preview button in the top-right corner of the page.
  2. A new browser tab opens showing your site with the unsaved changes applied.
  3. Review the result, then return to the editor.
  4. When you're satisfied, save your changes. They go live immediately.
  5. Use the "View Live Site" button to see your published website at any time.

Tip: Always preview after making theme or navigation changes to make sure everything looks right before saving.