Skip to main content

Landing Page Builder

The Landing Page Builder is a visual, drag-and-drop editor that lets you customize your landing page without any coding knowledge. Change colors, text, images, layouts - everything is point-and-click.

Watch the Video Tutorialโ€‹

Accessing the Builderโ€‹

There are two ways to open the builder:

Method 1: From Settingsโ€‹

  1. Go to SaaS Management โ†’ SuperAdmin Settings โ†’ Landing Page Settings
  2. Click "Customize with builder"

Method 2: From Sidebarโ€‹

  1. Go to SaaS Management โ†’ Landing Page Builder

Builder Interfaceโ€‹

Landing Page Builder interface The Landing Page Builder - Pages on the left, visual editor in the center, properties on the right

The builder has three main areas:

AreaLocationWhat It Does
Pages & Sections PanelLeft sideBrowse themes, add sections, manage pages
Visual EditorCenterSee your page and click elements to edit them
Properties PanelRight sideEdit the selected element's content, style, and settings

Working with Themesโ€‹

The left panel shows available themes:

  • SaasCandy - Modern SaaS-focused design
  • Mexant - Clean and minimal
  • Productly - Product showcase style

Click a theme to start with its predefined sections, then customize from there.

Adding Sectionsโ€‹

  1. In the left panel, click "+ Add section"
  2. Browse the available section types:
    • Hero - Header with headline and CTA
    • Features - Showcase features in cards or lists
    • Pricing - Display your subscription plans
    • Testimonials - Customer quotes and reviews
    • Contact - Contact form or information
    • Custom - Blank section for your own content
  3. Click a section to add it to your page
  4. Drag sections to reorder them

Editing Elementsโ€‹

  1. Click any element in the visual editor (text, image, button, etc.)
  2. The Properties Panel on the right will show its settings
  3. Tabs in the Properties Panel:
    • Content - Edit text, images, links
    • Style - Change colors, fonts, spacing, borders
    • Advanced - CSS classes, animations, visibility

Managing Pagesโ€‹

The builder supports multiple pages:

  • Click "New page +" in the Pages section (top left) to create additional pages
  • Useful for creating separate pricing pages, feature pages, or about pages

Tips for a Great Landing Pageโ€‹

Keep It Simpleโ€‹

  • Don't overload with sections - 5-7 sections is ideal
  • Each section should have ONE clear purpose
  • Use plenty of white space

Use High-Quality Imagesโ€‹

  • Replace default images with your own screenshots
  • Show your actual CRM interface - real is better than stock photos
  • Use consistent image sizes

Optimize for Speedโ€‹

  • Keep images under 200KB each
  • Don't add too many sections (page load time matters!)
  • Test load speed with Google PageSpeed

Test on Mobileโ€‹

  • Click the mobile preview button in the builder
  • Make sure all text is readable on small screens
  • Check that buttons are easy to tap

Saving Your Changesโ€‹

When you're happy with your landing page:

  1. Click "Save Page" (top right corner, green button)
  2. Click "View page" to see the published version
  3. Share the URL with customers!
warning

Don't forget to save! Changes are NOT auto-saved. Always click "Save Page" before leaving the builder.

tip

Landing page looking good? Move on to configure Custom Domains if you want to offer custom domain support for your premium tenants.