Floating Vertical Bar

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>

Important: Be sure to replace [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

Simple Menu

Appears on Scroll

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

Friendly Expanded Menu

Multiple Sizes

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

Updated Email Form

Customizable

We've made the vertical bar easy to match the look and feel of your website.

More AddThis Menu Enhancements

Simple Menu

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

Friendly Expanded Menu

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

Updated Email Form

Updated Email Form

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

Share Counter 2.0

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

Settings

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

And more...

And more...

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