This article shows you how to set social page icons in your navigation bar. The social page icons link your audience to your social platforms in the navigation bar. It's good practice to include these icons in your navigation to promote your social channels.
💡 To let viewers share your Foleon Doc on social media, use the share element. This drag-and-drop element adds clickable share buttons directly to your page — separate from the social icons in your navigation bar.
How to add social page icons to your navigation bar
To add the social icons to the navigation bar, open the Foleon Doc settings.
In Doc settings, scroll down to the navigation tab and toggle on social page(s) icons. You'll see a pop-up appear with a wide range of logos.
Add the relevant links to the social icons and save your Doc settings.
The following social platforms are available:
- X (formerly Twitter)
- Snapchat
- TikTok
- Bluesky
- YouTube
- Vimeo
- Website
That's it! Open the preview to test the social page icons.
⚠️ If your Doc was already published before adding the social icons, don’t forget to republish to make the social icons visible to viewers.
Accessing social icons from different view modes
Desktop and tablet view modes
For both desktop and tablet view modes, the social icons will be visible directly from the navigation bar.
Mobile view mode
On mobile devices, the social icons won’t be visible in the navigation bar. Your audience can only see them when they click the hamburger menu, so make sure to toggle on the page menu button in your Doc settings.
Use social page icons for sharing
The social icons in your navigation bar are designed to link to your social media profiles. However, if you'd rather use these icons to let viewers share your Foleon Doc, there’s a handy workaround.
Here are the steps you can follow:
- Add the share element anywhere on your page and select the platforms you want to include (e.g., LinkedIn). You will only add this element temporarily.
- Publish or republish your content, go to the live version, and click on the social icon from the share element.
- Copy the full URL from your browser’s address bar after clicking each icon.
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 - Return to your page in the editor and delete the share element.
- Open the Doc settings, scroll down to the marketing tab, toggle on social page(s) icon, and paste the URLs in their respective fields.
- Republish your Doc and check the live version to ensure the navigation icons now trigger social sharing.
💡 This method effectively turns your navigation bar icons into share buttons. Just remember: if your Doc’s URL changes, you’ll need to update those share URLs.
