Instructions
Installing the Floating Vertical Bar
Make sharing easy on your page by installing the floating vertical bar. Be sure to grab the Toolbox code and update the AddThis script file with your username (if you want analytics).
HTML
This is the HTML portion of the code. Be cautious about nesting it inside other elements as it may not display correctly or in the right position on your pages.
<div class="addthis_bar addthis_bar_vertical addthis_bar_large" style="top:50px;left:50px;">
<div class="addthis_toolbox addthis_default_style">
<span><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a></span>
<span><a class="addthis_button_tweet" tw:count="vertical"></a></span>
<span><a class="addthis_button_google_plusone" g:plusone:size="tall"></a></span>
<span><a class="addthis_counter"></a></span>
</div>
</div>
<div class="addthis_bar addthis_bar_vertical addthis_bar_medium" style="top:50px;left:50px;">
<div class="addthis_toolbox addthis_default_style addthis_32x32_style">
<span><a class="addthis_button_preferred_1"></a></span>
<span><a class="addthis_button_preferred_2"></a></span>
<span><a class="addthis_button_preferred_3"></a></span>
<span><a class="addthis_button_preferred_4"></a></span>
<span><a class="addthis_button_compact"></a></span>
</div>
</div>
<div class="addthis_bar addthis_bar_vertical addthis_bar_small" style="top:50px;left:50px;">
<div class="addthis_toolbox addthis_default_style">
<span><a class="addthis_button_preferred_1"></a></span>
<span><a class="addthis_button_preferred_2"></a></span>
<span><a class="addthis_button_preferred_3"></a></span>
<span><a class="addthis_button_preferred_4"></a></span>
<span><a class="addthis_button_compact"></a></span>
</div>
</div>
Some options to change the style of the Floating Vertical Bar. You can change the CSS class, addthis_bar_large, shown in the first div element, with one of the options below.
| Name | Description | View |
|---|---|---|
addthis_bar_large |
Shows the larger styled share counters | view code |
addthis_bar_medium |
Shows the medium sized (32x32) share icons vertically | view code |
addthis_bar_small |
Shows the smaller sized (16x16) share icons vertically | view code |
Javascript
Here's the javascript code that you'll need to add to your webpage. Be sure to add your PROFILE ID for analytics.
<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=[YOUR PROFILE ID HERE]"></script>
[YOUR PROFILE ID HERE] with your Profile ID (no brackets needed!) which you can find in your
AddThis Profile Settings. Otherwise, AddThis will not be able to provide you analytics for your sharing tool. If you have not already
registered for AddThis, you can create an account to get your own Profile ID.
Floating Vertical Counter Demo
Features

Appears on Scroll
The vertical bar is designed to scroll with the visitor as they read your content, making sharing available at any time.

Multiple Sizes
The vertical bar comes in a variety of sizes for you to decide how visually prominent you want the bar to be.

Customizable
We've made the vertical bar easy to match the look and feel of your website.
More AddThis Menu Enhancements

Simple Menu
The new sharing menu is designed to be streamlined and fit seamlessly into your site. The menu optimizes the presentation of service to maximize sharing.

Friendly Expanded Menu
We have made it even easier for your visitors to find their favorite places to share.

Updated Email Form
Completely redesigned email form that makes it easy for your visitors to share their favorite content with their friends via email.

Updated Share Counter
At AddThis, details matter. We've tweaked our share counter to look great with other popular counters like Facebook Like and Google +1.

Settings
We've given our settings page a refresh where your visitors can personalize the places to which they love to share.

And more...
As always, the new tools continue to support over 70 languages, 300+ services, and the great analytics we offer today.