This tutorial walks you through creating and publishing your first website using Sites Mode. From design to deployment in minutes.
Step 1: Enable Sites Mode
- Open Azyrom and create a new project or open an existing design
- Click Sites in the mode toggle at the top of the left sidebar
- The interface switches to show Sites-specific panels and the breakpoint bar
Step 2: Set Up Your First Page
- The Webpage Panel appears in the left sidebar
- Your canvas becomes your homepage - name it "Home" or "Index"
- Set page title and URL slug in the page settings
Step 3: Design Your Layout
- Use frames to create sections (header, hero, content, footer)
- Add shapes, text, and images using the standard design tools
- Use the Blocks Panel for pre-built section templates
- Apply Auto Layout for responsive structure
Step 4: Make It Responsive
- Use the Breakpoint Bar above the canvas to switch views
- Adjust layouts for tablet (768px) and mobile (375px)
- Set constraints so elements resize properly
Step 5: Add Navigation
- Open the Navigation Panel
- Create menu items linking to your pages
- Style your navigation to match your design
Step 6: Configure SEO
- Open SEO Settings in the sidebar
- Add page title, meta description, and Open Graph image
- Set a custom URL slug
Step 7: Preview Your Site
- Click Preview to launch the local preview server
- Your default browser opens showing the live site
- Test navigation, responsiveness, and interactions
Step 8: Publish
- Click Publish in the toolbar
- Choose to export static files or deploy to a hosting service
- Optionally configure a custom domain