Page Builder: The Basics

This article will guide you through the process of managing Pages in a Raisely campaign. It covers an overview of the page types available, how to create new pages, and how to use the page editor to customize your campaign site.

Skip Ahead To

Types of Pages in a Campaign

Creating and Customising Pages

Using the Page Editor Tool

Customising Rows and Columns

Saving and Applying Row Templates

Types of Pages in a Campaign

In a Raisely campaign, there are three types of pages you can work with: Core Pages, Custom Pages, and System Pages. Understanding these will help you manage your campaign more effectively.

Core Pages and System Pages

Core Pages and System Pages are essential for the functionality of your campaign. These pages cannot be deleted, but you can modify the content within them.

Custom Pages

Custom Pages are fully customizable. You have the flexibility to delete or modify these pages to suit your campaign’s needs.

Creating and Customising Pages

Creating new custom pages allows you to add personalized content to your campaign. This section explains how to create a custom page and adjust settings for better management.

How to Create a Custom Page

1

In your campaign dashboard, click on Pages.

2

Click Create Page (located at the top-right of the screen).

3

Enter the following information for your new page:

Page Title - The title displayed for the page.
Internal Page Title - A title for internal use.
Page Path - The URL for the page.

4

Once you’ve entered this information, you can choose to clone an existing page by selecting Clone Page within the campaign or choose to copy a custom page from another campaign by selecting Copy Page and choosing the campaign and page you want to copy from.

5

Click Save to create your page.

Using the Page Editor Tool

Once a page is created, you can use the Page Editor to customise it. This tool allows you to adjust the layout, add custom styles, and preview your page.

Navigating the Page Editor

1: Click on any page to open the Page Editor.
2: When the page loads, you will see a preview of how the page looks.
3: Use the Raisely Icon to return to the admin panel.
4: The Hamburger Menu allows you to search for pages to customise.
5: Clicking the Paintbrush Icon opens the CSS Style Sheet, where you can add custom CSS to your campaign.
6: The Help Icon (question mark) directs you to our help center if you need assistance.
7: The Undo and Redo Buttons allow you to reverse or redo recent changes.

Previewing the Page on Different Devices

1: Use the Device Icon in the top-right corner to switch between desktop, tablet, and mobile views.
2: This feature helps you visualize how the page will appear on different devices.
3: To get an accurate preview, copy the page URL and paste it into the browser of the device you want to view the page on.

Saving and Publishing Changes

1: After making changes, click the Save Button to save your progress.
2: The Eye Icon previews the page on your browser.
3: The Gear Icon lets you access additional settings for the page itself.

Customising Rows and Columns

In the page editor, you can add rows and columns to organize your page content. This section explains how to customize these elements.

How to Add and Configure Rows

1

In the page editor, click the Plus Sign at the bottom-right corner to add a new row or block.

2

Choose the row type and number of columns. Once selected, the row format cannot be changed.

3

To add a new row, click between existing rows or above/below them. The new row will follow the layout you selected.

4

Hover over the row to bring up the Gear Icon for customisation options, including:

Clicking on the Gear Icon to update the row background image and row height, among other formatting options.
Clicking on the Bin Icon to delete the row
Clicking on the Copy Icon to copy the row
Clicking on the Download Icon to save the row as a template

How to Customize Columns

1: Click on the Gear Icon of any column to access its settings.
2: You can adjust the background, add custom classes, and configure settings for individual devices (desktop, tablet, mobile).
3: Under the Advanced Tab, you can choose to hide the row for specific devices.

How to Customize Blocks

1: Hover over a block to bring up the Gear Icon for the block settings.
2: Customize the settings as necessary and explore the different tabs to adjust the block appearance.
3: Similar to rows and columns, you can hide or show blocks for different device types.

Saving and Applying Row Templates

In the page editor, you can save a row template, which you can then apply to other pages and even other campaigns in your Raisely account.

Steps to Save and Use Row Templates

1: Go to your campaign page and select the row you wish to save as a template, such as a header or footer row.
2: Hover over the row and click the Download Icon to save it as a template.
3: Give the template a unique name, such as Header Row Template for the header row or Footer Template for the footer row, and click Save.
4: Repeat this for any other rows you want to save as templates in your campaign.
5: To apply the saved template to a new page, click Create Page in the Pages.
6: Click the Plus Sign to add a new row, then select Templates and choose your saved template from the list.
7: Insert the template row wherever you want it on the page.
8: Once you're happy with the layout, click Save to confirm the changes.
9: To apply this template to a page in another campaign, go to the new campaign, create a page, and click Clone Page from an existing campaign.
10: Select the campaign and page with the template, copy it, and create the new page.
11: Once the page is created, you can edit it by replacing or adding template rows, such as the Header Row 1 or Footer Row 1.
12: Save the changes, and your row templates will be successfully applied to the new page in your campaign.

This process makes it easy to reuse your saved rows across campaigns and maintain consistency in your site’s design.

FAQ’s

### accordion

## expand

# How can I add more columns to my rows?

Once you have added a row with a column layout, you cannot make changes to the number of columns. Simplest way is to create a new row with your desired columns and move or copy Blocks across.

## expand

# Is there a way to restore deleted pages or unsaved changes made to a page?

We do not store deleted pages or unsaved changes. We always recommend duplicating pages if you're making changes, and saving changes constantly to prevent any loss of work.

## expand

### accordion

Cannot find the support guide you are after? Head on over to our YouTube channel 📺 for more creative content to help you go further. You can even leave us comments, suggesting new content ideas 🤯