Popup Share Widget
This guide covers the configuration details for a popup share widget
Read the complete documentation for setting up a share widget here.
Outline
Basic
The basic tab consists of all the required configuration parameters.
Field | Description | Default | Accepted Values |
---|---|---|---|
Widget Name | This must be a unique name to identify your widget. | widget-<EPOCH> | string |
Select Social Sharing Providers | This 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, Email | Select from the list of supported providers. |
Design
You can customize your widget's look and feel in this tab.
Field | Description | Default | Accepted Values |
---|---|---|---|
Popup Size | The size of the popup. | Medium | Large , Medium , Small , X-Small |
Header Text | The popup header text. | text | |
Subheader Text | The popup subheader text which is displayed right after the header. | text | |
Add Image URL | URL of the image to include in the popup. | A valid image URL. | |
Image Position | The position of the image in the popup, | Left | Top ,Left ,Bottom ,Right |
Add Background Image URL | URL of the background image to include in the popup. The content color is automatically adjusted for better visibility according to the image luminousity. | A valid image URL. |
Layout
Desktop
Field | Description | Default | Accepted Values |
---|---|---|---|
Hide On Desktop | Hide the widget when being rendered in a desktop screen. | false | true , false |
Position | The position where your widget should render. | Left | Top , Left , Bottom , Right , Center ,Bottom-left ,Bottom-right ,Top-left ,Top-right |
Mobile
Field | Description | Default | Accepted Values |
---|---|---|---|
Hide On Mobile | Hide the widget when being rendered in a mobile screen. | false | true , false |
Position | The position where your widget should render. | Bottom | Bottom , Center , Top |
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.
Field | Description | Default | Accepted Values |
---|---|---|---|
When URL | Select 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. | Contains | Contains , Equals , Ends with , Regex , Starts with |
Path | The path value to match with the current URL based on the condition selected for When URL option. | string |
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.
Show Popup On
Field | Description | Default | Accepted Values |
---|---|---|---|
Show Popup On | Select the page event to define when the widget should be loaded. | Load | Load ,Scroll |
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
- installation page, while adding a widget
- configuration page, while updating a widget