Landing Page
Hablla — Landing Page
Purpose: to build and publish a simple landing page using visual blocks or code (HTML/CSS).
Important: before editing, have HTML and CSS ready (you can ask an AI to generate them).
1) Access and create the project
Go to Marketing → Landing Page.
Click Add project (blank template) and give it a name.
Result: you enter the Project Editor.
2) Understanding the Editor screen
Top (right):
Create template → saves the current layout as a template to reuse later.
Code Editor → opens a modal with two tabs to paste HTML and CSS.
Save and Publish → publishes the page (the link will be available in the project list).
Top (center): Desktop/Mobile selector (to check responsiveness).
Left: Pages and Layers (element tree to ease selection).
Center: Canvas (where you view and build the page).
Right: Styles and Properties (visual adjustments and attributes of the selected item).
3) Option A — Build with blocks (drag & drop)
In the Blocks panel (palette), you have the components:
Section (creates a section); 1 Column / 2 Columns / 3 Columns (column structure)
Heading (title), Text (text)
Image (image), Link / Link Box (links), Video, Map
How to use (quick example):
Drag a Section to the Canvas.
Inside it, drag 2 Columns.
On the left: Heading + Text. On the right: Image (upload it).
Select each item and adjust in Styles (typography, color, spacing, background).
4) Option B — Build with code (HTML/CSS)
Click Code Editor.
In the HTML tab, paste your landing's HTML.
In the CSS tab, paste the styles.
Click Save to apply to the Canvas.
Note: if you want to use the platform's native form later (for lead/tag/webhook), do not insert <form> in the HTML — build the visual structure and, when there is the form block, use it in the editor.
5) Publish and get the link
Click Save and Publish.
Return to the project list; the published project shows Active Link.
Copy the link for distribution.
Quick checklist
HTML and CSS pasted (or blocks added) and saved
Visual adjustments in Styles/Properties
Desktop/Mobile checked
Save and Publish done
Link with Active Link copied
(Optional) Create template to reuse
Final tip (prerequisite)
If you don't have code, ask an AI: “Generate HTML (no frameworks) and mobile-first CSS for a landing with a hero (title, subtitle, CTA), 3 benefits in cards and a final CTA.” Then paste into the Code Editor (HTML/CSS) and adjust in Styles.
Last updated
Was this helpful?