Overview

👍

Welcome to the Aurora Commerce Page Builder BETA!

Introducing our Beta tool—an exciting first step in our ongoing dedication to enhancing the editorial experience for our users.

Designed to offer early value and gather invaluable feedback from you, our users, this Beta is a sneak peek into the future of content editorial for your merchandising teams on the Aurora Back-end. It's your risk-free opportunity to get a glimpse of what's coming and shape the path ahead.

Join us as we revolutionize your editorial journey!

Aurora's Page Builder allows you to produce rich, full page and snippet content using a simple and intuitive UI designed to remove the need for any advanced understanding of HTML or CSS.

The goal is to allow merchandisers to focus on the end result more and the 'mechanics' less, bringing vision to life more easily and delivering rich and engaging content. It will offer the confidence that what you design is what the end user will see across Desktop, Tablet and Mobile alike.

Why a Beta?

This tool is currently in Beta, which will progress through many iterations as its features are completed and enhanced to fulfil the needs of our users.

We have launched this as a Beta now to allow you to benefit from any early value it might have for your teams and to gather feedback on the tool as we continue to refine its features.

Does this mean it doesn't work?

Our goal here at Aurora Commerce is to offer you the best value on your investment and so this beta is specifically designed to only expose the experimental features we have the most confidence in. This being so, no! We do not expect this Beta not to work!

'What can we expect of this beta then?' I hear you ask. Well, it may be that it is missing some key features you might want to see included, but know that we are working on further improvements including things like Template-driven code blocks, Front-end CSS and header/foot previews and much more.

Where can I use it?

Currently, the Page Builder can be used anywhere only the WYSIWYG Editor was previously available. This currently includes the following:

• Products (Including the Bulk editor)
• Product Categories
• Content Pages/Blog Articles
• Filter Headers & Footers
• Snippets

Using the Page Builder

An introduction to the Page Builder UI

📘

Please remember!

This is a Beta and features may change without warning! We hope for this to exclusively provide joy, but may on occasion differ from this documentation, which endeavours to cover the broader features provided by the tool.

The page builder is comprised of the following major sections that enable you to edit your content and manage its properties:

1. View Size - This allows you to simulate in real time the width of various devices, e.g. desktop, tablet or mobile.
2. Editor Controls - This is where you will find settings and commands that affect the editor window and how it behaves.
3. Content Controls - This is where you will find settings relating to the content you are editing, whether it is currently selected or new to be added.
4. Content Preview - This is where you will find and edit your content in real time.

📘

A consistent experience throughout!

This UI is the same across the entirety of Aurora, wherever it appears.

What are the Content Controls?

Style (Sheets) / CSS

This option presents you with all the settings, from basic to advanced, for controlling the styling and layout of your content.

This includes things like font, alignment and much more!

Widgets & Objects

This option presents all of the Widgets and Objects available for you to use in your content. Simply click and drag a block into your page and drop it where you would like it to appear. Then configure it using the other options in this panel as see your content come to life!

Content Properties

This option allows you to configure the properties of your Widgets and Objects. Not all things have properties, but if they do, like the Aurora Snippet Object, you can set their properties here and see the result in your content preview immediately.

Content Structure

This option maps your content's structure and can be helpful when trying to find and select specific objects that might be nested within your content.

📘

Change is good!

The Widgets and Objects available here may change over time. Certainly, throughout the development of this beta, new ones will appear as demand for them becomes apparent.

As most of the options found in this section are self-explanatory, there is very little documentation explaining their behaviours. This being said, there are several bespoke Widgets/Object unique to Aurora that have been documented below for your convenience.

Snippets

This Object allows you to insert an Aurora Snippet into your content.

Simply select the object, drag it into place and then use the Content Properties option to select which snippet you would like to insert.

Snippets cannot be edited or customised from thus UI and cannot have other items inserted into them. To change a snippets content, you must always do so from the Aurora Snippet area.

Customising the Page Builder

📘

Create your own Page Builder!

If you are looking to provide and more tailored (or 'guided') experience for your content editors/managers, Aurora provides features to allow you to control what content can be managed via the Page Builder and how.

This includes hiding certain features from your users and even creating your own content Widgets & Objects to use.

Read on below to find out more!

Disabling advanced HTML Widgets & Objects

It is possible to revoke access to the 'open HTML' management Widgets & Objects if you wish. Doing this will:

• Hide the "Style (Sheets) / CSS" panel (see "Style (Sheets) / CSS" above) that allows the content's CSS to be managed.
• Hide all Widgets & Objects (see "Widgets & Objects" above) that are not entirely controlled by your Template & Snippet Development teams.

Manage access to these features using the Disable advanced Page Builder UI option in the Aurora Back-end under Store > Settings > Aurora > Editor.

Enabling the Front-end Preview

👍

How do I do this?

For more detail on customising the live preview mode in the Page Builder, please see this guide.

Creating your own Widgets & Objects

👍

How do I do this?

For more detail on creating and managing your own Page Builder Widgets & Objects, please see this guide.