With BadgeOS Social Sharing add-on your users can share the achievements directly on Facebook, Twitter, and Linked. You can enable different ways to display social sharing buttons for your badges, including popups, shortcodes, and blocks. In this article, you’ll learn how to set up and use the Social Sharing add-on, from the moment it is installed to when badges are posted to social media platforms.

Table Of Contents

1. Install The Social Sharing Add-on
2. Configure Social Sharing Settings
3. Share Badges and Ranks From A User Account
4. Share Badges and Ranks From An Admin Account

1. Install The Social Sharing Add-on

• Install and activate the BadgeOS plugin.
• Install and activate the BadgeOS Social Sharing add-on.
• The new “Social Sharing” menu will appear under the BadgeOS menu.

• A notice “Please, click here to configure/create a new social share embed page” will emerge on the top of the “installed plugins” page. Click on the link and you’ll be redirected to the Social Sharing Settings page. The system will generate a social sharing embed page. Encrypted data is saved on this page in JSON format.

• Click on the “Save Settings” button.

2. Configure Social Sharing Settings

You can find the Social Sharing Add-on Settings page by clicking on Social Sharing from the BadgeOS menu. In this page you’ll be able to customize the following fields:

• Embed Page:

This page is for sharing the badge with the Embed badge code. This page URL will be utilized for embedding iframe-based badge data on 3rd party websites.

• Display Popup:

If this option is enabled, a social sharing popup will emerge on the frontend when a user earns a new achievement.

The user can also enter a custom message to be shared on social media, along with the badge, right from the popup window. To enter the custom message, click on the selected social platform icon to be shared and enter the message in the text field located at the bottom of the popup.

• Display Options:

Using this option, the admin can select the fields that will appear on the social sharing popup and in the user earned achievements shortcode/block. Here you can determine whether to display embed code, social links (Facebook, Twitter, and LinkedIn), or both on the BadgeOS Social Sharing pop-up window.

• Display Social Sharing Options in the Shortcode/Block:

With this option enabled, you can display social sharing icons on any page where user achievements are displayed (both when the [badgeos_user_earned_achievements] shortcode or User Earned Achievement block are used).

This is how social sharing links look like on the front end.

• Display Options for Embed Page

This option lets you select what data will be displayed on a badge’s embed page on the frontend. You have the option to display only the badge image or the image and description.

This is how an embedded page will look like on the front end when displaying both the image and description:

3. Share Badges and Ranks From A User Account

Users can share badges and ranks directly from their account by clicking on any of the social sharing links. Social sharing links can be displayed on a popup or on any page that uses the [badgeos_user_earned_achievements] and [badgeos_user_earned_ranks] shortcode or User Earned Achievement block and User Earned Ranks block, depending on the options enabled in the settings.

The social sharing buttons displayed with the add-on are Facebook, Twitter, and LinkedIn. Follow the instructions below to share your badge on either of these social platforms:

• Facebook

To share your badge or rank on Facebook, click on the Facebook link/button. As a result, another browser window will open, where you’ll need to login to your Facebook account. After logging in you can edit your post and privacy settings before posting. When you are ready simply click on the post button.

• Twitter

To share your badge or rank on Twitter, click on the Twitter link/button. As a result, another browser window will open, where you’ll need to login to your Twitter account. After logging in, you’ll be able to edit your tweet before posting. When you are ready simply click on the tweet button.

• LinkedIn

When sharing your badge or rank on LinkedIn, you have the option to either add the badge to your profile or share it with your network on the newsfeed. After clicking on the LinkedIn link button, you will see a popup window where you can select between these two options.

To display the badge or rank on your LinkedIn Newsfeed, select the corresponding option on the popup window. Login to your account and then simply select whether you want to share the post to your feed or as a private message.

If you choose to add the badge to your profile, follow these instructions:

• You will see a popup appear, containing all relevant badge information. Review the information and click on the ‘Add to profile’ button.

• This will redirect you to Linkedin where you must log in to your account before being redirected to the Add Certification page.

• The blank fields on this page must be filled with the badge information contained in the first pop-up. 
• Finally, click on save.

4. Share Badges and Ranks From An Admin Account

• Go to the “user profile” from the admin panel.
• Scroll down to the “Earned Achievements” or “BadgeOS Ranks” section.
• Click on the “Share” button located next to the selected badge or rank. A pop up will open.

• Click on any social icon to share on that platform, login to the corresponding account, and customize your post for each platform as outlined in the section above. You can also use that earned badge embed link for sharing.