Social Buttons

What are Social Buttons?

The Social Buttons feature is a component that allows you to input the social media profile URLs and other subscription options into the website content:

Adding Social Buttons

You can place the Social Buttons feature into different blocks of the page via Drag & Drop.

Follow these steps to add the Social Buttons feature to your site:

  1. Click Build in the left sidebar of the Site Editor:

2. Drag the Social Buttons feature from the Features Library and drop it onto a placeholder in the desired location to add social buttons to your website page layout:

Customizing Social Buttons

Hover over Social Buttons to display the Edit button in its top-right and be able to modify the Layout and Design:

Layout Tab

The Layout tab of the Settings dialog allows you to add, edit or delete social network buttons, connect them to social network accounts and rearrange them by simple drag-and-drop:

Adding a Network

  • Add a network to the Social Buttons: click Add Social Network on the Layout tab of the Settings dialog:

  • In the Add Social Network pop-up, click the social button you would like to add:

  • The selected button will immediately appear on the website page, and the social networks list in the Layout tab:

Connecting to the Social Network Account

To connect the button to an existing social network account, hover over the social network's name in the Layout toolbar and click the Edit button.

Enter the profile name or link into the Link field:

To open a link in the new tab, turn the switch on. The social network account will open in a new tab of a website browser.

Rearranging the Social Buttons

You can rearrange buttons in the Layout tab of the Settings dialog by simple drag-and-drop:

Design tab

The Design tab of the Settings dialog allows you to change the following:

  • Alignment of Social Buttons
  • Buttons Size
  • Icon and Hover colors
  • Buttons Style

Alignment: Align the Social Buttons to the left, center, or right:

Size: Drag to set the size of Social Buttons:

Icon: Click a color square to open the color picker and select the color for the icon:

Hover: Click a color square to open the color picker and select the color for the icon hover:

Changing Style

Select the Social Buttons preferable design:

Deleting Social Buttons

To delete a feature - hover over Social Buttons and click the Delete button [x] in its top-right.