C is for Cookie: Convio Platform Townhall #13NTCsweet Jesse
Kelsey Jason Wilson
Slide 2
2 Jesse Kelsey Web Developer Donordigital Berkeley, CA, US
Jesses web development experience spans the for- and nonprofit
sectors, including work in e-commerce, lead generation, digital
signage, and community economic development. He remembers building
his first web page when AOL was sending blue cd-roms to every
household in the U.S., before the term broadband was a twinkle in
our eyes. Jesse Kelsey Web Developer Donordigital Berkeley, CA, US
Jesses web development experience spans the for- and nonprofit
sectors, including work in e-commerce, lead generation, digital
signage, and community economic development. He remembers building
his first web page when AOL was sending blue cd-roms to every
household in the U.S., before the term broadband was a twinkle in
our eyes. Jason Wilson Associate Director of Digital Communications
Share Our Strength Washington, DC, US The resident web guru at
Share Our Strength (a national nonprofit that is ending childhood
hunger in America), working on the range of platform sites that
help connect and build relationships with the organization's
audience. A tech nerd at heart with 15 years experience, online
fundraising expert, and freelance web developer, my passion is
connecting people with the right actions at the right time online
to make lasting change in the world. Jason Wilson Associate
Director of Digital Communications Share Our Strength Washington,
DC, US The resident web guru at Share Our Strength (a national
nonprofit that is ending childhood hunger in America), working on
the range of platform sites that help connect and build
relationships with the organization's audience. A tech nerd at
heart with 15 years experience, online fundraising expert, and
freelance web developer, my passion is connecting people with the
right actions at the right time online to make lasting change in
the world.
Slide 3
C is for Cookie: Convio Platform Townhall This session explores
unconventional solutions to work with, and around, a familiar
platform, Convio. Learn some front-end coding tricks to transform
projects such as an advocacy survey into a dynamic engagement
tool.
Slide 4
Example
Slide 5
5 Our main goal was to drive awareness to a study called Its
Dinnertime that Share Our Strength conducted about how low- income
families plan for, cook, and shop for healthy meals. The full
report can be found at nokidhungry.org/itsdinnertime. The report
included the full study, press events, and an infographic in
addition to the quiz.nokidhungry.org/itsdinnertime Cooking Matters
Quiz Share Our Strength
Slide 6
6 The Recipe: Turn a Convio survey into a quiz Give feedback to
users on quiz score Make dynamic score sharing possible Implement a
more visually engaging design
Cooking Matters Quiz Share Our Strength 8 The Secret
Ingredients: Cookies JavaScript/jQuery HTML/CSS HTML Captions in
Convio
Slide 9
function createCookie(name,value,days) { if (days) { var date =
new Date(); date.setTime(date.getTime()+(days*24 *60*60*1000)); var
expires = "; expires="+date.toGMTString(); } else var expires = "";
document.cookie = name+"="+value+expires+";
path=join.strength.org/"; } All about cookies (quirksmode):
http://www.quirksmode.org/js/cookies.html Cooking Matters Quiz
Share Our Strength 9 Include createCookie() javascript function on
page 1 (the survey page)
Slide 10
10 1. True or false? Frozen fruits and vegetables are often
more nutritious than fresh. True False Cooking Matters Quiz Share
Our Strength Use js onclick events to create cookies for each
question/answer combo on page 1. The question code is located in
html caption sections on the survey pagethe standard Convio
questions are hidden**
Slide 11
11 XYZ123Rinsing canned foods can wash away about how much
sodium? $(document).ready(function () {
$("tr:contains('XYZ123')").hide(); $("span:contains('Optional: Will
you')").hide(); $("span:contains('7.')").hide(); }); Cooking
Matters Quiz Share Our Strength Trick: Hide any standard Convio
questions without element ids by salting the question and using
jQuery to hide();
Slide 12
12 Cooking Matters Quiz Share Our Strength function
readCookie(name) { var nameEQ = name + "="; var ca =
document.cookie.split(';'); for(var i=0;i < ca.length;i++) { var
c = ca[i]; while (c.charAt(0)==' ') c = c.substring(1,c.length); if
(c.indexOf(nameEQ) == 0) return
c.substring(nameEQ.length,c.length); } return null; } var q4 =
readCookie('Question4'); if(q4 == "Price of healthy grocery
items"){ var score4 = 1; } else { var score4 = 0; } var totalscore=
score1 + score2 + score3 + score4 + score5 + score6; Include
readCookie() function on survey ty page Create js variables for
survey responses Score questions with if/else statements Tally
totalscore and display throughout ty page
Taste Tester Feedback 15 We attracted 1,138 new advocates to
our cause through the quiz alone, and through a small Facebook ad
campaign, we had over 11 million impressions and just shy of 3,000
clicks (2,860). The quiz was a key engagement factor that helped
people not only understand the content of the report without having
to read it, but also giving us a way to capture more names of
individuals interested in cooking skills education a core component
of our work.
Slide 16
Questions?
Slide 17
Another Example
Slide 18
18 The goal of this campaign was for our network to engage the
presidential candidates last October, and let them know that hunger
is an important issue. The topic was timely (communications went
out immediately following a presidential debate) and a great way to
engage our core audience while raising awareness via social media.
Hunger Knows No Party Share Our Strength
Slide 19
19 The Recipe: Dynamic/interactive Tweets Timely response Add
Convio survey/list building elements
Slide 20
20 Version A: http://bit.ly/X7LzJs Version B (w/ Survey):
http://bit.ly/YtUD8u Hunger Knows No Party Share Our Strength
Slide 21
21 The Secret Ingredients: JavaScript/jQuery HTML/CSS In-house
social media formatting tool Convio Pagebuilder/Convio survey
Slide 22
22 Hunger Knows No Party Share Our Strength viral version is a
simple survey (FN, LN, email) that redirects to the main Tweet page
upon thank you/confirmation.
Slide 23
23 Hunger Knows No Party Share Our Strength // hide the span
tags that will contain the description jQuery("#descspan").hide();
// change the question border color if button selected and grab
description text jQuery("#quest1select").click(function() {
jQuery("#quest1").css("border","3px solid #f26722");
jQuery("#quest2, #quest3, #quest4div").css("border","3px solid
#a69c91"); var grabdesc = jQuery("#quest1").text(); var description
= encodeURIComponent(grabdesc);
jQuery("#descspan").text(description);
jQuery("#previewtweet").text(grabdesc); // Get and write candidate
selection jQuery("#tweetobama").click(function() { var candidate =
"BarackObama"; var twitUrl = "http://twitter.com/?status=" +
jQuery("#descspan").text() + "%20%40" + candidate; window.location
= twitUrl; }); });
Slide 24
24 Hunger Knows No Party Share Our Strength
Slide 25
25 Hunger Knows No Party Share Our Strength
http://www.facebook.com/sharer/sharer.php?s=100&p
%5burl%5d=http%3A%2F%2Fjoin.strength.org%2Fsit
e%2FPageNavigator%2F2012_DD_Hunger_Knows
_No_Party_B.html&p%5btitle%5d=Hunger%20Know
s%20No%20Party+&p%5Bimages%5D%5B0%5D=ht
tps%3A%2F%2Fsecure2.convio.net%2Fsos%2Fimag
es%2Fcontent%2Fpagebuilder%2Fdd-election-lp-
fbshare.jpg&p%5Bsummary%5D=Join%20Team%20
No%20Kid%20Hungry%20in%20asking%20Mitt%20
Romney%20and%20Barack%20Obama%20the%20t
ough%20questions%20they%20can%27t%20ignore. %0D%0A
Slide 26
Taste Tester Feedback 26 Within the first 24 hours, tweets
generated nearly 1.1M impressions and reached an audience of
252,454 followers generating hundreds of tweets from our network.
Twitter advocacy isnt necessarily an area weve put a lot of effort
into up until this point, but as a result of this campaign, we will
be building out more Twitter-centric advocacy campaigns in
2013.
