How to Install the widget on Blogger
This document covers the installation steps required to integrate Social9 with your Blogger website
Outline
One-Click Setup
After you register for a Social9 account, visit the blogger installation section and click on Add Social9 Buttons to quickly integrate with your blogger site.
Manual Setup
Get The Code Snippet From Social9 Console
Copy the one-time installation code snippet under the blogger installation guide section of the Social9 Console. This should look similar to,
<script
id="s9-sdk"
async
defer
content="<REPLACE WITH YOUR USER ID>"
src="//cdn.social9.com/js/socialshare.min.js"
></script>Add Script In Blogger Theme
Login to blogger.com and open Theme section from the left sidebar. Now select the Edit HTML option under the theme options menu (access by clicking on the three dots).
Now paste the copied script in step 1 right before the closing body tag </body>. Refer to the image below.
Additional Setup For Inline(Horizontal) Widgets
If you'd like to configure an inline widget in your site (i.e. when the widget is placed side-by-side with your page content with a horizontal view), just add this additional code snippet where ever you want the widget to be rendered.
<div class="s9-widget-wrapper"></div>Inline Widget For Developers
You can create or configure inline widgets under the social9 configurations section and it will automatically be reflected on your website.
For inline widgets, you need to specify the location on your site where the widget should be rendered.
By default, the social9 inline widgets are rendered under the element with class name s9-widget-wrapper although you can change the name in the console. This can be done by changing the Parent Container Selector field under the Rules section of the widget editor.
Paste the following snippet in your site where the inline widget should render.
For id selectors
<div id="s9-widget-wrapper-id"></div>For class selectors
<div class="s9-widget-wrapper-class"></div>