Home / Thematic Meters / General Themes

General Themes

The code for the General Themes ClickIts is the same for all ClickIts. The only variable is the setting labeled as "theme"

 



Adding the meter:

  1. Login to the administrator system at: https://portal.clickandpledge.com
  2. Click on Account Info / Profile / API and activate the reporting services (RaaS).
  3. Copy the Account ID & Report Key to be used in the meter code

The Code:

<div id="pets" style="width: 160; height: 300; position: static;"></div>
   <script src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js" language="javascript"></script>
    <script type="text/javascript">
        swfobject.embedSWF("http://clickandpledge.s3.amazonaws.com/clickits/themedMeters/r001/main.swf?target=50&accountID=14521&key=1dfbb59556f945618867&tracker=jane&theme=pets&textcolor=FFFFFF&initialMessage=We can help the community only through your support&goalMessage=We have met our goal. Thank you all!<:br>(You still can help us)", "pets", "160", "300", "10");
    </script>

Arguments:

  • target: Used for the meter- the maximum value shown in the meter. Goal will be met when the total donations is greater than or equal to the target.
  • accountID: The account number as copied from the administrative system
  • key: The report key as copied from the administrative system
  • tracker: The donations made with the tracker will be shown in the meter. The tracker is a text (e.g. jane, campaign2010, etc.) that will be recorded with each transaction. The meter will retrieve the total for the tracker. The donation may also be downloaded in the administrative system for each tracker used.
  • theme: the following themes are available: [the code for all themes is the same, the theme parameter is the only variable identifying each theme]
    • spring
    • summer
    • autumn
    • winter
    • democraticParty
    • republicanParty
    • greenParty
    • libertarianParty
    • USpoliticalGeneric
    • pets
  • textcolor: Text color of the initialMessage & goalMessage
  • initialMessage: The initial message displayed
  • goalMessage: The message displayed once the target has been reached

 

Optional Parameters:

  • WID: If the WID of a checkout page is used, the ClickIts will post to the Classic page identified by the WID. If the WID is omitted the checkout page identified as DEFAULT will be used. If no checkout page is set to be the DEFAULT page then the checkout page with the lowest WID value will be displayed. See the following examples and use cases:
    • Omit WID: Omitting WID offers flexibility where the Clickits will post to the default page. Checkout page may be changed at anytime in the administrative system and a different default page may be set. Changing the default page will not require any change to the ClickIts code.
    • Omit WID: ClickIts using the default setting will not break if the checkout page used is accidentally deleted.
    • Using WID: A specific checkout page will always be used regardless of which checkout page is set as the default.
  • iconOverride: The full URL to the center icon image. The center icon may be customized using an swf file.

Example of iconOverride



The Code:

<div id="iconOverride" style="width: 160; height: 300; margin:auto;"></div>
    <script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js" language="javascript"></script>
    <script type="text/javascript">
        swfobject.embedSWF("http://clickandpledge.s3.amazonaws.com/clickits/themedMeters/r001/main.swf?target=32&accountID=14521&key=1dfbb59556f945618867&tracker=jane&theme=greenParty&textcolor=FFFFFF&iconOverride=http://clickandpledge.s3.amazonaws.com/clickits/themedMeters/resources/winter/icon.swf&initialMessage=We can help the community only through your support&goalMessage=We have met our goal. Thank you all!<br>(You still can help us)", "iconOverride", "160", "300", "10");
    </script>

In the above example the following are used:

  • theme = greenParty
  • iconOverride = http://clickandpledge.s3.amazonaws.com/clickits/themedMeters/resources/winter/icon.swf

iconOverride may point to any swf file located anywhere on your site.

  • All center icons are available for download as Flash files. These files may be used to customize the center icon and use the iconOverride to override the center image.  Download Center Icon Templates



    		 RSS of this page