awe.sm-powered Share Buttons

awe.sm Share Buttons work together. Please review how to use them.

Facebook Send button

The Send Button allows your users to easily send your content to their friends. People will have the option to send your URL in an inbox message to their Facebook friends, to the group wall of any Facebook group they are a member of, and as an email to any email address. While the Like Button allows users to share your content with all of their friends, the Send Button allows them to send a private message to just a few friends. Learn more from Facebook….

If you wish to include both the Like and Send buttons on your page, you may find it easiest to add the send=true parameter to your Like button

Custom tag method: simplest, easiest

First, include the awe.sm Javascript library (instructions) on the page. Then just put our special HTML tag wherever you need it.

Facebook Send:

<awesm:fbsend></awesm:fbsend>

Combined Facebook Like+Send button:

<awesm:fblike show_faces="false" width="450" send="true"></awesm:fblike>

If you use other sharing buttons on your page as well, you only need to include the widgets.js script tag once. For performance reasons, we recommend putting the script tag as close to the bottom of your code as practical.

JavaScript call method: dynamically-generated content, JavaScript apps, and testing

When created by our custom tag or the IFRAME, buttons are generated at page render time. If you don't always want to show a button, or if the URL you want users to share is generated later on, you may want to generate our buttons on-demand using JavaScript. Developers may also find this method useful when building JavaScript applications.

First, include the awe.sm Javascript library (instructions). Then make a call like these (assuming asynchronous library loading):

Facebook Send:

<div id="button1"></div>
<script>
AWESM.onavailable = function() {
    AWESM.fbsend({
        'awesm_buttonid': 'button1'
    });
}
</script>

Combined Facebook Like+Send:

<div id="button1"></div>
<script>
AWESM.onavailable = function() {
    AWESM.fblike({
        'href': 'http://example.com/my-page.html',
        'send': 'true',
        'awesm_buttonid': 'button1'
    });
}
</script>

awe.sm parameters

All these parameters are optional. For more detail on these parameters, see the Create API documentation, but below is a quick summary. Note that when used in the HTML tags, the underscores should be changed to ":", e.g. awesm_campaign becomes awesm:campaign.

Configuring your button

The Send button takes three parameters, all of which are optional (a fourth, ref, is reserved by awe.sm to enable our tracking). They are:

Important note: App ID

The Facebook Like button uses the Facebook JavaScript SDK. The SDK uses awe.sm's own Facebook App ID by default. If you are also using the SDK (for instance, if your site allows users to login using Facebook Connect) you must provide your own App ID to the Like and Send buttons to avoid a potential conflict.

Even if you are not using the Facebook SDK elsewhere on your site, it is recommended that you use your own Facebook App ID as this can increase the visibility of Likes and status messages posted within Facebook.

Examples

The Send button cannot be properly rendered in an IFRAME, so you should use markup or JavaScript only.

1. Send the current page using a basic button

Markup:

<awesm:fbsend></awesm:fbsend>

JavaScript:

<div id="button1"></div>
<script>
AWESM.onavailable = function() {
    AWESM.fbsend({
        'awesm_buttonid': 'button1'
    });
};
</script>

2. Send a specific URL

Tag:

<awesm:fbsend href="http://twitter.com/#!/CandyCrisis/status/24594106919424000"></awesm:fbsend>

JavaScript:

<div id="button1"></div>
<script>
AWESM.onavailable = function() {
    AWESM.fbsend({
        'href': 'http://twitter.com/#!/CandyCrisis/status/24594106919424000',
        'awesm_buttonid': 'button1'
    });
};
</script>

3. Use your own Facebook Application to send messages

Tag:

<awesm:fbsend app_id="0987654321123456"></awesm:fbsend>

JavaScript:

<div id="button1"></div>
<script>
AWESM.onavailable = function() {
    AWESM.fbsend({
        'app_id': '0987654321123456',
        'awesm_buttonid': 'button1'
    });
};
</script>

4. Create Like and Send buttons in a single call

Tag:

<awesm:fblike send="true"></awesm:fblike>

JavaScript:

<div id="button1"></div>
<script>
AWESM.onavailable = function() {
    AWESM.fblike({
        'send': 'true',
        'awesm_buttonid': 'button1'
    });
};
</script>

Last updated 2012-02-16