How to display inline, floating buttons with shortcode
We always aim to provide complete control over the share button to our users to decide on which page they want to show the share button. Over the last couple of releases, we were adding more options to select the content type and page for which you would like to see the native and floating share buttons.
By using the checkbox for the content types and toggle options on each page, you can fully control the Super Web Share button via our main settings page and the page. But in some cases, we understand that you need to show the button in a position you want to show and with a different style you prefer to output based on the pages. So from the Super Web Share plugin version 2.3, we are supporting shortcodes.
Using the shortcodes, you can decide the position of the share button to be shown. Whether it’s between a post or page content or within the widgets, or even within a page builder, our shortcodes will help you control the native share button and control the fallback where and how you want to show the share buttons.
Our shortcode is
Inline share button shortcode #
To output the share button within a post or page or the widgets or even headers, you can use the following parameters to display the native social share button.
You can add the following parameters to customize the share button:
- color – Change the color of the button to be outputted
- text – You can set the text to be shown within the button; the text will only be shown if the style is the default and the default text is Share
Example: text=”SuperWebShare Inline button”
- style – You can set the style of the native share button to be outputted; by default, its set to the default style
Values: default, curved, square, circle
default – button with icon and text
curved – button with share icon and within the shape of the curved edges
square – button with share icon and within the square shape
circle – button with share icon and button is within the circle share
- icon – To set the icon you prefer to output, you can see the order of the icons we used here within the SuperWebShare > Appearance (tab)
share-icon-1, share-icon-2, share-icon-3, share-icon-4
- fallback – If you don’t want to show the fallback we provide, you can set it as no
- size – To change the size of the share button, by default, its set to a large size
large, medium, small
Floating share button shortcode #
As for the floating share button, our parameter is
, and we do support all the parameters mentioned within the inline share button. The additional parameters are the following:
- floating-position – to set the position of the floating button within the page. By default, the position is set to right.
- floating-from-side – To set the margin from the left or right position on the page. By default, its set to 5px
- floating-from-bottom – To set the position of the floating button from the bottom, if you have any other buttons or ads within the page at a position, you can use this parameter to change the position of the Super Web Share floating button. By default, its set to 5px
In case the Super Web Share floating and inline buttons are enabled on the page or post, and if you only want to show the shortcode, in that case, you need to toggle off the inline and floating button via the metabox within the page. See the screenshot below for your reference.
Note: The shortcode won’t work within the archive pages like categories and tags. It’s because we noticed that if the text excerpt is selected, the shortcode from the post is also loading over the archive pages on some themes like Twenty-Twenty. Due to that, we disabled the loading of the shortcodes on the archive pages. Please let us know by sending an email to [email protected]superwebshare.com if you want to see the shortcode support for the archive pages or if you know any solution for the above use case. So that we can prioritize it and can implement it in our future versions.
Why the title of the article or product not shared in social media?
The title of the post is only shared on some social media platforms like Twitter, and WhatsApp as they do support title and URL parameters. Some social media platforms like Facebook and LinkedIn won’t support the title as they don’t have any parameters to accept the text.
If you have any confusions, please reach out to us at [email protected]