ActionKit

Guides for integrating features and content from ActionKit into Baseline websites.

ActionKit Forms

Display the total number of actions taken

Include a count of all the people who have taken action through an ActionKit page. Baseline looks for tags with a class of “ak-action-count” and then looks for ActionKit page shortname(s) in a “data-action-count-pages” attribute.

Basic Example:

<span class="ak-action-count" data-action-count-pages="join"></span> have signed up at act.350.org/signup/join.

people have signed up at act.350.org/signup/join.

 

Advanced Example:

<span class="ak-action-count bg-dkgray text-highlight text-large text-font-secondary" data-action-count-pages="join break-free-fossil-fuels"></span> combined signers from pages "join" and "break-free-fossil-fuels".

combined signers from pages “join” and “break-free-fossil-fuels”.

 

How to use:
  1. Copy the code from one of the examples above.
  2. Include the ActionKit shortname for the page(s) in an HTML attribute named “data-action-count-pages”
  3. Optional: add additional classes to style the counter (“text-font-secondary text-highlight bg-dkgray”)
  4. Optional: add a starting value to be combined with the totals retrieved from ActionKit

ActionKit Events

Embedding an ActionKit Event Map

You can embed an ActionKit event map with an iframe tag — here’s an example:

<iframe class="ak-event-map" src="http://act.350.org/event/event-shortname/?template_set=json&center=55,-95&cluster_size=1"></iframe>

How to use:
  1. Get the ActionKit shortname for your ActionKit distributed event. You can find it in the URL for ActionKit-generated event pages, or in the Campaign Settings page of your event.
  2. Add the shortname into the “src” URL for the iframe, between the “http://act.350.org/event/” and “/?template_set=json”. If your shortname is “my-event”, your URL would be “http://act.350.org/event/my-event/?template_set=json”
  3. Customize the map with options. (Options are added in a query string format) You can adjust the point the map is centered on, how far the map is zoomed in, the threshold at which the map will group dots together into a single dot, and more. See below for a full list of options.
  4. Paste the iframe tag into the page. Voila! You can adjust the options at any time by updating the URL in the “src” attribute of the iframe.
Options:
  • template_set (REQUIRED)
    This option tells ActionKit to serve the map data in a format that Google maps can understand. This option is required for the map to work, and the value must be “json”.
    Value: “json”
    Example: &template_set=json
  • center
    Latitude and Longitude coordinate to center the map on. To get latitude/longitude coordinates for a location, you can follow Google’s instructions.
    Values: Numbers, separated by a comma
    Default Value: 30,0
    Example: &center=53.6,45.2
  • cluster_size
    The threshold at which multiple dots that are close together are combined into a single dot. Lower values mean less clustering.
    Values: Integers, 0–100
    Default Value: 20
    Example: &cluster_size=20
  • zoom
    How far zoomed in the map is when it loads.
    Values: Integer, 1–10
    Default Value: If the “Events – Search Map – Starting Zoom Level” custom page field in ActionKit has a value, that is used; if no value for the custom page field is present, the default is 1.
    Example: &zoom=4
  • language
    Load a different language for the controls of the map. Default is English.
    Values: [two-letter country code]_[TWO-LETTER REGION CODE]
    Default Value: en_EN
    Example: &language=pt_PT

Note on source tracking: Baseline’s Javascript checks for iframes with a class of “ak-event-map” and then appends any value for “?source=” that it finds in the URL for the page.