/
Dashboard

Inline Share Widget

This guide covers the configuration details for an inline share widget


Read the complete documentation for setting up a share widget here.

Outline

  1. Basic
  2. Design
  3. Counters
  4. Layout
  5. Rules
  6. Save Your Settings

Basic

The basic tab consists of all the required configuration parameters.

FieldDescriptionDefaultAccepted Values
Widget NameThis must be a unique name to identify your widget.widget-<EPOCH>string
Only Use Provider With Default StyleOnly enable the providers that support a default style for their sharing button.falsetrue,false
Select Social Sharing ProvidersThis field contains the list of social providers whose share button is to be displayed.
Click on the Add Button button below to add a provider to the list or cross icon in the right to remove the field.
Facebook, Twitter, EmailSelect from the list of supported providers.


Design

You can customize your widget's look and feel in this tab.

It is not accessible when only providers with default styles are being used.

Buttons

FieldDescriptionDefaultAccepted Values
SizeSize of the widget.medium(32*32)large(48*48), medium(32*32), small(16*16)
Button ColorThe background color for share buttons. Provider default color is used when this field is blank.HTML color values
Icon ColorThe provider icon color for share buttons. Provider default color is used when this field is blank.HTML color values
Rounded CornersAdd round shape to the share buttons. Dragging the seek bar to the right adds rounded corner and to the left adds a rectangular corner.00-20
Hide Social Provider NamesHides the provider labels in the share buttons.falsetrue,false
Label ColorThe provider label color for share buttons. Provider default color is used when this field is blank.
This option is not available when Hide Social Provider Names option is enabled.
HTML color values

Animations

FieldDescriptionDefaultAccepted Values
EntranceCustomize how your widget should enter the page.nonenone, fade-in, slide-in, zoom-in
HoverCustomize your widget behavior when being hovered.
background - change the button background color.
grow - slightly expand your button background.
nonenone, background, grow


Counters

Counter

Display the share counts on your widget button.

FieldDescriptionDefaultAccepted Values
TypeThe type of share count to display.
None - Do not display the share count.
Individual - Show share count on each button.
Total - Display only the total share count for the widget.
Individual & Total - Show individual share count on the buttons as well as the total share count for the widget.
NoneNone, Individual, Total, Individual & Total
Minimum Share CountDisplay the share count only when the individual or total share count is greater than or equal to this value.0> 0


Layout

Desktop

FieldDescriptionDefaultAccepted Values
Hide On DesktopHide the widget when being rendered in a desktop screen.falsetrue, false

Mobile

FieldDescriptionDefaultAccepted Values
Hide On MobileHide the widget when being rendered in a mobile screen.falsetrue, false


Rules

Show Only On These URLs

This field allows you to configure conditional widget render based on the current page URL.

By default no rules are added i.e. your widget can be rendered in any site as long as it is active and social9 is integrated.

Click on the Add Rule button to add a rule. Once added, you can delete the rule by clicking on the Dustbin icon to the right of the Path input field.

FieldDescriptionDefaultAccepted Values
When URLSelect the URL match condition.
Contains - When the current URL contains the entered Path value.
Equals - When the current URL exactly matches the entered Path value.
Ends with - When the current URL has the entered Path value as suffix.
Regex - When the current URL matches with the regex entered in the Path value.
Starts with - When the current URL matches has the entered Path value as prefix.
ContainsContains, Equals, Ends with, Regex, Starts with
PathThe path value to match with the current URL based on the condition selected for When URL option.string

Parent Container Selector

This is used to specify the location on your website where the inline widget should be rendered. You can read in-depth about it here.

Custom Share URL

This field is useful if you want to control which URL is shared on the social media via the widget. By default, the current page URL is shared.

For example,

  • You have a blog site say https://myblog.com which has an article with path /posts/my-awesome-article.
  • By default, when a user clicks on any share button, this url will be shared https://myblog.com/posts/my-awesome-article.
  • However this article was also published in one of the old blog site of yours which is immensly popular say https://my-oldblog.com. And you want to include that URL in your new site.
  • Now if you add https://my-oldblog.com/posts/my-original-awesome-article to the Custom Share URL field, any share via the widget is going to include this URL instead of the current page URL.

Please Note

When this field is not empty, the widget will always share the input value instead of the current URL path.




Save Your Settings

That's it! Now click on the Add Widget or Update Widget button available at the bottom of your Widget Configuration Tabs pane to save your settings.

On successful save, you should be redirected to

  1. installation page, while adding a widget
  2. configuration page, while updating a widget