All Collections
Program Setup
Share Tab
Customize the Hosted Landing Page
Customize the Hosted Landing Page

Use this guide to edit the Hosted Landing Page template

Updated over a week ago

The Hosted Landing Page allows you to build a landing page for your referrals within Referral Rock. No integrations are required when choosing this option.

When using our Hosted Landing Page as your referral page, use this guide to customize the template with your logo, images, text and form fields.

Upload your Logo

To import your own logo, click on the existing logo and select the image icon.

If you would like to adjust the size or location of the logo, use the corner arrows of the image to increase or decrease the size, and then use the adjustments menu to determine your alignment as shown below.

A gif displaying how to resize the logo on the hosted landing page

Adjust the Background

The template is compiled of 5 boxed-sections that can highlight various aspects of your brand/services. Each section can have its own unique background color, gradient, or image.

To adjust the background of a section, hover over the section and look for the image & wrench icons that sit at the bottom of the section to locate the box settings, as shown below.

A gif displaying how to change the background color of a section on the hosted landing page

Click on the image icon to upload a photo to use as the background for the section.

If you click on the wrench icon, you’ll see a Box Settings popup menu. This menu allows you to select a solid color for the background, as well as determine the content & text size & orientation for the box section.

Tip: You can move this menu by clicking & dragging the box to your desired location.

A gif displaying how to resize and change the color of text on the hosted landing page

Modify Text & Images

Customizing the template text & imagery is simple, just scroll down to the section and click on the elements you want to adjust. Once you click on an item, you’ll be able to see the corresponding menu items that you can select to make your adjustments.

For instance, to change an image under the customer reviews section, click on the image you want to change, and then select the image icon in the corresponding menu. To change the text of the reviews, click on the text and then begin typing your copy.

A gif displaying how to change an image and text on the hosted landing page

You can even change the typeface in each section using the text menu that populates when you click on any text on the page. To do this, highlight the text you want to edit, then click on the text icon in the menu and select a font from the dropdown menu as shown below.

We do not currently support the use of custom fonts or HTML.

A gif displaying how to change the font on the hosted landing page

Edit the Short Form

Editing the existing form is simple! First, locate the ‘Form Settings’ button that sits in the top banner of the page builder. This will generate a pop-up menu where you can toggle between various form features to make adjustments, as shown below.

A gif displaying how to edit the short form on the hosted landing page
  • Basic - Allows you to adjust the current form fields, you can also enable a ‘best way to contact’ and ‘company’ field on this page.

  • Custom Fields - Allows you to add additional fields to the form, in a dropdown or freeform text box format.

  • Button - Allows you to adjust the button color and style on the form.

  • Form Action - This allows you to determine what happens after a user submits their form. You can display a simple thank-you message, or set up a redirect to direct the user to a new site upon form submission.

  • Font Style - Allows you to customize the forms’ typeface, color, weight, and size.

Did this answer your question?