Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

We’re excited to have you on board in the beta launch of the Page Builder!

The Designed to replace the Layout Editor is making way for , our new what-you-see-is-what-you-get Page Builder , which lets you see your design come to life in real time as you build. You’re now able able to add, drag, edit, resize, and design content directly in the user-facing view of your page.

Access the Page Builder

...

If the most recently published version of your page was created in the Layout Editor:

  1. Go to the page that you want to edit on your Refined site.

  2. In the top-right of the page, click the … (Three dots) > Edit page.

  3. You’re now in the Layout Editor. Click the button in the banner at the top of your screen to go to the Page Builder.

If the most recently published version of your page was created in the Page Builder:

  1. Go to the page that you want to edit on your Refined site.

  2. In the top-right of the page, click the … (Three dots) > Edit page.

...

Go to the legacy Layout Editor

...

from the Page Builder

To help you transition from Layout Editor to During the Page Builder beta, it will temporarily be possible to switch between the two. Please note that although they exist alongside each other, the legacy Layout Editor will continue to be available for use.

Please note, however, that a design you make in the Layout Editor is not necessarily available in the Page Builder, and vice versa. Soon, you’ll have the option to migrate your layouts from the Layout Editor into the Page Builder.

To go from the Page Builder to the legacy Layout Editor, click the button in the welcome banner, or go to the left-hand menu (accessible through the three-line icon)

...

.

Your users will see the most recently published version of the page, regardless of where it was made.

...

Simply click a module’s text to start writing and formatting. se .

Formatting option

Description

Text styles

Choose the paragraph style or one of the five heading styles.

Text sizes

Available sizes range from 10 - 72 pixels.

Font

All modules use the font that you set in the theme.

Colour

There are multiple ways to select a colour:

  • Select the shade and hue at the top of the popup.

  • Enter an rgb, rgba, or hex code.

  • Click the eyedropper icon to select a colour from anywhere on the page.

  • Pick one of the recently used colours.

Use the vertical slider located in the middle of the popup to control the colour’s opacity.

Emphasis

Make the text bold, italicised, or underlined.

Alignment

Align the text to the left, centre, or right.

Lists

Create a numbered list or bullet list.

URL

Add a link to the text.

Remove formatting

Change the text back to its default look.

Make module content dynamic

Use text variables to make the content of your modules dynamic – for example to personally welcome a user to your intranet. When writing text in a module, hit $ to see which text variables are available.

...

VariableText variable

Shows

Works on

$username

The user’s username.

All content types

$userfullname

The user’s full name.

All content types

$userfirstname

The user’s first name.

All content types

$sitename

The site’s name.

All content types

$siteid

The site’s ID.

All content types

$servicedeskname

The service desk’s name.

JSM portals

$servicedeskid

The service desk’s ID.

JSM portals

$pagename

The Refined Page’s name.

Refined Pages

$pagekey

The Refined Page’s key.

Refined Pages

$spacekeys

A list of the space keys that belong to this page’s child pages.

Refined Pages

$projectname

The Jira project name.

Jira project

$projectids

A list of Jira project IDs, including the current page and its child pages.

Jira project

$projectkey

The Jira project key.

Jira project

$projectid

The Jira Project ID.

Jira project

$spacename

The Confluence space name.

Confluence space

$spacekey

The Confluence space key.

Confluence space

...

  • Publish with comment lets you add a comment to the published version. All comments are visible in the version history in the left-hand menu (accessible through the three-line icon).

  • Save as draft with comment lets you add a comment to the current draft version. This comment is visible in the version history in the left-hand menu (accessible through the three-line icon). Note that when you publish a new version of the page, the draft and its comment will disappear from the version history overview.

  • Discard current draft takes you back to the version that was last published.

...

Restore, export, or delete a previous version

...

Version History

The Version History shows an overview of previously published versions and saved drafts.

As you build your page, we automatically save drafts for you. You can also save drafts with comments (see the paragraph above). Once you publish a version, your saved drafts disappear from the Version History overview.

Restore, export, or delete

...

versions and drafts

  1. Go to the left-hand menu (accessible through the three-line icon).

  2. Click Version historyHistory.

  3. Hover your mouse over a version and click the … (three dots) that appear.

Export the

...

most recently published page layout

If you want to reuse a page layout, you can export it and import it to another page.

Go to the left-hand menu (accessible through the three-line icon) and click Export/Import designpage layout. Note that you export the most recently published version. To export a draft, go to the Version History (see the paragraph above).

Import a

...

page layout

Go to the left-hand menu (accessible through the three-line icon) and click Export/Import page layout.

Templates

We have designed templates to help you get started. A template is merely a starting point – after adding it, you can further adjust the page.

Note that when you apply a template, you discard your current draft and start a new one.

Apply a template

Go to the left-hand menu (accessible through the three-line icon) and click Templates.

Keyboard shortcuts

To make Use keyboard shortcuts to speed up your page-building fast and easy, the Page Builder features keyboard shortcuts.

Action

Shortcut

Publish

Ctrl/Cmd + S

Close

Shift + Esc

Undo

Ctrl/Cmd + Z

Redo

Shift + Ctrl/Cmd + Z