All about the share element

With the share element, you create social share buttons. Your audience can click these buttons to share your content on their social networks. In this article, we show you how you can set up these buttons and how to manage them.

🎥 Watch our quick 1-minute video on this topic.

What are social share buttons?

Social share buttons can be added to a page so users can share a page or Foleon Doc on their own networks. These can be added to the page with the share element. In the example below, you can see what that looks like for your audience.

How to add the share element

Navigate to the left-hand side of your screen and open up the elements tab. Click the Share element and drag it onto your page.

The first time you drop the social share element, a pop-up will open automatically in which you can choose which platform(s) you want to display.

From that point on, the selected platform(s) will remain saved. You can change this in the general settings of your element settings.

If you click the mail icon in the live link, Foleon will open the mail app, which is the standard mail app for your laptop, so this depends on the laptop you are working with. From there, you'll be prompted to choose your email provider. Here’s what it looks like:

Share from the navigation bar

If you want to give your audience the option to share your content from the navigation bar, you can follow these steps:

1. Add the share element anywhere on your page and select the icons you want to include (e.g., LinkedIn). 
2. Publish or republish your content, go to the live version, and click on the social icon. 
3. Go to your browser's address bar and copy the complete URL.
   
   For example:
   
   https://www.linkedin.com/shareArticle?mini=true&title=Recruitment%20-%20Content%20Compass&url=https%3A%2F%2F%3Futm_source%3Dlinkedin%26utm_medium%3Dsocial%26utm_campaign%3Dim-share-button
   
   
4. Return to your page and delete the share element. 
5. Open the Doc settings, scroll down to the marketing tab, toggle on social page(s) icon, and paste the URLs in their respective fields.
6. Republish your content, open the live version, and test that your icons now make you share your Foleon Doc. 

Element Settings

• General Settings
  In the general settings, you can select the platform(s) you want to link to. You can also control the icon size to make the icons bigger or smaller.
  By default, the social share element shares the current page. If you want to share a custom URL, you can add that in the alternative URL field.

  Want to share the general URL of your content? You can paste this in the alternative URL field.

  

• Alignment
  Set the alignment of the social share buttons to make them align right, middle, or left in your column.

  

• Border
  The border option allows you to create a full border or a border on certain sides of your element. all sides at once are selected by default, which means that when you increase the border thickness, the same amount of border will appear on all sides at the same time. 

  When all sides at once is deselected, the option to increase the amount of the border per side will appear. It's also possible to add more than one border. Every border will have the same color that is selected at the border color picker.

  

• Spacing

  Spacing can be increased to create more space between the bottom border of the element and the content within the element.

  

• Background
  Here you can set the background color of the share element.

  

• Animation
  The entrance animation of the element can be selected in the drop-down menu. This animation will show one time when the page is opened. In the block settings, you can make the elements within the block animate only once, or make it animate every time it appears on the screen.