In a previous post, I had demonstrated how to add social media share and follow buttons to a WordPress website using the AddToAny WordPress plugin. While that works fine, AddToAny appears to be slow in adding newer social media platforms. Ever since the big brother tech purge of 2021, many liberty and privacy minded users have left the heavily censored and increasingly authoritarian big tech platforms like facebook and twitter for greener free-speech platforms that don’t censor your speech or sell your personal information. Some of these free-speech platforms include MeWe, Parler, Gab, CloutHub, Minds, Locals, Telegram and others. While AddToAny does include MeWe, it doesn’t yet include many of the other newer platforms. So in order not to lose out on a growing number of users fleeing the big brother tech platforms for the free-speech alternatives, it was worth looking for a more complete solution for how to add new free-speech social media platform share and follow buttons.
After investigating a number of alternatives, it looked like the Sassy Social Share WordPress plugin had the widest range of built-in new platforms. They included MeWe, Parler, Gab, and Telegram. The developers have also commented about adding some of the others in future updates already in-progress. I could also add my own platforms for custom follow icons with some simple HTML/CSS edits, which I show below.
Add Free-speech Social Media Share and Follow Buttons with Sassy Social Share WordPress Plugin
After backing up your WordPress database and website for safe keeping, install and activate the Social Sharing Plugin – Sassy Social Share.
Configure Sassy Social Share Overall Theme Settings
The Theme Selection tab has settings for the overall look of all the social media icons. Some of the settings are the icon background shape and size as well as color of the icons and backgrounds. The icons will default to use the specific color for each icon logo based on the icon’s platform. This can look rather garish with lots of primary colors all next to each other. So you can set colors that will fit better with your overall site design. In this case, I used a square gray background with white icons.
There are two different sections. Each can have its own settings.
- Standard interface theme
- These are the icons that will display within the content area of your pages/posts. If enabled on archive or category pages they will appear with each post on the page. These are anchored to the page, usually at the top or bottom of the post, and will scroll out of view when the page is scrolled.
- Floating interface theme
- These are the icons that will display usually in a vertical bar on the side of the window. The are anchored to the window and will not scroll with the content of the page.
In the above sample, the Floating Interface is the vertical bar of icons on the left side of the window and the Standard Interface is the horizontal row of icons above the content of the post. On the actual website where these are installed, rather than the image above, the vertical floating interface strip of icons remains anchored to the left side of the window and the horizontal standard icons scroll with the content.
Selecting Which Icons to Feature with Sassy Social Share Settings
Social Media Share buttons allow your readers to share your content to their social media accounts with a simple button click. You can select which primary social media icons you wish to feature. Sassy Social Share also displays a universal sharing popup menu that readers can use to share to a myriad of additional social media accounts. So you do not need to show every icon. You may also drag-and-drop reorder the selected icons into the order you prefer.
You may select the same, or different, set of icons to show for each of the Standard Interface and/or the Floating interface. They each have a settings tab with similar settings.
Once you select which icons you want to include, you may then select which types of pages/posts they should appear on.
You may also tweak some of the other settings to fine tune the look and behavior of the icons.
Add Social Media Follow Icons / Accounts
In addition to the social media share buttons Sassy Social Share also allows you to add social media follow icon buttons. Follow buttons bring the reader to your social media accounts so that they may follow them.
You can easily add social media follow buttons to any widget area, including sidebars or the footer, by going to Appearance -> Widgets and dragging the Sassy Social Share – Follow Icons widget to any desired widget area. Then simply enter your social media URLs in the fields of any social media accounts you would like to enable.
The Sassy Social Share – Follow Icons widget has a long list of available fields for services but they can’t be reordered. I also wanted to add a few additional free-speech platforms that we use however. So I first used the widget to generate the standard HTML/CSS for the widget output with the icons that it did include. I then customized the HTML/CSS myself and pasted it into a custom editor widget instead. To add additional custom icons, I downloaded and/or created SVG versions of the missing icons and uploaded them to the WordPress media library. Then I could simply reference them in the custom HTML/CSS.
Here is the custom CSS to incorporate the new custom SVG icons as well as to format the custom HTML/CSS in the editor widget so that the results look like those created by the actual Sassy Social Share – Follow Icons widget.
.sidebar .widget.widget_heateor_sss_follow, .footerclass .widget.widget_heateor_sss_follow, .sidebar .widget.widget_sow-editor, .footerclass .widget.widget_sow-editor {
margin-top:0;
}
.heateorSssCloutHubSvg {
background: url(/wp/wp-content/uploads/2021/05/CloutHub-Icon.svg) no-repeat center center;
}
.heateorSssMindsSvg {
background: url(/wp/wp-content/uploads/2021/05/Minds-Icon-2.svg) no-repeat center center;
}
The below screenshot (from the Atom editor) shows the final custom edited HTML/CSS. Note that it’s not the most concise and could be further refined, but I just wanted to keep it as close to the the original implementation as possible, for now, so that it would work seamlessly through future plugin updates.
And here is the final result of the follow icons including the custom added CloutHub and Minds icons on the right hand side of the website footer!
I hope you found this post useful and now know how to add new free-speech social media platform share and follow buttons to your WordPress website.
DreamLight Can Design an Award-winning Web Site for You
DreamLight can develop an award-winning WordPress website for you. We can work closely with your marketing team to update your existing Web site that may be outdated or to design a brand new custom WordPress website. In addition to leveraging SEO as discussed above, we design all our custom WordPress websites to be fully responsive. As a result the overall design layout automatically re-flows on-the-fly to take advantage of modern mobile devices. As multimedia experts we can also create a wide range of integrated branded marketing content for your website to help it really stand out, including: 2D/3D digital design, illustration, animation, interactive multimedia or even web application development.
Contact us for more information about designing a custom WordPress website or to explore your specific needs.
Leave a Reply