Adding an Action Alert Form to Your Organization's FaceBook Page

This document explains how you can add an action alert form in a Facebook tab.

With the Advocacy API it is possible to add an Action Alert to your Facebook Page (or any other page for that matter). An example can be seen on the Force for Nature Facebook Page (a fictitious organization Convio created for examples such as this).

First, the FAQs:

1)  "So this is really just like a normal Action Alert? How is the alert response reflected in Convio, e.g. in Constituent360 and Reporting?"

Despite being presented inside of Facebook, alert responses will  process just like they would through any other form on your Web site  itself. So you can use all the reports you'd use normally to report on Alerts taken through Facebook, and all of the data  will show up in Constituent360 as usual.

2) "Does it matter if my Alert targets standard legislative targets or a custom target?"
Nope! Any target will work.

3) "Do I need to create a separate Action Alert for use inside Facebook, or can I use the alert I already created for my campaign?"

There's no need to create a brand new Alert specifically for Facebook. Convio recommends using your existing campaign. If you want to limit constituents to only taking action on the Alert once, you have to use the existing Alert.

4) "Why is the Action Alert only 520px wide? I want it to be wider!"
As of August 23, 2010, Facebook is unveiling a new version of Profiles and Pages that includes a number of changes, one of which is more narrow tabs. 520px is the new maximum width.

5)  "That newsletter sign-up form was a piece of cake, but this seems to be a bit more technical, and my organization doesn't have the skillset to  implement this in-house. Can Convio assist with deploying this for me?"

Convio does indeed offer a low-cost Services engagement for organizations that need assistance with implementation. If you're interested, contact your Account Manager for further details.

Now, here's how it's done:

1) In Convio, create an Action Alert. (As mentioned above, if you already have an Alert created, you can use that instead.) For the purposes of this example,  we'll want to configure the Alert to ask constituents to provide the following information:

• Title
  
• First Name
• Last Name
  
• Street 1
• Street 2
  
• City
• State/Province
• ZIP/Postal Code
  
• Country
• Phone
  
• Email
• Email Opt-In

You can certainly add or or remove fields on your form as needed (e.g. if you're using a custom target, perhaps you only want to ask for name and email), you'll just need to adjust the code included here to reflect your changes.

Be sure to configure the autoresponders as you would normally. Again, despite the fact that our Action Alert will be displayed in FaceBook,  it's still going to function like any other Alert would and  autoresponders will be sent.

2) Download the attached HTML file, fbAdvocacy.html. This file is the code you'll need to update and paste into Facebook.

3) Open fbAdvocacy.html in your favorite text editor such as Dreamweaver. You'll need to make the following updates to the code:

• Replace {secure hostname} with your Convio site's secure hostname. Generally, this is something like https://secure2.convio.net/organization, though some organizations have custom secure hostnames like https://secure.myorganization.org. If you're unsure, just visit an Action Alert on your Web site. What you want is everything before "/site/".
• Replace {api key} with your site's API Key. Your API Key can be found under  Setup -> Site Options -> Open API Configuration. If you don't see  "Site Options", contact Convio Support for assistance.
• Replace {alert id}  with the ID of the Action Alert you created in Step 1. You can find your alert's  ID by going to the Action Alerts list as an admin. "Alert ID" is shown in the first column.
• Replace {header image} with the URL of an image you'd like to appear atop the form. The image will be scaled to 520px wide. If you don't want an image on top of your form, you can remove the img tag.
  
• Replace {headline} with the headline to appear atop the form (e.g. "Gorillas on the Brink of Extinction").
• Replace {intro text} with  the text you want to appear below the headline (e.g. "Gorillas face threats from disease and the impact of humans on their environment through hunting, habitat loss and civil war. They are on the brink of extinction and we need your help.<br /><br />Pledge your support for the conservation of gorillas by taking action below. Send a message to let your Senators know that more needs to be done.")
  
• Replace {target} with your Alert's target(s) (e.g. "Your Senators").
  
• Replace {default message subject} with the default text for the subject line.
• Replace {default message body} with the default text for the message body.
• Replace {email opt-in label} with the text for the email opt-in  checkbox label (e.g. "Yes, I would like to receive periodic updates and communications from Force for Nature.").
• Replace {thank you headline} with the headline you'd like to appear after someone takes action (e.g. "Thanks for standing up for gorillas!").
  
• Replace {thank you text} with the text you'd like to appear below the headline above (e.g. "With your help, we will make a difference.").
• Replace {share title} with the title you'd like to appear when users who take action choose to share the alert on their Facebook page.
• Replace {share description} with the description you'd like to appear when users who take action choose to share the alert on their Facebook page.
• Replace {share link} with the link you'd like to appear when users who take action choose to share the alert on their Facebook page. This should be either the normal Action Alert link on your Web site, or, once you're done building out your Take Action tab on Facebook, it could be the link to that tab.
  
• (Optionally) Replace "Facebook Page Action Alert" with some other source code if you prefer. This  source code will be recorded each time the Alert is taken through your Facebook Page, and will be recorded as the Origin Source Code on any new  constituent records created as a result of the Alert,  allowing you to track and target these advocates over time.

4) Sign into the Facebook account you use to manage your organization's Page. Go to the Static FBML application page and click "Add to My Page". In the pop-up that opens, select your Page. This is the app we will use to make the Action Alert appear on your Page. If you already have Static FBML added to your Fan Page,  either from having added a sign-up form or donation form or for some other use case, you  can skip this step.

5) Go to your Page and click "Edit Page". Select Edit for the FBML application. Again, if you already had the Static FBML app added, the  name of the app may be something different (it should be the name of the  tab you used Static FBML in previously). If you edit that, you'll see  an option to add a new box at the bottom of your screen. Enter a title  you want to use for the tab, like "Take Action". In the "FBML" area, copy and  paste the code from Step 3.

6) Go to your Page, and use the plus sign at far right to add a new tab  for FBML (or, whatever you called your tab). That's it -- the form is  now live, and advocates can now take action without ever leaving Facebook.

Copyright 2010 Convio, Inc.