The social sidebars comprise of 2 surrounds, one for the left sidebar:
<section class="sidebar sidebar-right sidebar-overlay">
<!-- The sidebar content goes here -->
</section>
And one for the right sidebar:
<section class="sidebar sidebar-right sidebar-overlay">
<!-- The sidebar content goes here -->
</section>
These are optional and can be included in any order. If they are included, they should follow on from the page footer but before any javascript.
The sidebars are aware of whether they contain any content (i.e. if any text or html tags appear inside the section) and will only pop out if they have something to display. They can also be displayed manually using a sidebar toggle:
<a class="sidebar-trigger" data-toggle="sidebar-left">Toggle Left Sidebar</a>
Will toggle the left sidebar and:.
<a class="sidebar-trigger" data-toggle="sidebar-right">Toggle Right Sidebar</a>