• Manage Pages

What are cookies?

Cookies may be set by a website so it can remember things about your visits, like your log-in information or what you have in your shopping cart – making for a seamless experience on the site. Some websites may also use cookies to serve relevant ads to its visitors. If you’d like to prevent a website from setting cookies, we recommend disabling third-party cookies, which stops most websites from using information in this way. Please see “How do I disable cookies?”

How do I disable cookies?

Identify the browser and operating system you’re using and follow the instructions below to disable third-party cookies. If you’d like to prevent any cookies from being set, you’ll follow the same steps – just select the option to disable all cookies instead.

Windows 

Internet Explorer 

  1. Select the gear in the upper-right corner, then select “Internet Options.”
  2. Click the “Privacy” tab.
  3. Select the “Advanced” button.
  4. Under “Third-party Cookies,” choose Block to automatically block cookies or Prompt to prompt with each cookie request.
  5. Click “OK.”

Chrome

  1. Select the Chrome menu icon.
  2. Click “Settings.”
  3. Select “Show Advanced Settings.”
  4. In the “Privacy” section, select “Content settings.”
  5. Check “Block third-party cookies and site data.”
  6. Select Finished.

Firefox

  1. Click the menu button and choose Options/Preferences.
  2. Select the Privacy panel.
  3. Set Firefox will: to Use custom settings for history.
  4. Set Accept third party cookies: to Never.
  5. Close the about:preferences page.

Edge

  1. Click the “More actions” button in the top-right corner. Select “Settings.”
  2. Click “View Advanced Settings.”
  3. Click the dropdown arrow under the Cookies field.
  4. Select “Block Only Third Party Cookies.”

Mac OS X

Chrome

  1. Select the Chrome menu icon.
  2. Select “Settings.”
  3. Select “Show Advanced Settings.”
  4. In the “Privacy” section, select “Content settings.”
  5. Check “Block third-party cookies and site data.”
  6. Select “Finished.”

Safari

  1. Choose Safari > Preferences
  2. Click “Privacy”
  3. Set “Block cookies” to “From third parties and advertisers.”

Firefox

  1. Click the menu button and choose Options/Preferences.
  2. Select the Privacy panel.
  3. Set Firefox will: to Use custom settings for history.
  4. Set Accept third party cookies: to Never.
  5. Close the about:preferences page.

iOS

Safari

  1. Tap Settings.
  2. Select Safari.
  3. Select Block Cookies.
  4. Choose Allow from Current Websites Only from the list. In iOS 7 or earlier, choose From third parties and advertisers.

Android

Chrome

  1. Tap Menu > Settings > Site settings.
  2. Tap Cookies.
  3. Uncheck Allow third-party cookies.
 

What is GDPR?

GDPR (General Data Protection Regulation) is a set of rules designed to give EU citizens more control over their personal data. Under GDPR, organizations must ensure that personal data is gathered legally and under strict conditions. It also requires that those who collect and manage data protect it from misuse and respect the rights of data owners.

 

Who does GDPR apply to?

GDPR applies to any organization operating within the EU, as well as any organizations outside of the EU that offer goods or services to customers or businesses in the EU.

 

What does GDPR say about cookies?

GDPR requires that cookies be treated as personal data and requires users to have the choice: they must either consent to using cookies or opt out.

All invoices can be viewed in the Billing & Invoices tab in the Domain Manager tile of your dashboard.

 
 
Yes, you can edit or change your domain’s nameservers directly in your domain manager tile.
 
 
Changing your nameservers can affect your live website or any other services that use your domain (such as email). You should make copies of your current records before moving or modifying the nameservers. 
 
Modifying your nameservers or any DNS records can take up to 48 hours to propagate.
 

 QR codes are black-and-white tiles with information encoded in them, such as links to websites and online menus. When scanned with a smart phone, the information is downloaded to your phone.

Those little black-and-white squares are making a huge comeback as businesses look to go contact free. And they’re especially valuable for restaurants. Now you can generate a QR code in A.I. Editor that takes users to any page on your website. Here are just a few ways to use them:

  • Place codes around your restaurant that take visitors directly to your menu – paper and contact free!
  • Post a code in your storefront to encourage visitors to order ahead with your online ordering platform.
  • Share codes on social media or in emails to direct users to any page you want. 

To update your meta keywords, select the Manage Your Site tile. 
 
 
Select Menu.
 
 
Select Manage Pages.
 
 
Hover over the page you want to edit and select the gear icon. 
 
 
Update the Meta Keywords field.
Note: Meta keywords tell search engines what your page is about. We recommend adding no more than 7. Keywords should be separated by commas.
To update a page description, select the Manage Your Site tile. 
 
 
Select Menu.
 
 
Select Manage Pages.
 
 
Hover over the page you want to edit and select the gear icon. 
 
 
Update the Page Description field.
Note: Page descriptions provide an explanation of what your page is about. Descriptions show up as subtext in search results and should stay under 160 characters.
Tip: Incorporate keywords people use to find your business online.
To update a page’s SEO title, select the Manage Your Site tile. 
 
 
Select Menu.
 
 
Select Manage Pages.
 
 
Hover over the page you want to update and select the gear icon. 
 
 
Update the SEO Title field
Note: SEO titles display in search engine results above the description and are typically the same as the page name. Example: Our Approach, Services, etc. They should be less than 60 characters.
Tip: Incorporate keywords people use to find your business online.​
To view your hidden pages, select the Manage Your Site tile.
 
 
 
Select “Menu”.
 
 
 
 
Select “Manage Pages”.
 
 
To only see the pages you’ve marked visible, toggle the View Hidden Pages Button to “No”.
 
 
To view all pages, including hidden ones, toggle the View Hidden Pages button to “Yes”.

To add a new page to your website, select the Manage Your Site tile.

Select “Menu”.

Select “Manage Pages”

Settings

Select the “Settings” icon to change the page name, update link settings, and add an SEO title, page description, and meta keywords.

Page Visibility

Select the “Page Visibility” icon to hide a page on your navigation bar or to make it visible.

Duplicate a page

​

Select the “Duplicate” icon to duplicate a page.

Delete a page 

Note: We don’t recommend deleting a page. We recommend hiding it in case you’d like to view or use it again.

Select “Delete” to delete a page.

 

QR codes store data using patterns of black dots and white spaces arranged in a square grid. These patterns can be scanned and translated into human readable information with the help of an imaging device like a camera or a scanner, although the most common way to scan QR codes is to use your smartphone’s camera and a specialized app for reading QR codes.

Where to locate:

 

  1. Log in to your dashboard 
  2. Select the Website tile
  3. Select the Menu on the top left
  4. Select Manage Pages
  5. Hover over the page you would like to generate a QR code for
  6. Select the QR code icon
 
Select the Website tile.
 
 
 
 
Select Menu on the top left.
 
 
 
Select Manage Pages.
 
 
 
Hover over the page you would like to generate the QR code for and select the QR code icon.
 
 
 
A window will appear displaying the QR code. Select Download to download it to your computer as an image. 
To delete a page, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Pages”.
 
 
Hover over the page you’d like to delete and select the trash icon.
To duplicate a page, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Pages”.
 
 
Hover over the page you’d like to duplicate and select the duplicate icon. 
 
 
The page is now duplicated.
 
 
Select the gear icon to update the duplicated page’s name. 
 
 
Select “Save”. 

                      

To hide a page, select the Manage Your Site tile. 
 
 
Select Menu.
 
 
Select Manage Pages.
 
 
Hover over the page you want to hide and select the gear icon. 
 
 
Toggle the Hide From Search Engines button to “On”.  This will prevent search engines from indexing your page. 
To make changes to your website’s pages, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Pages”.
 
 
Hover over the page you want to make a sub page and select the Arrange icon.
 
 
Drag the page under and to the right of the page you would like to be the parent page.
 
 
The page is now a sub page.
 
To make a page visible/hidden, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Pages”.
 
 
To view hidden pages, toggle the Hidden Pages button to “Yes”.​ 
 
To make changes to the header on your website, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Pages”.
 
 
Hover over the page/link you’d like to move. Select the arrange icon, and drag and drop. 
 

Drag the page/link to your desired position.
To set a page as your home page, select the Manage Your Site tile. 
 
 
Select Menu.
 
 
Select Manage Pages.
 
 
Hover over the page you want to set as your home page and select the gear icon. 
 
 
Toggle the Set as Home Page button to “On”. 
 
To add a 301 redirect, select the Manage Your Site tile. 
 
 
Select Menu.
 
 
Select Manage Pages.
 
 
Hover over the page you want to edit and select the gear icon. 
 
 
Update the Set 301 Redirects field. 
Note: A 301 redirect indicates the permanent moving of a page from one location to another. Enter the link of the old page (/pagelink) you’d like to redirect below. We’ll make sure users are directed to your new page. 
Tip: Hit Enter after a page to add multiple pages. 
To add a new page to your website, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Pages”.
 
 
Select the “+” icon to add a new page
 
A pop-up will appear. Select “New”. 
 
 
The new page has been created. 
 
 
Edit the page name and select “Save”.
Note: Page name, internal link, and SEO title should match the page name.     
 
 
The new page has been updated.

Yes, we’ll generate the QR code based on the external link configured for the page.

Any page of your website can be encoded as a QR code. You can give that code to your customers, and when they scan it, it allows them to navigate to that specific page.
Once you generate the QR code, you can download it as an image and share it the following ways. 
  • You can share it on social media.
  • You can add it to print media like cards and banners. 
You can generate a QR code for your home page or any other pages in your Manage Pages section.

If the URL changes, the QR code will no longer work. You will need to generate a new QR code.

No, QR codes can’t be generated for a dead link or anchor block. The link type selected must be Internal or External.
 
  • Update Style

To update the main colors on your website, select the Manage Your Site tile.

Select “Menu”.

Select “Update Style”.

Select the Colors section to update the colors throughout your website.

Here you can update your primary and secondary colors. Enter a color code or select a color from the color wheel. Select Save.

 

Select fonts for each element of your site. Save them to create your custom package.
Note: You can still make changes to fonts with the Text Editor even if you apply a custom font package.
 
 
Custom Font Package is located in Manage Your Site>Menu>Update Style>Font>Custom Font Package
 
To create a custom font package, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
 

Select the Update Style section. 

 
 
 
Select the Font section.
 
 
 
Select the Custom Font Package tile. 
 
 
 

Select fonts for each element of your site. Save them to create your custom package.

Note: You can still make changes to fonts with the Text Editor even if you apply a custom font package.
 
 
 
Below are your headings: H1, H3, and H5
 
 
Select a specific font you would like to use for each heading.
 
 
 
Customize your font with the Bold, Italic, or Underline options. 
 

 
 
 
 
Adjust font size. 
 
 
 
Adjust font weight (thickness of the font). 
 
 
 
Adjust letter spacing (the space between letters). 
 
 
Adjust the line height (the vertical distance between lines of text).
 
 
 
Adjust the text case (uppercase, lowercase, or capitalize).
 
 
 
Each font element has the same customization options.
 
 
 
Below are your sub-headings: H1, H3, and H5
 
 
 
Adjust your paragraph text and text for block quotes.
 
 
 
Under the Buttons section, adjust how your font appears on both Default and Hover view. 
 
 
 
Under the Navigation Links section, adjust how your font appears in your navigation/header links.
 
 

Under the Forms section, adjust Labels and Input Fields.
 
 
Select “Responsive Fonts” to adjust how your fonts appear on mobile devices.  
 
 
 
You have three mobile font options: Small, Medium, and Large
 
 
 
When you’re done creating your font package, select the Save & Apply button. 
 
 
The font package will now be applied to your website.
 
 
If you would like to adjust your font package, select the Edit Package link. 

To add animation to your website, select the Manage My Site tile.

Select “Menu”.

Select “Update Style”.

Select Animations.

Select an animation you would like to add to all pages. 



  • Change Site Design

To change your website’s design, select the Manage Your Site tile.

Select “Menu”. 

 

Select “Change Site Design” to browse our big-brand inspired frameworks and apply one to your site.

 

Select a brand to preview your site in that style.

 

Below you can see the specific design characteristics of your selected brand.

 

Select “Preview” to preview your site in that style.

 

Select “Apply” to apply that style to your website.

 

  • Manage Blocks

To edit your slider block, select the gear () on the upper right hand corner of the block you want to edit.

 

In A.I Editor, each block added to a page has its own settings. Make sure you select the gear for the appropriate block.

You can edit several aspects of a slider block:

  • Content: Changing the slider block image and copy.
  • Media: Changing the background image of the block.
  • Overlay: Changing the color of the background slider.
  • Dimensions: Changing the height and width of the block.

Content:

You can select the “pencil” icon to edit the copy or content on that specific slider. Select the “X” to delete the slider. 

You can also toggle between enabled or disabled so your slider can either be hidden or show.

 

 The slider image, title, subtitle, description, and alt text can be edited here:

 

 The advanced settings on this menu allow you to modify what happens when the page link is clicked:

  1. Link Name is what appears after the forward slash (ex. www.mywebsite.com/aboutus).
  2. Link type allows you to modify if clicking on the link takes you to a page on the same website (internal link), redirects you to a different website (external link), or creates a pop-up on the same page (pop-up).
  3. “Open In New Tab” will open a new browser tab when the link is clicked.

Media:

Selecting Media from the settings menu opens your media library. This is where you can change the background image for your slider block.

Overlay:

Selecting Overlay allows you to adjust the colors and Gradient Direction on your slider block.

Dimensions:

Selecting Dimensions allows you to set Height, Width, and Parallax settings for your slider block.

 

You can edit your slider block settings by selecting the Gear () at the upper right corner of the slider block.

You can edit the following settings for the slider block:

  • Content: Changing the slider block image and copy.
  • Media: Changing the background image of the block.
  • Overlay: Changing the color of the background.
  • Dimensions: Changing the height and width of the block.
  • Delete (Trash icon): Deletes the slider block.
To add a slider block to your website:
1. Log in to your dashboard and select “Manage Your Site”.
 
 
2. Select the page you want to add a slider block to.
 
3. Select “Menu”. This will open the menu to the left. Select “Manage Blocks”.
 
 
4. Then “Add Block”.
 
 
5. Select “Slider”.
 
 
 
6. Select a slider style from the options.
 
 
 
This will add the slider to your page.
 
 
 
You can also select the “+” button in the middle of any page and select “Slider” from the menu to add a slider block.
 
 
To create a pop up, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Blocks”.

                    

 
 
To configure a pop-up window, select “Pop-ups”.
Note: Create the page you would like to display as the pop-up first, then you can configure the pop-up window
 
 
Select the page you would like the pop-up to appear on.
 
 
Select the page you would like to display as a pop-up from the drop-down menu. 
 
 
Here is an example of how a pop-up will display:
 
 
There are four pop-up settings:
 
Load Pop-up After (seconds): Select how many seconds you’d like visitors to be on the site before the pop-up appears.
 
 
Pop-up Size: Select your pop-up window size: small, medium, or large.
 
 
Background Opacity: Set the background opacity of your pop-up.
 
 
Display Pop-Up Only Once: Check the box to have the pop-up display once per user.
 
 
Once the pop-up is configured, you can make changes to your settings by selecting the “Configured” icon.
 
To add links to your social media, select the Manage Your Site tile.
 
 
Select “Menu”.
 
 
Select “Manage Blocks”.
 
 
Select “Social Icons” to add social media icons to your social profile module.
 
 
We can display 12 social platforms:
Facebook
Twitter
LinkedIn
Pinterest
Flickr
Google Places
Instagram
Yelp
YouTube
Trip Advisor
Weibo
Houzz
 
Add the link to the social platform to the corresponding field.
 
 
 Toggle the button to “On” to display that icon on the site.
 
 
After you’ve added the links, the icons will appear on the site.
 
 
Hover over the icons and select the gear symbol to access your social profile settings.
 

                        

 

To arrange the blocks on your website, select the Manage Your Site tile.

 

Select “Menu”.

Select “Manage Blocks”.


                       

Select “Arrange Blocks” to change the order blocks appear on your site.

 

When you hover over a block, you’ll see a drag and drop icon. Drag and drop the block to your desired location.

 

When you’re done arranging blocks, select “Done”.



 

To add a blank custom block to your website, select the Manage Your Site tile.

 

Select the A.I. Editor Menu.

 

Select Manage Blocks.

 

Select Add Block.

 

Scroll down to Custom.

 

View the available layouts.

 

Hover over the layout you want to use and select the “+” icon. 

\

 

The new blank custom block will be added to your page.

 

To add a pre-styled block or section to your website, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Manage Blocks”.

 

To add a new block to your site, select “Add Block”.

 

Select a block category to view pre-styled blocks.

 

Hover over the block and select the “+” icon to add it to your site. 

 

The new block will be added to your page. Repeat the steps above to add additional blocks.

                     

  • Website Settings

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select SEO.

 

The site description is visible in search engine results and should include a brief description of the business. We recommend no more than 160 characters.

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select SEO.

 
Select the trash can icon to delete the existing favicon.
 
 
Select “Click to upload” to upload a new favicon. Your new favicon will display on your browser tab next to your website title.

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select SEO.

 
Add meta keywords relevant to your site. Keywords should be separated by commas.
 

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select SEO.

 
Update the Site Title field. The site title will display on the browser tab.
 

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select “API Integrations” to add your Google Tag Manager ID.

https://tagmanager.google.com

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select SEO.

 
Toggle Index Site to “Off” to hide your website from search engines.
 
 
 
If your website is live and you want search engines and search engine users to find you, toggle Index Site to “On”.
 

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 
Select “Custom Code” to add third-party embed codes (live chat, site verification, etc.).

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select “API Integrations” to add Google Analytics and Google Tag Manager IDs.

https://analytics.google.com

https://tagmanager.google.com

To update your website description, select the Manage Your Site tile.

 

Select “Menu”.

 

Select “Website Settings” to access your site’s settings.

 

Select API Integrations.

Add your Facebook Pixel ID. This collects data that helps you track conversions from Facebook ads, optimize ads, build targeted audiences for future ads, and remarket to people who have already taken some kind of action on your website.

https://www.facebook.com/business/learn/facebook-ads-pixel

 

To update your website description, select the Manage Your Site tile.

Select “Menu”.

Select “Website Settings” to access your site’s settings.

 

Select API Integrations.

 

Add a Google reCAPTCHA. reCAPTCHA is a free service from Google that protects your website from spam.

https://www.google.com/recaptcha

Select the Website tile. 
 
 
 
 
Select Menu on the top left.
 
 
 
Select Website Settings.
 
 
 
Select Go Live.
 
 
 
Select the toggle to take your website live. 
  • Integrations
To add the Tawk.to plugin to your website:
  • Log in to your dashboard 
  • Select the Website tile
  • Select Menu on the top left
  • Select Integrations
  • Select the Tawk.to plugin
Select the Website tile.
 
 
 
Select Menu on the top left.
 
 
 
Select integrations.
 
 
 
Select Chat.
 
 
 
You can see Tawk.to is the available chat plugin. Select +Configure. 
 
 
 
A window will appear. Select Next.
 
 
 
Follow the steps to complete setup.
To add the iHomefinder plugin to your website: 
  • Log in to your dashboard 
  • Select the Website tile
  • Select Menu on the top left
  • Select Integrations
  • Select the iHomefinder plugin
Select the Website tile.
 
 
 
Select Menu on the top left.
 
 
 
Select Integrations.
 
 
 
Select Real Estate.
 
 
 
Select the +Configure link.
 
 
 
 
Select Get Started.
 
 
 
Enter your Client ID number.
 
 
 
Now that the Client ID has been added, select Add Block.
 
 
 
 
The iHomefinder plugin will display in your new block.
 
The Integrations section in A.I. Editor allows users to configure and utilize available third-party integrations like Tawk.to and iHomefinder.
 
Where to locate:
  • Log in to your dashboard 
  • Select the Website tile
  • Select the Menu on the top left
  • Select Integrations
  • Select the available third-party plugin
Select the Website tile.
 
 
 
Select Menu on the top left.
 
 
 
Select the integrations section.
 
 
 
Select the available third-party plugin.
 
 
 
For this example, let’s select chat. You can see Tawk.to is the available chat plugin. Select the +Configure link 
 
 
 
A window will appear, select Next.
 
 
 
Follow the steps to complete setup.
  • A.I. Editor Main User Bar​
Yes, the undo/redo feature in our Website Editor (A.I. Editor) allows you to undo and redo edits you make to your website.
 
The Undo and Redo buttons are located next to the Publish and Preview buttons in the upper right hand corner of the editor.
 
 
 
Undo and redo work for the following:
  • Custom block elements
  • Span settings
  • Flex row settings
  • Block features such as add, delete, and re-arrange blocks
 
Undo and redo will not work for the following:
  • Type\module blocks
  • Settings such as website settings and integrations
 
Once you’re happy with your changes, select “Publish”. 
 
You can undo or redo up to 25 edits.
 
 
 
 
Keep in mind that changes stored by the undo and redo function will be lost if the page is refreshed (F5 in most browsers), or if the tab is closed and reopened, or if you log out of A.I Editor or your dashboard.
Your A.I. Editor lets you make updates to your site, apply new styles, and manage backend settings in real-time.
To preview your website on different devices, select the Manage Your Site tile.
 
 
Select the drop-down menu next to the desktop icon. 
 
 
Here you can select to view your website on Mobile, Tablet, and Desktop.
 
 
Mobile View:
 
Tablet View:
 
 
Desktop View:

                    

To preview your website, select the Manage Your Site tile.

 
At the top right corner of A.I. Editor, select the Preview button to preview your website. The preview link will open in a new browser tab.
 
 
To edit a page of your website, select the Manage Your Site tile. 
 
 
Select the drop-down arrow next to Select Pages.
 
Here you can view all your site’s pages.

     ‘

 
 
You can also search for a specific page. 
 
 
Select “Manage Pages” to view additional options. 
 
 
The Manage Pages menu will appear. 
  • Logo
To make changes to your website’s header, select the Manage Your Site tile.
 
Hover over the header section and select the gear icon.
 
 
Select Logo.
 
 
Select “Advanced Settings” to view additional logo settings. Drag the circle icon to adjust the padding around the logo.
To make changes to your website’s header, select the Manage Your Site tile.
 
Hover over the header section and select the gear icon.
 
 
Select Logo.
 
 

To replace your logo, select the “Choose a different file” link.

 

Drag and drop the file or click to upload one.

 

The logo is now updated.

To make changes to your website’s header, select the Manage Your Site tile.
 
 
Hover over the logo and select the “+” icon. 
 
 
Select the Sticky Header tab. 
 
 
Select the Advanced Settings link.
 
 
Use the bar to adjust the logo padding. We recommend keeping the number of pixels consistent on both Default and Sticky Header.  
To make changes to your website’s header, select the Manage Your Site tile. 
 

Hover over the logo and select the “+” icon. 

 
 
Select the Sticky Header tab. 
Adjust the sticky header logo width. We recommend keeping the width consistent on both Default and Sticky Header.
 
To make updates to your website’s header, select the Manage Your Site tile.
 
Hover over the header section and select the gear icon.
 
 
Select Logo.
 
 
To change the logo’s background color, select a color from the color wheel or enter a color code.
 
 
You can select your background color’s opacity from the color wheel pop-up.
 
 
Select Use Style Colors to use your site’s primary and secondary colors.
 

To make changes to the header on your website, select the Manage Your Site tile.

 

Hover over your logo and select the “+” icon. 

 
 

Select the Sticky Header tab. 

 

In the Logo Positioning section, use the up, down, left, and right arrows to move the logo to your desired location.

 

Scroll down on your website to view the sticky header position. 

 
 
To make changes to your website’s header, select the Manage Your Site tile.
 
Hover over the header section and select the gear icon.
 
 
Select “Logo” to replace the logo, add image alt text, and adjust the logo’s position, width, padding, and background color.
 
 
Select the arrows to move your logo left, right, up, and down.
 
 

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select Logo.

 

Use the arrows or enter a number (in pixels) to adjust the logo’s width.

Note: After adjusting the logo width, you will need to adjust the position of the logo.



To make changes to your website’s header, select the Manage Your Site tile.
 
Hover over the header section and select the gear icon.
 
 
Select Logo.
 
 
Select the Advance Settings icon link.
 
 
Update the Image alt text field. Add a brief description of your image to help with SEO and ADA compliance.
  • Header Style
No, the header block cannot be moved because it’s required to stay on top of the page.
 
But any other block that has been added to the header section can be moved.
Yes, you can add a block to the header section of your website.

 

Assigning a block to your header or footer allows you to:

  • Add any blocks to the “Header Section”.

  • Re-arrange or move a block into the header.

  • Hide/Show the header on a page level.

 
1. To add a block to the header section, hover over the header section and select the “+” icon. This will add a block to the page.
 
2. To move the block to the header, simply drag the block into the header section.
 
This will make the block visible on all pages.
 
3. Toggle the “Show on page” button on\off to show\hide the block.
 

To make changes to your website’s header, select the Manage Your Site tile.

 

Select the Edit Header Gear icon.

Select Style. 

 

 
Use the bar to adjust the top and bottom padding on the scrolling header. We recommend keeping the number of pixels consistent on both Default and Scrolling.

To make changes to your website’s header, select the Manage Your Site tile.

 

Select the Edit Header Gear icon.

Select Style. 

Use the bar to adjust the right and left padding on the scrolling header. We recommend keeping the number of pixels consistent on both Default and Scrolling.

 

To make changes to your website’s header, select the Manage Your Site tile.

 
Select the Edit Header Gear icon.
 
Select Style. 
 
 
Select the Scrolling tab.
 
 
Use the bar to adjust navigation padding on the scrolling header. We recommend keeping the number of pixels consistent on both Default and Scrolling.
 
 

To make updates to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select “Style” to style your header.  

 

Enter a color code or select a color from the color wheel.

 

To make changes to your website’s header, select the Manage Your Site tile.

 
 

Select the Edit Header Gear icon.

Select Style.

Select the Scrolling tab.
 

Select a color from the color wheel or enter a color code. 

 
 
You can also adjust the transparency of the color.
 
 

Select the check box to use the Primary and Secondary colors that have been applied to your site.

 

To make changes to your website’s header, select the Manage Your Site tile.

 
 

Select the Edit Header Gear icon.

Select Style.

To change your main background color, select a color from the color wheel or enter a color code.

 

Enter a color code or select a color from the color wheel. 

 

Select the “Use Style Colors” check box to use the primary or secondary color already applied to your website.

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select “Style” to style your header.  

 

To change the default color of the navigation links, select a color from the color wheel or enter a color code.

 

To make changes to your website’s header, select the Manage Your Site tile.

 
Select the Edit Header Gear icon.
 
Select Style. 
 
 
Select a color from the color wheel or enter a color code. 
 
Select the check box to use the Primary and Secondary colors that have been applied to your site.

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

Select “Style” to style your header.  

 

Select the Settings link.

 

Select the number of links you’d like to display in your header.

 

Before:

 

After:

 

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select “Style” to style your header.  

 

“Navigation Padding” increases or decreases the space between navigation links.

 

Before:

 

After:



 

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select “Style” to style your header.  

 
Use the slide bar to adjust the left and right position of your header.
 
 
The header will indent equally on both sides. 
 

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select “Style” to style your header.  

 
Use the controls under “Position” to position your header and adjust its size. “Top & Bottom” increases or decreases the space above and below the navigation links.
To make changes to your website’s header, select the Manage Your Site tile.
 
 
Select the Edit Header Gear icon.
 
 
Select Style. 
 
 
Select the Scrolling tab.
 
 
Select a link color from the color wheel or enter a color code. 
 
 
Select the check box to use the Primary and Secondary colors that have been applied to your site.
 
 
The link color has been adjusted.

To change the layout of your website’s header, select the Manage Your Site tile. 

 

To make edits to your header, hover over the header section and select the gear icon.

 

Select “Layout” to view the following layout options:

  • Left Align
  • Center Align
  • Pill Navigation

Below are examples of each layout:

Left Align

                  

Center Align

                  

Pill Navigation
                  

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select “Style” to style your header.  

 

Select the Settings link.

 

Select the checkbox to show a drop-down menu on hover.

 

To make changes to your website’s header, select the Manage Your Site tile.

 

Hover over the header section and select the gear icon.

 

Select “Style” to style your header. 

 

Select the Settings link.

 

Toggle the Sticky Header button to “On”.

 

To make changes to your website’s header, select the Manage Your Site tile.

 

Select the gear icon at the top right corner of the header.

Select Style. 

 
 
Select the Scrolling tab, and then select your new color.
  • Header CTAs

To add CTA buttons to your website’s header, select the Manage Your Site tile.

 

To make edits to your header, hover over the header section and select the gear icon.

 

Select “CTAs” to add, delete, and edit call-to-action buttons in your header.

 

Select the “+” icon to add a new CTA. You can add up to three.

 

Select the “Add CTA” link to add another CTA to your header.

 

New CTA added.

 

Select the eye icon to enable the button to be visible on your header.

 

To add CTA buttons to your website’s header, select the Manage Your Site tile.

Hover over the header section and select the gear icon.

 

Select “CTAs” to add, delete, and edit call-to-action buttons in your header.

 
Select the eye icon to hide the button in your header.
To make changes to your website’s header, select the Manage Your Site tile.
 
 
Hover over the header section and select the gear icon.
 
 
Select “CTAs” to add, delete, and edit call-to-action buttons in your header.
 
 
Select the Trash icon to delete a button.
To make updates to your website’s header, select the Manage Your Site tile.
 
 
Hover over the header section and select the gear icon.
 
 
Select “CTAs” to add, delete, and edit call-to-action buttons in your header.
 
 
If you have multiple buttons, select the drag and drop icon to move a button to a different position.
To make changes to your website’s header, select the Manage Your Site tile.
 
 
Hover over the header section and select the gear icon.
 
 
Select “Location” to add your address to your header.
 
 
Select “Show” to display the address. Select the pencil icon to edit the text and select the “x” icon to delete the location.
 
 
A pin icon will appear in your header and your address will show upon hover.
 
  • Block Settings

To add a background image to a block or website section, select the Manage Your Site tile.

 

Hover over the block and select the gear icon.

 

Select the Media icon.

 

Drag and drop an image from your computer or select the drop-down option to browse images from our media repository, your social media accounts, and Google.

Note: Google images are labeled for reuse.

Add a single image to create a still background. Add multiple images to create a slideshow.



To add a video background, select the Manage Your Site tile.

 

Hover over the block where you want to add the video background and select the gear icon.

 

Select the Media icon.

 

Select the Video tab to browse videos from our media repository.

 

You can also search for images and videos using keywords.

 

Select the video to add it to the Manage Block Background pop-up.

 

Drag and drop to reorder the images/videos once they are added.

 

Before:

 

After:



To add a placeholder image, select the Manage Your Site tile.
 
 
Hover over the block where you want to add the image and select the gear icon. 
 
 
Select the Media icon.
 
 
Select “Advanced Settings” to view additional settings.
 
 
Select “Mute Sound” to mute the video, change the amount of time each image/video appears, and update the mobile image if using a video only background.

                        

To add an overlay, select the Manage Your Site tile.
 
 
Hover over the block where you want to add the overlay and select the gear icon. 
 
 
Select the Overlay icon.
 
 
Enter a color code or select a color from the color wheel. Adjust the transparency as needed.
 
 
To add a color gradient to your background, select the Manage Your Site tile.
 
 
Hover over the block where you want to add the background and select the gear icon. 
 
 
Select the Overlay icon.
 
 
Enter a color code or select a color from the color wheel. Adjust the transparency as needed.
 
 
Add a second color to create a gradient effect. Select the second color wheel.
 
 
Enter a color code or select a color from the color wheel. Adjust the transparency as needed.
 
 
Select the drop-down arrow to choose a gradient direction: 
 
Horizontal
 
Vertical
 
Angle Up
 
Angle Down
 
 
Background Gradient Overlay Example:
To add a SVG to your website, select the Manage Your Site tile.
 
 
Hover over the block where you want to add the SVG and select the gear icon. 
 
 
 
Select the Overlay icon.
 
 
Toggle the Add Shape On Overlay button to “On”. 
 
 
Select the next arrow to scroll through the available graphics.
 
 
Select a graphic to add it to the block.

To make a block full width, select the Manage Your Site tile.

 

Hover over the block and select the gear icon.

 

Select the Dimensions icon.

 

Toggle the Full Width button. The content in this block will now display from edge to edge.

 

Before full width enabled:

 

After full width enabled:



To make a block full height, select the Manage Your Site tile.

Hover over the block and select the gear icon.

Select the Dimensions icon.

Toggle the Full Height button to enable full block height.

To make changes to a block/section of your site, select the Manage Your Site tile.

 

Hover over the block and select the gear icon.

 

Select the Dimensions icon. Below are your available options.

 

Padding Locked: Ensures equal padding on the top and bottom of the block.

 

Unlock Padding Constraint: Allows you to adjust the top and bottom padding separately.



To add a parallax effect on your site, select the Manage Your Site tile.

 

Hover over the block where you want to add the effect and select the gear icon.

 

Select the Dimensions icon.

 

Toggle the Parallax button to “On”. Parallax scrolling is a feature where background images move past the camera more slowly than foreground images, creating an illusion of depth.



To name a block, select the Manage Your Site tile.

 

Hover over the block and select the gear icon.

 

Select the Dimensions icon. 

 

Name the block under the Block Name field.



To delete a block, select the Manage Your Site tile.
 
Hover over the block and select the gear icon. 
 
 
Select the trash icon to delete the block. Please note, this can’t be undone. 
 
 
A confirmation pop up will appear. Select “Yes” to delete the block permanently. 
  • Custom Block Settings​

To add a shadow to a frame on your website, select the Manage Your Site tile.

 

Hover over the block and select the column settings icon.

 

Select the Frame icon.

 

Select the Shadow tab.

 

Select the color icon to select a color from the color wheel or enter a color code.

 

To change the height of a frame on your website, select the Manage Your Site tile.

 

Hover over the block and select the column settings icon.

 

Select the Frame icon.

 

Use the bar or enter a number to adjust the frame height.

 

The frame height has been adjusted.



 

To adjust the horizontal shadow of a frame on your website, select the Manage Your Site tile.

Hover over the block and select the column settings icon.

 

Select the Frame icon.

 

Select the Shadow tab.

 

Use the bar to adjust the frame’s horizontal shadow.

 

The horizontal shadow has been adjusted.

 

To adjust the shadow blur radius o a frame on your website, select the Manage Your Site tile.

 

Hover over the block and select the column settings icon.

 

Select the Frame icon.

 

Select the Shadow tab.

 

Use the bar to adjust the shadow blur radius.
 
The shadow blur radius has been adjusted.

 

To adjust the shadow spread of a frame on your website, select the Manage Your Site tile.

 

Hover over the block and select the Column Settings icon.

 

Select the Frame icon.

 

Select the Shadow tab.

 

Use the bar to adjust the shadow spread.

 

To adjust the vertical shadow of a frame on your website, select the Manage Your Site tile. 

                      

 
 
Hover over a block and select the Column Settings icon.
 
 
Select the Frame icon.
 
 
Select the Shadow tab.
 
 
Use the bar to adjust the frame’s vertical shadow.
 
 
The vertical shadow has been adjusted.

                  

To remove an element on the mobile version of your website, select the Manage Your Site tile. 

Select the element you want to remove and then select the Style icon.
Select the toggle button to remove the element from the website on mobile. 
 

To add a frame to your website, select the Manage Your Site tile.

 

Hover over the block where you want to add the frame and select Column Settings.

 

Select the Frame icon.

 

Use the arrows to view the different frame options.

 

The selected frame will be applied to the container.

 

Select the color option to change the frame’s color.

​

The new frame color has been applied.

Note: The frame will expand once you add additional elements.  

 

Select Column Settings.
 
 
Select the Frame icon.
 
 
Select the color option to change the frame’s color.
 
 
Enter a color code or select a color from the color wheel.
Select the Column Settings icon.
 
 
Select the Frame icon.
 
 
Use the arrows to view the different frame options.
 
 
Select a frame to apply it to the container.
 
Select Column Settings.
 
 
Select Alignment and then select your desired alignment option.
 
 
Top Alignment:
 
 
Center Alignment:
 
 
Bottom Alignment:
Select Column Settings.
 
 
Select “Add Container Color” to add a background color. Select a color from the color wheel or enter a color code. Adjust the transparency as needed.

Select Column Settings.

 

Select “Add Container Color” to add a background color. Select a color from the color wheel or enter a color code. Adjust the transparency as needed.

 

Select “Add Secondary Color” to add a second color.

 

Select a direction for the color gradient.

 

The new color has now been applied.

Note: More of the background will be visible once you add additional elements.  

 

Select Column Settings.

 

Select the Image/Color icon.

 

Select a direction for the color gradient.

 

The new gradient direction has been applied.

Note: More of the background will be visible once you add additional elements.  

 

Select Column Settings.
 
 
Select the Image/Color icon.
 
 
Scroll down to Container Image Dimensions and use the bar to adjust the dimensions. These are advanced options. We recommend using the default settings.
Select Column Settings.
 
 
Select the Image/Color icon.
 
 
Use the Left/Right bar and Up/Down bar to adjust the position of the container. These are advanced options. We recommend using the default settings.

In each container there are three styling options:

Alignment

Container

Frame

 

Alignment changes the position of your first element: top, center, or bottom

Top alignment:

 

Center alignment:

 

Bottom alignment:

 

Select Span Settings and then select the Container icon. The following are your styling options:

  • Container Image
  • Add Container Color
  • Container Position
  • Remove Element on Mobile

Select the Container icon to add a container image.

Drag and drop an image or click to upload one from the Media Library.

 

The container image has now been added.

Note: More of the image will be visible once you add additional elements. 

 

Add a color overlay to the image under “Add Container Color”. Adjust the transparency under “Transparency”.

 

Image dimension set to 100:

 

Image dimension set to 60:

 

Adjust the position of the background image under “Container Position”. By default, the image is set to center. Adjust the image left to right and top to bottom.

 

Select “Remove Element on Mobile” to hide an element when viewed on a mobile device.

Select Column Settings.

 

Select the Image icon to add a container image.

 

Drag and drop an image or click to upload one from our Media Library.

 

The container image has now been added.

Note: More of the image will be visible once you add additional elements.  

 

To make changes to a frame on your website, select the Manage Your Site tile. 

Hover over the block and select the Column Settings icon.

 

Select the Frame icon.

 

Use the bar or enter a number to adjust the frame width.

 

The frame width has been adjusted.

 

  • Customer Block Text Options

To add a shadow to text on your website, select the Manage Your Site tile.

 

Select the text, and then select the Styling icon.

                    

Select the Shadow tab.

 

Select a color from the color wheel or enter a color code.

 

                   

Adjust the Horizontal, Vertical, and Blur Radius of the shadow.

 

 

 

 

To make changes to your website’s text, select the Manage Your Site tile. 

 

 

 
 
 
 
 
 
 
 
 
 
 
 
 
 
Select the text you want to adjust, and then select the Styling icon.  
 
 
Use the bar or enter a number to adjust the with of your text.
 
 
The text has been adjusted. 
 
\

To make changes to the text on your website, select the Manage Your Site tile. 

Select the text you want to delete, and then select the Trash icon.

 

To make changes to the text on your website, select the Manage Your Site tile.

 
 
Select the text you want to hyperlink. If you only want to hyperlink a specific word, highlight it. Select the Link icon.

 

You can link to an internal page. 

 
You can also link to an external URL.
 

Select Save to create the hyperlink.

 

To make changes to the text on your website, select the Manage Your Site tile.

 
Select the text you want to adjust. Select the Styling icon. 
 

Select the check box to keep text on a single line.

 
 
The text has been adjusted. 
 

To make changes to the text on your website, select the Manage Your Site tile. 

Select the text you want to adjust, and then select the Styling icon.

 
Use the tilt position section to adjust the text. Use the bar to move the position or enter a pixel number. 
 
 

To make changes to the text on your website, select the Manage Your Site tile.

 

Select the text you want to adjust, and then select the Styling icon. 

 

Scroll down and select “Text Truncation”. 

 

Toggle the button to enable the truncate option and enter the number of text characters you would like to display.

 
A Read More button will now be added to the text. 

 

To add text to your website, select the Manage Your Site tile.
 
 
Select the “+” icon to add an element.
 
 
Hover your cursor over the Text icon. You can select H1–H6 and Paragraph.
 
 
For this example, we will select H3 and replace the default text.
 
 
Select the “+” icon to add another element. 
 
 
Select the additional element you would like to add. For this example, we will select Text > H6.
 
​
To adjust your text, select the Manage Your Site tile.
 
 
Select the text you want to adjust, and then select the Styling icon. 
 
 
Use the Text Position section to move the text left/right and up/down. Use the bar or enter a pixel number. 
To change the size of text, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon.
 
 
Use the arrows to select a new font size. 
To change your font, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon.
 
 
Select a font style.
 
 
Search for a font.
 
 
Select your desired font. 
To adjust letter spacing, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon.
 
 
Select the arrows to adjust the letter spacing. 
To change the line height of text, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon. 
 
 
Select the arrows to adjust line height.
Tip: The line height number should be double your font size. 
To change text case, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon.
 
 
Select your desired text case:
None: How you’ve typed the text
Lower case: All text will display lower case
Upper case: All text will display upper case
To change the color of text, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon.
 
 
Select the paint bucket icon. Enter a color code or select a color from the color wheel. 
To change the alignment of text, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon. 
 
 
Select the Alignment icon. 
 
 
Alignment options:
Left, Right, Center, Justify
To bold text, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon
 
 
Select the Bold icon. 
 
To italicize text, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon.
 
 
Select the Italic icon. 
 
To underline text, select the Manage Your Site tile.
 
 
Select the text and then select the Edit icon.
 
 
Select the Underline icon. 
 
  • Custom Block Icon Options

To add an icon to your website, select the Manage Your Site tile.

 

Hover over a custom block where you want to add the icon and select the “+”.

 

Select Icon.

 

Search for a specific icon or scroll through your options.

 

Select the icon to add it to your block.

 

The icon has been added. 

 

To change an icon, select the Manage Your Site tile.
 
 
Select the icon, and then select Edit.
 
 
Search for a new icon option and click to apply it to your website. 
 
To change the color of an icon, select the Manage Your Site tile.
 
 
Select it and then select the Styling icon.
 
 
Enter a color code or select a color from the color wheel. Adjust the transparency as needed.
To style an icon, select the Manage Your Site tile.
 
 
Select it and then select the Styling icon.
 
 
To change the color the icon appears in upon hover, select a color under Hover Style. Enter a color code or choose a color from the color wheel. Adjust the transparency as needed.
To style the icon, select the Manage Your Site tile.
 
 
Select it and then select the Styling icon.
 
 
By default, the icon size is set to 60. You can adjust the icon size under “Dimensions”. 
To style the icon, select the Manage Your Site tile.
 
 
 Select it and then select the Styling icon.
 
 
You can adjust the icon’s alignment: Left, Center, or Right
 
 
To style the icon, select the Manage Your Site tile.
 
 
 Select it and then select the Styling icon.
 
 
We recommend adjusting the icon alignment first. If you’d like to further adjust the position, use the slide bar to move it left/right.
 
To style the icon, select the Manage Your Site tile.
 
 
 Select it and then select the Styling icon.
 
 
Under “Spacing” you can adjust the spacing between multiple icons. We recommend adjusting the icon’s alignment and position before adjusting spacing.
To style the icon, select the Manage Your Site tile.
 
 
Select it and then select the Styling icon.
 
 
Toggle the Remove Element on Mobile button to hide it on the mobile version of your website. 
 
To delete the icon, select the Manage Your Site tile.
 
 
Select it and then select the Trash icon.
 
  • Custom Block Media Options
To add a cover overlay to an image, select the Manage Your Site tile.
 
 
Hover over the image and select the Styling icon.
 
 
Select “Advanced Settings”.

                  

 
 
Select a color from the color wheel or enter a color code.

                  

 
 
Adjust the opacity to apply the overlay to your image.

                   

To make changes to an image on your website, select the Manage Your Site tile. 

 

Hover over the image and select the Crop icon.

 

Use the image grid to crop or move the bar. Select “Save”.

 
Drag the image to fit in the cropped area.
 
 
The image has been cropped.
 

To add alt text to an image on your website, select the Manage Your Site tile.

 

Hover over the image and select the Settings icon.

                  

Enter the Alternative Text and select “Save”.  

                  

To adjust an image’s shadow, select the Manage Your Site tile.

 

Hover over the image and select the Styling icon.

 

Select the Shadow tab.

 

Select a color from the color wheel or add a color code.

 

Adjust the Horizontal, Vertical, and Blur Radius.

 

The shadow has been adjusted.

 

 

To add an image to your website, select the Manage Your Site tile. 

                       

 
 
Select the + icon on the section you would like to add an image.
 
 
select the Media icon.

                    

 
 
Upload an image from your computer or select an image from the media library.

                  

 
 
The image has been added.

                     

 
To make changes to an image on your site, select the Manage Your Site tile. 
 
 
Hover over the image and select the Styling icon.

                      

 
 
The alignment section allows you to position the image to the Left, Center, or Right.
 
 
For this example, we’ll select Center align. 
 
 
The image is now centered.
 
To make changes to an image on your website, select the Manage Your Site tile.
 
 
Hover over the image and select the Styling icon.

                      

 
 
In the Dimensions section, use the bar or enter a number to adjust the image’s size.
 
 
 
The image has been adjusted.

 

 
To make changes to an image on your website, select the Manage Your Site tile.
 
 
Hover over the image and select the Styling icon.      

                      

 
 
Before using the image position options, use the image alignment options to position the image to its approximate position. 
 
 
Use the Image Position Left-Right bar to adjust the image’s position.

                        

To make changes to an image on your website, select the Manage Your Site tile. 

 

Hover over the image and select the Trash icon to delete it.

To make changes to an image on your website, select the Manage Your Site tile. 

 
Hover over the image and select the Settings icon.
 
You can set the image to link to an Internal page, External page, Pop-Up, Anchor Block, or Download. 
 
For this example, we will link to an internal page and select the page we want to link to. 
 

For internal pages, we recommend selecting “Open New Tab”.

 

Select “Save”. 

 

To make changes to the images on your website, select the Manage Your Site tile. 

Hover over the image and select the Styling icon. 
 
Select the toggle button to enable the image to be set to auto dimensions for responsive devices. 
 
 

To remove an image on mobile, select the Manage Your Site tile. 

 

Hover over the image and select the Styling icon. 

 
Select the toggle button to enable the image to be removed on mobile. 
 

To make changes to the images on your website, select the Manage Your Site tile. 

 

Hover over the image and select the Styling icon. 

 
Select the Shadow tab and click the checkbox to Show Image as Black & White.

 

The image is now black and white.

 
To add an image, select the Manage Your Site tile.
 
 
Select the “+” icon and then select the Media icon to add an image or video.
 
 
A placeholder image will appear. You can upload an image or video from the menu to the left.  
 

 

To add a video, select the Video tab. You can also import a video from YouTube or Vimeo.
  • Custom Block Divider/Separator Options
To add a divider between elements on your website, select the Manage Your Site tile.
 
 
Select the “+” icon between the elements.
 
 
There are six dividers to choose from:
 
 
Select a divider to add it between the elements.
To change the design of a divider/separator, select the Manage Your Site tile.
 
 
Select it and then select the edit icon.
 
 
 
Select a new style to apply it to your website.
 
To change the color of a divider/separator, select the Manage Your Site tile.
 
 
 Select it and then select the Styling icon.
 
 
Enter a color code or select a color from the color wheel. Adjust the transparency as needed.
To adjust the size of a divider/separator, select the Manage Your Site tile.
 
 
Select it and then select the Styling icon.
 
 
Use the slide bar to adjust the dimensions. 
 
 
The size has been adjusted. 
To adjust the alignment of a divider/separator, select the Manage Your Site tile.
 
 
Select it and then select the Styling icon.
 
 
Select an alignment option: Left, Right, or Center
 
 
The divider has been adjusted.
To adjust the position of a divider/separator, select the Manage Your Site tile.
 
 
Select it and then select the Styling icon.
 
 
Use the Position section to move the divider left/right and up/down. We recommend adjusting the alignment before adjusting the position. 
To make changes to your divider/separator, select the Manage Your Site tile.
 
 
Select the divider and select the Styling icon.
 
 
Adjust the angle of the divider in the Tilt section.
 
 

Once you adjust the tilt, use the left to right and up and down options to adjust position. 

 
 
The divider has now been adjusted. 
To remove a divider/separator on mobile, select the Manage Your Site tile.
 
 
Select the divider and then select the Styling icon.


To hide the divider on mobile, select “Remove Element on Mobile”.
 
To delete a divider/separator, select the Manage Your Site tile.


Select it and then select the Trash icon.

 
  • Custom Block Button Options

To create a button with a color gradient on your website, select the Manage Your Site tile.

 

Select the button you want to edit, and then select the Styling icon.

 

Select “Add Secondary Color” to add a color gradient to the button.

 

Select the secondary color from the color wheel or enter a color code.

 

 

The button color has been updated.

 

You can also adjust the direction of the color gradient.

 

To add a shadow to a button on your website, select the Manage Your Site tile.

 

Select the button you want to edit, and then select the Styling icon.

 

Select the Shadow tab.

 

 

Select a color from the color wheel or enter a color code.

 

Adjust the Horizontal, Vertical, Blur Radius, and Spread of the shadow. 

 

To make changes to the buttons on your website, select the Manage Your Site tile.

 

Select the button, and then select the Styling icon.  

 

Adjust the button to Left Align, Center Align, or Right Align. 

To make changes to the buttons on your website, select the Manage Your Site tile.

                  

 
 
Select the button, and then select the Styling icon. 
 
Before adjusting the button’s position, select the alignment closest to where you’d like the button. In this example, we want the button to be centered underneath the text, but selecting center alignment does not make it centered for this specific design.

                  

 
 
So we can now adjust the position of the button using the position bar. The button is now moved to the desired position.
To make changes to the buttons on your website, select the Manage Your Site tile.

                  

 
 
Select the button, and then select the Styling icon. 

                  

 
 
 
Scroll down and select “Spacing”.

                  

 
 
 
Use the bar or enter a number to adjust the button spacing: Left, Right, Top, or Bottom.

                  

Custom button width allows for equal padding on the left and right side of a button. To make changes to your website’s buttons, select the Manage Your Site tile.

                  

 
 
Select the button, and then select the Styling icon.

                  

 
 
Scroll down and select “Dimension”.
 
 
Toggle the Set Custom Width button to “On”.

                  

 
 
Use the bar or enter a number to adjust button width.

                  

 

To make changes to a button on your website, select the Manage Your Site tile. 

 
Select the button, and then select the Styling icon. 
 

You can change the button color and the button text color. 

Select a color from the color wheel or enter a color code.

 

To make changes to a button on your website, select the Manage Your Site tile. 

 
 

Select the button, and then select the Styling icon. 

 

Select “Hover style”.

 

Select a color from the color wheel or enter a color code.

 

You can also add a secondary color to the hover button color. Select “Add secondary color”. 

 
 
Select a color from the color wheel or enter a color code. 

 

You can now adjust the gradient direction. 

 

To copy a button on your website, select the Manage Your Site tile. 

 
Select the button, and then select the Copy icon. 

 

The button is now copied.

 

Adjust the space between the buttons.

 
 

To make changes to a button on your website, select the Manage Your Site tile.

 
 
Select the button, and then select the Trash icon to delete it. 
 

To make changes to a button on your website, select the Manage Your Site tile.

 
 
Select the button, and then select the Trash icon to delete it. 
 

To remove a button on mobile, select the Manage Your Site tile. 

 
Select the button, and then select the Styling icon. 

 

Select the toggle button to remove the element on mobile. The button will now be hidden on mobile devices.

To show a button as a link, select the Manage Your Site tile. 

 

Select the button, and then select the Styling icon. 

 

Select the “Show as a link” toggle button.

 

The button will now display as a link. 

 
To add a button, select the Manage Your Site tile.
 
 
Select the plus icon, and then select the Button icon. 
 
 
 
The button configuration pop-up will appear. Edit button text and select the type of link you’d like to add:
Internal Link
External Link
Pop-Up
Anchor Block Name


If adding an internal link, select a page from the drop-down menu.
 
If adding an external link, select the “Open New Tab” box.
To change button text, select the Manage Your Site tile.
 
 
Select the button and then select the Edit icon.
 
 
The button configuration pop-up will appear. Edit the button text and select Save.

To update a button link, select the Manage Your Site tile.

 

Select the button and then select the Edit icon.

 

The button configuration pop-up will appear. Select the type of link you’d like to add:

Internal Link

External Link

Pop-Up

Anchor Block Name

 

If adding an internal link, select a page from the drop-down menu.

 

If adding an external link, select the “Open New Tab” box.

 

  • Custom Block Map Options

To make changes to the map on your website, select the Manage Your Site tile. 

 
Select the map, and then select the Edit icon.
 

Select the pencil icon to edit your address.

Select “Save” to update the map.
 

To adjust your map’s height, select the Manage Your Site tile.

 

Select the map and then select the Styling icon.

The map styling pop-up will appear with the following options:

Dimension (Height)

Map Styling

Use the bar to adjust the height of your map.

To adjust the style of your map, select the Manage Your Site tile.
 
 
Select the map and then select the Styling icon.
 
 
The following are your map background options:
Original, Light, Dark, and Greyscale.
 
 

Original                

 
 
Light                 
 

 

Dark               
 
 
Greyscale                 
 
 
To delete the map, select it and then select the Trash icon.                  
To delete your map, select the Manage Your Site tile.
 
 
Select the map and then select the Trash icon.
 
  • Custom Block Form Options
Yes, you can add a webhook directly to your contact form settings. To access your contact form settings, follow the steps below:
 
1. Log in to your dashboard and select the Make Your Own Design Changes tile.
 
 
2. Select the page where your contact form is located.
 
 
3. Select the CTA button (Send Message), and then select the gear () to access the settings. Select Advanced Settings.
 
 
 
You can integrate with any CRM or leads management application as long as it supports a webhook integration. You can also use a workflow automation application (middle-ware) like Zapier, Automate, or integromat.
For example:
Goal: To send the lead information collected from a form to a leads automation solution (Keap).
Tool/Platform used: Zapier
Zap: Connect the ‘Webhook’ configured on the Form to ‘Keap’.
Trigger: Choose the app as ‘Webhook by Zapier’ and the trigger to be set as ‘Catch Webhook’ (copy the webhook generated and configure in the contact form on the website).

Action: Choose the desired app thats available. In this case (Keap), the data is mapped across and it’s ready to go.

 
You can change where messages are sent to by editing the settings in your contact form.
 
1. Log in to your dashboard and select the Make Your Own Design Changes tile.
 
 
2. Select the page where your contact form is located.
 
 
3. Select the CTA button (Send Message), and then select the gear () to access the settings.
 
 
Messages will be delivered to the email address or addresses you’ve entered and the My Messages section of your dashboard. 
 
 
 
You can add multiple email addresses separated by commas.
Form submissions can be checked in your dashboard.
 
Log in to your account and select the Your Customers tile.
 
 
Select the My Messages tab.
 
 
 
You can view the message and reply directly from here.
 
 
 
 
To make changes to a button on your website, select the Manage Your Site tile. 
 
 
Select the button, and then select the Styling icon.
 
 
Select a color from the color wheel or enter a color code.
 

To make changes to a button on your website, select the Manage Your Site tile. 

 
Select the button, and then select the Styling icon.
 
 
Select “Hover style”.
 
 
Update the hover button color and text color here.
 
 
Select a color from the color wheel or enter a color code.

To make changes to a button on your website, select the Manage Your Site tile. 

Select the button, and then select the Styling icon. 
 
 
Select a color from the color wheel or enter a color code.
 

To make changes to the form on your website, select the Manage Your Site tile. 

Select the form field you want to delete, and then select the Trash icon.

 

To make changes to the form on your website, select the Manage Your Site tile. 

 

 
Select the button, and then select the Edit icon.
 
 
Change the button text and select “Save”.
 
 
The button text has been changed. 
To add a form to a block, select the Manage Your Site tile.
 
 
Select the “+” icon where you want to add the form and then select the Form icon.
 
 
Select which email address you want the form to be sent to. You can add multiple emails. You can also select forms to be sent to the admin group. Adjust messages that appear when form submission is successful and unsuccessful
To add a form field, select the Manage Your Site tile.
 
 
 Select the “+” icon where you’d like to add the field. 
 
 
 
Select the type of field you want to add: Text box, Text Area, Check Box, Radio Button, Drop-Down, or Email
To change the name of a field, select the Manage Your Site tile.
 
 
Select the field and then select Settings.
 
 
Edit the name in the Label Text field.
 
To make a field mandatory, select the Manage Your Site tile.
 
 
Select the field and then select Settings.
 
 
Select the Mandatory checkbox. The user will now have to complete the field before they submit your form. 
To show/hide a label on your form, select the Manage Your Site tile.
 
 
Select the form field and then select Settings.
 
 
Toggle the Label Show/Hide button to enable or disable the label. 
 
 
The label has been disabled. 
To show/hide a watermark, select the Manage Your Site tile.
 
 
Select the form field and then select Settings.
 
 
Toggle the Watermark Show button to enable or disable. 
 
 
Select watermark dial to disable.
To add placeholder text to a form field, select the Manage Your Site tile.
 
 
Select the form field and then select Settings.
 
 
Update the Placeholder Text field. 
To move a field on your form, select the Manage Your Site tile.
 
 
Select the form field you want to move, and then select Settings.
 
 
Select the form field and then select the “Move Up” icon to move it to a new position.
 
 
Select the form field and then select the “Move Down” icon to move it to a new position. 
 
To delete the form on your website, select the Manage Your Site tile.
 
Select the dotted line at the top or side of the form. 
 
 
Select the Trash icon.
  • Social Profile
To edit your social media icons, select the Manage Your Site tile.  
 
 
Select “Menu”.
 
 
Select “Manage Blocks”.

                  `

 
 
Select “Social Icons” to add social media icons to your social profile module.
 
 

You can display 12 social platforms:

Facebook
Twitter
LinkedIn
Pinterest
Flickr
Google Places
Instagram
Yelp
YouTube
Tripadvisor
Weibo
Houzz
 
 

Add the link to the social platform to the corresponding field.

 
 
 Toggle the button to “On” to display that icon on your site.
 
 
After you’ve added the links, the icons will appear on your site.
 
 
Hover over the icons and select the gear symbol to access your social profile settings.
  • Footer Options

To make changes to the footer on your website, select the Manage Your Site tile. 

 

Scroll down on the page where you want to hide the footer and select “Hide on Page” on the bottom left corner of your screen. The footer will now be hidden on that specific page.

 
 
Select Manage Your SIte tile.
 
 
Scroll down to the footer and select the + icon to add a new footer.
 
 
Select the Footer section
 
 
Here you can see the pre-styled footer blocks, select the + icon to add the new footer block.
 
 
Update the placeholder conten
 
 
Delete the old footer.