Landing pages and the page builder

Landing pages and the page builder

The Refined Page Builder.

Landing pages are pages you build in Refined Sites to help users navigate your site’s content:

The tool that’s used to edit landing pages is called the page builder. You also use it to edit the site’s footer.

On this page:


Edit a landing page

There are two ways to edit a landing page:

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

  2. Click the Edit page button in the top-right of the page.
    Or use the keyboard shortcut E for quick access.

Or:

  1. Go to the site structure.

  2. Locate the page that you want to edit.

  3. Click the three dots > Edit page.


Content and structure

Templates

Need a helping hand creating landing pages? Use one of the 30+ Confluence and JSM page templates that help you nail your page designs for intranets, documentation sites, knowledge bases, support desks, and more.

Modules are your page’s building blocks. Use them to:

  • Simplify site navigation. For example, highlight pages and blogs from Confluence spaces or direct users to other links with buttons, icons, and more.

  • Create user-friendly support portals, by showing requests and request types from JSM spaces and highlighting Confluence knowledge base articles.

  • Add any other text, images, and other design elements you’d like.

Structure a page by clustering modules:

  • The largest possible group is called a section. It can have its own settings, including backgrounds.

  • Sections can be further organized into rows. Rows can also have their own settings and backgrounds.

  • Rows can can contain up to six columns that contain modules.

You can easily switch up your design by dragging and dropping modules, sections, and rows around.

Add a module

To add a module, simply hover your mouse over the desired location and click the + Add module button that appears. The availability of modules depends on which Refined app(s) you use.

Edit a module

Click a module to edit its settings: read a module’s documentation to learn about the possibilities (see the module overview above).

  • Click the two pages to duplicate the module.

  • Click the trashcan to delete the module.

Edit text in a module

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

Formatting option

Description

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

Site fonts are set up in the Theme Editor.

Color

There are multiple ways to select a color:

  • 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 color from anywhere on the page (available in the browsers Firefox and Edge).

  • Pick one of the recently used colors.

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

Emphasis

Make the text bold, italicized, or underlined.

Alignment

Align the text to the left, center, 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.