Skip to main content
After installing, the starter set has given you a working front page, header, footer and templates. Here is the order that turns it into your site.

​
1. Set the design system

Bevel → Site Settings. Under Global set the colours (primary, secondary, text, accent) and the fonts for headings and body. Under Theme Style → Buttons set the button style and pick a Hover Animation. Under Site Identity upload the logo and, if the footer is dark, a Light Logo. Everything built from here on reads these values. Change a colour later and every page follows. If the brand has its own typeface, install it first under Bevel → Custom Elements → Custom Fonts; it then appears in every font picker. See Custom Fonts.

​
2. Frame the site

Bevel → Theme Builder. Open the starter Header and Footer templates and make them yours: the logo, the menu (the Nav Menu widget reads the Primary Menu location), a button. Publish. They show on every page. The starter Single Post, Archive and 404 templates are good as they are; restyle them when the blog matters.

​
3. Build the pages

Two ways, and they mix. In the editor. Add a page, edit with Elementor, and use the template library (the folder icon) for blocks and pages, or the Bevel widgets directly. Pages use the full-width layout by default, so the header and footer wrap them. With an assistant. Install Bevel MCP, connect Claude or ChatGPT, drop the brand’s logo, photos and fonts into Brand assets, and ask for the site. The assistant reads your design system, builds pages from the Kit’s widgets under the house rules, and saves them as drafts for you to review. See Your first build.

​
4. Menu, front page, forms

  • Appearance → Menus: the starter Main Menu lists the published pages; add, reorder, or hand an item a mega menu.
  • Settings → Reading: the starter front page is already set as the homepage.
  • A contact page gets a Form; submissions arrive under Bevel → Submissions and by email.

​
5. Make it fast, then publish

Bevel → Site Settings → Tools → Optimization → One-Click Optimization. It sets the font and image options, delays scripts until the first interaction and converts the library to WebP. Then switch on the HTML Disk Cache. Check the result with Check PageSpeed in the admin bar. Publish the pages. Done.

​
Where next