11 min read

The Landing Page Editor: Drag, Drop & Publish

Build your homepage and campaign pages by assembling ready-made sections on a live canvas, preview across devices, and publish when you're ready.

The Landing Page Editor is where you build your storefront's homepage — and any additional campaign page — by stacking ready-made sections on a canvas. There's no code involved: you add a section, fill in its content, and arrange it wherever you want on the page.

Screen: Online Store → Pages, then open the "pages you build" card. Inside the editor, click Pages in the header to open the pages drawer, where you can create an additional campaign page, and rename, duplicate, or delete any page you've built.

What you're looking at

  • The page is a vertical stack of sections shown in a left-hand panel.
  • A live preview panel in the centre shows exactly what customers will see, with desktop, tablet, and mobile toggles.
  • Click any section to open its editor on the right and change its content and style.
  • Nothing customers see changes until you click Publish — everything before that is a draft.

The canvas

Your page is a vertical stack of sections. Drag a section card up or down in the left-hand list to reorder it — the preview rebuilds in real time. Each section can be:

  • Added — from the section library (see The Section Library for the full catalogue).
  • Reordered — drag it to a new position in the stack.
  • Duplicated — clone a section with its content and style intact, then tweak the copy.
  • Hidden — toggle a section off without deleting it, useful for seasonal content you'll want back later.
  • Deleted — with a confirmation prompt before it's gone.

Every section's editor panel has a Content area (headline, body text, button labels, images, and the specific data for that section — for a product showcase, for example, which products appear) and a Style area (background colour, padding, and layout variant, where the section offers more than one).

The left-hand panel itself has three tabs above the section stack: Sections (what's described above), Page (page name, SEO, social sharing, and integrations — see SEO, social sharing & integrations below), and Theme (colours, typography, and spacing — see Theme presets).

Desktop, tablet & mobile preview

A viewport switcher above the preview panel toggles between desktop, tablet, and mobile views. The preview reflows to the matching breakpoint so you see precisely what a customer on that device sees, before you publish anything.

Undo, redo & keyboard shortcuts

Every change is tracked in an undo/redo history for the current session. On Windows/Linux the modifier is Ctrl; on Mac it's .

ActionShortcut
Save draftCtrl/⌘ + S
PublishCtrl/⌘ + P
UndoCtrl/⌘ + Z
RedoCtrl/⌘ + Shift + Z (or Ctrl/⌘ + Y)
Delete selected sectionDelete or Backspace
Duplicate selected sectionCtrl/⌘ + D
Move selected section up / downCtrl/⌘ + ↑ / ↓
Add a sectionCtrl/⌘ + Shift + A
Desktop / tablet / mobile previewCtrl/⌘ + 1 / 2 / 3
Open command paletteCtrl/⌘ + K
Deselect / close a dialogEsc

Shortcuts are disabled while you're typing in a text field (except Esc, which still closes open dialogs), so they never interfere with writing copy. Press Ctrl/⌘ + K to open the command palette — a searchable list of every action available in the editor (save, publish, add a section, switch preview device, and more), grouped by category, each with its shortcut shown next to it. It's a fast alternative to hunting through menus once you know roughly what you want to do.

A full shortcut list, along with everything else, is available from the Help menu (the ? icon in the header): Keyboard shortcuts (the same list shown above, also opened directly by pressing ?), Take the tour (a short guided walkthrough of the section list, the edit pencil, section tabs, the drag handle, and the Publish button — this also opens automatically the first time you use the editor), Help center, and Contact support.

Note

Deleting a section always asks you to confirm first — there's no accidental one-key wipe.

Auto-save, drafts & version history

Your work is auto-saved as a draft continuously while you edit, and again if you close the tab with unsaved changes — so closing the browser never loses your progress. A separate local backup is kept every few seconds while you're actively editing, and BillionBiz offers to restore it if your session ends unexpectedly.

Click History in the editor header to open the version browser. From there you can:

  • Search or filter through your recent saved versions.
  • Preview any earlier version before deciding whether to use it.
  • Restore an earlier version — you'll be asked to confirm, since this replaces your current draft.

Multiple tabs

If you have the same page open in two browser tabs, BillionBiz detects the conflict and offers to reload with the other tab's latest save, so you don't overwrite a colleague's (or your own) more recent work.

Audit log

Click the audit-log icon next to History in the header to open a feed of who changed what and when — every section add, delete, duplicate, reorder, and content/style edit, plus theme changes, is logged with the editor's name and a relative timestamp ("2 hours ago"). Filter the feed by what happened or by a date range, and click Refresh to pull in the latest entries without closing the drawer. Use this alongside History when you need to know who made a change, not just what the page looked like before it.

Publishing is a separate step from saving. Click Publish in the editor header (or press Ctrl/⌘ + P) to start the publish pipeline:

Validating

BillionBiz checks your draft for problems — missing required fields, broken links, and similar issues — before anything goes live.

Publishing

Once validation passes, your sections are pushed to the live storefront.

Live

A confirmation shows your page is live, with an Open in a new tab link so you can see exactly what customers see.

If validation finds a problem, the Publish button shows a small badge with the number of errors instead of publishing. Click it to open a popover listing every error — which section, which field, and what's wrong — each with a Jump to section button that selects and scrolls to the offending section so you can fix it without hunting for it yourself.

If your draft would remove sections that are currently live — especially if it would publish a page with zero sections — BillionBiz shows you exactly what's being removed and asks you to confirm before publishing. This protects you from accidentally wiping your live homepage with an in-progress draft.

A status strip at the bottom of the editor keeps you posted on the outcome: it shows a progress bar while a publish is in flight, an error if the last publish failed, or the date and editor name of your last successful publish once it's done.

If you're starting from a blank page, click Start from a template to open the template gallery. Templates are grouped into five categories — E-commerce Classics (proven layouts like a Best Sellers Showcase or Flash Sale Event), Brand Story (About Us Focus, Founder Story), Conversion Focused, Visual Impact, and Niche Specific — and each one lists the sections it's built from and how many. Some newer templates require a higher plan tier, shown on the card. Applying a template pre-fills every section with real placeholder content that mirrors the intended look, so you're replacing text and images rather than starting from nothing.

Note

If your page already has content, BillionBiz asks you to confirm before a template overwrites it.

Images, illustrations & stock photos

Click the image icon in the header to open the Asset library — the same dialog opens whenever a section's Content tab asks you to pick an image. It has four tabs:

  • My Images — every image you've uploaded to this store, searchable, with a grid or list view. Right-click an image for Replace, Copy URL, Download, or Delete, and use Load More to page through a large library.
  • Illustrations — a built-in set of royalty-free illustrations, browsable by category or by search.
  • Stock Photos — search Unsplash or Pexels for free stock photography, if your store has a stock-photo API key configured; each result carries the required photographer attribution.
  • Upload New — drag and drop files or click to select. JPG, PNG, GIF, and WebP are supported, up to 10MB per file, and you can select several files at once.

When you're placing an image on a section that uses cover-crop (the image fills its container), click anywhere on the preview to set a focal point — the point that stays visible no matter how the image gets cropped on different screen sizes.

SEO, social sharing & integrations

Open the Page tab in the left-hand panel to edit everything about how this page is found, shared, and connected to outside tools.

SEO — set the Page title (up to 70 characters before the field warns you it's getting long) and Meta description (up to 160 characters, same warning behaviour) that appear in search results, plus the page's URL slug. A live SEO score badge next to the page name in the header shows a score out of 100; click it to open a panel breaking down every check BillionBiz runs (title length, meta description, image alt text, and similar), which ones are passing, and a hint for fixing the ones that aren't.

Social share — set an Open Graph image, OG title, and OG description (each falls back to your SEO title/description if left blank), then check the Facebook and Twitter/X tabs of the live preview card to see exactly how the page will look when someone shares its link, including per-platform character counts.

Integrations — connect this page to outside tools:

  • Google Analytics 4 — turn on GA4 event tracking and enter your Measurement ID.
  • Tracking pixels — Meta Pixel, Google Ads conversion ID/label, LinkedIn Insight Tag, and TikTok Pixel IDs, for ad platforms that need to see which visitors reached this page.
  • Lead capture — choose where new leads from this page's forms go: your store's Newsletter list, a Mailchimp audience (by audience ID), or a Webhook URL. You can also ping a Slack channel on every new lead and customise the thank-you message shown after someone submits their details.
  • Webhooks — add one or more webhook URLs that fire on publish, theme change, or section change (toggle which events each webhook cares about). Each webhook can be enabled or disabled, and its recent deliveries are viewable inline — each with a status, latency, and timestamp, with a Retry button on any failed delivery.

Page health

Next to the SEO badge, a health score badge (also out of 100) gives you a single number for the page's overall quality. Click it to open the health drawer, which groups issues into four categories — SEO, Accessibility, Performance, and Content — each flagged as an error, warning, or tip, with a Fix button that jumps straight to the section that needs attention where one applies. Below the issues, a Smart suggestions panel surfaces lower-priority improvements you can act on directly from the drawer.

Reusable snippets

Save any section's exact content and style as a named snippet so you can reuse it without rebuilding it from scratch. From a section's menu, choose Save as snippet, give it a name and (optionally) a folder to keep them organised. From then on:

  • Open + Add Section and switch to the My Snippets tab to insert a saved snippet as a new section.
  • Use Apply preset from any existing section's menu to overwrite that section's content and style with a saved snippet's.
  • Open the snippet manager (also reachable from the section library) to rename, delete, or reorganise your saved snippets into folders.

Next steps