Page Builder

Using the Visual Editor

Build pages visually by dragging components onto a canvas. Edit content in real-time, see changes instantly in the live preview, and publish when you're ready. No code required for your marketing team to update content.

Available in two places: The visual editor runs in the cloud dashboard at admin.mirin.com and in the Mirin desktop app. Both use the same editor interface. Pages built in the desktop app are stored locally and pushed to the cloud via Sync Up before publishing.

Editor Layout

The editor uses a two-column layout with your live preview on the left and controls on the right.

Page Editor
Publish
Build
Page
Design
Components
Hero
Features
CTA
Live Preview: See your page in real-time. Click components to select and edit them.
Control Sidebar: Manage components, configure page settings, and adjust global styles.

Working with Components

Components
Adding Components

Click the + button in the Build tab to open the component selector. Browse or search through your installed theme packs.

Properties
Title
Hero Text
Subtitle
Editing Content

Click any component to select it. The property panel displays all editable fields. Changes auto-save instantly.

Hero
Features
CTA
Reordering

Drag the handle on component cards to reorder them. Components stack vertically in the order shown.

Hero
Quick Actions

Hover over any component to reveal duplicate and delete buttons. Duplicate creates a copy with all settings.

Component Selector

Click the + button in the Build tab to open the component selector modal.

InstalledShared
Hero
Features
CTA

Installed tab: Components from your theme packs, grouped by pack name.

Shared tab: Reusable components that update everywhere when edited.

Shared Components

Shared components display across multiple pages. Edit the source, and every instance updates.

Your Shared Components
H
Site Header
12 pages
F
Site Footer
12 pages
C
Newsletter CTA
5 pages

Create: Toggle "Shared" when editing any component

Edit: Changes propagate to all pages using the component

Page Settings

Configure SEO and metadata in the Page tab of the sidebar.

Page Title
Required
Appears in the browser tab and as the clickable headline in search results. Keep it under 60 characters for best display.
URL Slug
Required
The page path after your domain. Use lowercase letters, numbers, and hyphens only. Example: /about-us
Meta Description
Recommended
The summary shown below your title in search results. Aim for 150-160 characters to avoid truncation.
Featured Image
Optional
Preview image when your page is shared on social media. Recommended size: 1200×630 pixels.
Index Settings
Default: On
Toggle whether search engines can discover and index this page. Turn off for private or draft content.

Social Sharing Defaults

When someone shares a link to your site on social media or in a messaging app, a preview card appears with an image and your site name. Set the defaults once in the Design tab under SEO & Social, and every page is covered. Pages with their own Featured Image use that instead.

Your default share image
yourbusiness.com
Your Page Title
Your meta description appears here.

How your link looks when shared

Default Share Image
Recommended
The image shown for any page that has no Featured Image of its own. Pick something that represents your whole business, like your storefront or logo on a photo background. Recommended size: 1200×630 pixels. Without it, pages with no Featured Image share with no preview image at all.
Twitter/X Handle
Optional
Credits your account on Twitter/X link cards so shares point back to you. Enter just the handle without the @. Leave it blank if you do not have an account; nothing is shown in that case.

Keyboard Shortcuts

MacWin / Linux
Save
⌘SCtrl S
Duplicate
⌘DCtrl D
Move up
⌘↑Ctrl ↑
Move down
⌘↓Ctrl ↓
Delete
DeleteDelete
Deselect
EscEsc
Continue to Publishing & Hosting