AddThis Widget Customization
Overview
«— put your mouse over
the button
The AddThis widget provides customization capabilities. The following portions
of the widget can be customized to better fit your needs and better integrate into your site design. In addition,
the new widget supports 'Email' as way to share.
| Button
Image and Link |
You can easily change
the button image and use your own, for better integration |
| Branding |
You can put your
name and company logo in the widget |
| Service
Options |
You can choose the
list (and order) of options included in the button (e.g.
Digg, Del.icio.us, Facebook, etc) |
Standard Code
If you want the standard version of the widget, use this code:
The only thing you need to modify is the addthis_pub
variable. Put your account ID (username) between the two
quotes, e.g. addthis_pub = 'my-username'. By default,
the button will use the URL and title of the page the button
is on. If you want to override this behavior, you can provide
your own URL and/or title in the addthis_open() function
in the code above.
Extended Code (Customization)
You can easily
customize the widget by setting any or
all of the following variables:
| Variable |
Description |
| addthis_logo |
The logo to display
on the popup window (about 200x50 pixels). The popup window
is show when the user selects the 'More' choice
Example: addthis_logo
= 'http://www.your-website.com/img/mylogo.gif'; |
| addthis_logo_background |
The color to use
as a background around the logo in the popup
Example:
addthis_logo_background = 'EFEFEF'; |
| addthis_logo_color |
The color to use
for the text next to the logo in the popup
Example:
addthis_logo_color = '666666'; |
| addthis_brand |
The brand name to
display in the drop-down (top right)
Example: addthis_brand = 'My Website'; |
| addthis_options |
A comma-separated
ordered list of options to include in the drop-down
Example: addthis_options
= 'favorites, email, digg, delicious, more';
Currently supported options:
delicious, digg, email, favorites, facebook, fark, furl,
google, live, myweb, myspace, newsvine, reddit, slashdot, stumbleupon,
technorati, twitter, more (the default is currently 'favorites, digg, delicious, google, myspace, facebook, reddit, newsvine, live, more', in that order). |
| addthis_offset_top |
Vertical offset for
the drop-down window (in pixels)
Example:
addthis_offset_top = 2; |
| addthis_offset_left |
Horizontal offset
for the drop-down window (in pixels)
Example:
addthis_offset_left = 2; |
If you want to change the image of
the button itself, simple edit the code below, look for the <img
... /> tag. If you want to use a text link intead of an
image, simply remove the <img ...> tag, and
enter the desired text (e.g. Bookmark, Share, or Bookmark & Share).
You can of course also use both a small icon and text
next to it. If you are comfortable
with CSS styling, you can apply them to the button or link.
All variables are optional. Below is a customization example
that uses some of the variables:
With these settings, the widget will look like this. Put
your mouse over the button.
|
