Updating Page Settings & Metadata in Smart Builder


If you want to add captivating images, descriptions, and titles to your landing page, plan on sharing your landing page to different media platforms, or are looking to improve your page's SEO rankings, you’ll want to update your page metadata and settings!

Updating your page’s title, description, keywords, and social sharing image can help improve how Google indexes your page. 

This article will describe how to update your page's metadata in Smart Builder and apply background settings & border properties to your entire landing page.  

Updating Page Metadata

To locate these Page Metadata properties,

  1. Navigate to your landing page in the Smart Builder.
  2. Click the Page Settingspage-settings-sidebartab within the Smart Builder header. A new tab will appear on the left.
  3. Within the Page Metadata tab, update the following sections:
    Annotated image of the Page Metadata section of Smart Builder - empty fields highlighted

Social Sharing Image: This image appears whenever a link to your landing page is shared on a website, such as Linkedin, Twitter, Facebook, and so on!

This image does not show up on your actual landing page. It’s visible only when sharing the link to your landing page. Upload an image of your choice; as a benchmark, we recommend an image size of 400 x 300 (width x height) pixels.

Title: This will be the title of your landing page that you’d like to appear on your social sharing site.

Description: A short introduction or description of your landing page. Keep it concise and be mindful of the wording.

Keywords: Include some keywords that pertain most to your landing page’s business or purpose.

Favicon: Upload your favicon image directly in Smart Builder. A favicon is an image of your brand's logo or icon that appears in the browser's address bar and next to the landing page's title. 

Updating Background Settings

Scroll down to the Backgrounds tab to change the background color of your landing page:

In the same tab, update the Padding for your landing page. Padding in CSS refers to the amount of additional space you want to add around the element (in this case, the entire landing page):

As an analogy, think of a cardboard box full of items. Your landing page content (sections, paragraphs, images, forms, copy, etc), refers to the content inside of the cardboard box. The padding is the bubble wrap or wrapping paper inside the box to add extra space between items.

Adding Border Properties

Navigate to the Borders tab to apply a custom border around your entire landing page.


Choose the border width, color, and style to apply the border around your entire landing page.

Be sure to Save and Publish your page when you're happy with these changes.