You can create a landing page with a well-thought-out user-friendly design using a website builder without coding skills. Choose premade templates that suit your business, customize them or create your own from scratch.
With our suite builder, you only need to select an element from the panel, drag it to the work area, and edit the style for your business. In addition to text and media blocks, you can connect payment options, add subscription forms to email campaigns or chatbots, add an image gallery, and show links to your page on social networks or your blog to attract and convert visitors to customers.
To create a page, go to the “Sites” tab and click Create Site.
Then, click +New page.
You can also go to the "Templates" tab, select a premade template, and then click on "Edit" in the drop-down list.
General Page Style
Before you start adding elements, create the page style you want. By default, the color scheme and text style you select will be applied to all of the elements you use. You can also set or change the general style of your page after it is created.
You can find the page style palette icon in the upper left corner of the top bar.
Click on the palette icon and select "Customize" next to the desired item.
You can choose a preset color scheme.
Or customize the color scheme of each element individually:
Content background is the default color for all elements except the “Cover” element.
Page background is the color of the page space outside of all elements.
Text is the color of the text for the "Text" element and other elements containing text (labels, radio buttons, checkboxes) in the "Subscription form."
Primary color is the background color in the “Cover” element, the background color of the button with the “Primary” style, and the color for the line of the button with the “Secondary” style.
Secondary color is the color of the "Line" element and the background color of the button with the "Secondary" style.
You can choose from preset font pairs or customize fonts for paragraphs and headings to match the style of your site and maintain design integrity.
To customize fonts for paragraphs and headings separately, go to settings.
You can select one of the styles from the preset list of button styles.
You can also customize your style for both kinds of buttons:
“Primary” is used for priority call-to-action buttons that need more attention.
Secondary is used for less important buttons; the default color of this button is paler.
Also, in the general settings, you can set a background image for the entire page:
You can set the size of the site width. The minimum value is 420 px, the maximum is 780 px. When you set up the maximum width for the desktop version of your site, it also adapts for mobile devices.
Choose an element in the left pane and drag it into the work area for further customization.
To return to setting a specific element, click on it, and the item settings will appear on the right.
Use the cover as a top block or header on your site to display a company logo or a profile avatar.
By default, the cover consists of an avatar, short text, and a background.
For the cover, you can pull up an avatar image from a social network or upload an image yourself.
Then proceed to customize the display of the avatar — select the alignment and specify the size.
To edit the text, click on it, and the text editing panel will open.
Within each element, you can customize the background, padding from the element to the page border, shadow, and round the corners of a given element.
Used to add a text element to the page.
To change the formatting, click on the text itself, and the text editing panel will open. Change the color and font for a specific part of your text to highlight keywords and headings.
To change the location and add a background, click on the settings on the right.
Gallery: Images, Videos, and Carousels
With the "Gallery" element, you can add multimedia elements to your page: images, carousels of images, and video. Using additional media enhances the effect of your text.
If you want to add a video, you must first upload it to YouTube, and then insert a link to it into the editor.
A carousel is suitable for displaying products in the form of cards with a description, image, and link.
You can set the carousel to auto-scroll and adjust the scrolling speed, or leave the option to manually scroll through the carousel.
Buttons: Link, Phone, and Email
Enter a name for the button. Select its type: link to a website, phone number, or email address, and then insert the data.
Choose a button style. By default, styles are pulled from the general page style. You can also create a unique style for each button separately — for this, select the "Custom" option.
If you want to give users a hint or provide additional information, add a description for your button.
You can add a social media link to invite a user to your page or your company page.
To add a new social network, click "Add." Then, click on the edit icon, select a social network, and enter a link to it.
Customize the appearance of the element — display your link as a button or icon, and choose a size and style.
Learn more: "How to Add Socials to Your Landing Page."
Separators: indents and lines
Use indentation and line to visually organize white space and meaningfully separate blocks on the page.
For the "Divider" element, you can select its color, thickness, shadow, and type.
Collect site visitors’ data and let them subscribe to your campaigns using the subscription form.
Select the mailing list you want to transfer your subscribers to, and customize the form fields with style. You can also create a deal in CRM.
Learn more: "How to Add a Subscription Form to a Landing Page."
You can add a button to a chatbot to subscribe a user for further chatbot communication and launch the desired flow — a welcome flow or your custom flow for a specific request.
Choose the appearance and the style of the button. Then add a new element or edit an existing one with a social network.
You can add a “Countdown” element to set a countdown until the start of an event or the end of a promotion.
Pick up the end date and time and the message after completion, set the date options, and customize the countdown appearance.
Learn more: "How to Add a Countdown to Your Landing Page."
Use an “FAQ” element to add detailed answers to frequently asked questions from your users in a structured way.
To change the text and formatting, click on the text or the heading, and the text editing panel will open.
In the element editing panel, add a new question. You can change the style of the icon, add and remove the divider and choose its color.
Learn more: "How to Add an FAQ Section to Your Site."
Use the "Payments" element to implement one-click payments for your products.
Enter the name of your product, its price, and select the pipeline where your deal will be saved. Select the mailing list to which your contact will go after the successful payment. You can also customize your form fields and their appearance.
Read more "How to add a “Payments” element to your website”
Preview, Save, and Publish
To see how the page looks to site visitors, click Preview in the upper right corner of the design panel.
When you've finished creating your site, click Save and Exit. “Save and Publish” in the builder directly is available for re-editing.
After saving, you will be redirected to a page, where you can click "Publish" to publish your landing page. You can return to the builder by clicking on “Edit.”
You can change the sire address, name, and favicon of your site, add SEO elements and connect Google Analytics and Yandex.Metrica. To do this, click Site Settings.
Here you can also monitor the statistics of visits to your site.
You can get inspired by examples of creating one-page sites on our blog.
Last Updated: 15.11.2021