Heal Your Church WebSite

Teaching, rebuking, correcting & training in righteous web design.

April 5, 2011
by meandean
1 Comment

Fun with the Twitter Search API and jQuery

During my job search last year, I admitted that “yeah, I’m a bit of an API junkie.” Anyone whose followed this site since 2002 probably has gone blind once or twice reading posts about SOAP, XML-RPC, RSS feed and other such programmer protocols and interfaces.

So why should anyone be surprised that today I’m providing a quick how-to code snippet of some fun I’m having with the Twitter Search API, REST, jQuery and jSON?

YES, I know I need to get back into providing posts about content management,  effective social media strategies and web campaigns … but for today … please indulge me with one more trip into the land of code.

Some Context

In the process of writing some WordPress plugins leveraging the Facebook API, I thought “why not twitter?

However, there are already a multitude of plugins and widgets out there that’ll show my profile.  So I turned my eyes to Twitter Search.

My first thought was to simply write this all up using not much else but the jQuery.getJSON() method.  However, this approach doesn’t lend itself well to caching – which in turn would lead to some of you with busy sites getting your widgets blacklisted by Twitter as <a href=”http://apiwiki.twitter.com/Rate-limiting” title=”Twitter API Wiki – Rate Limiting”>their default rate limit</a> for calls to the REST API is 150 requests per hour.

So now I’m working on a PHP solution inspired in large part by Arron Jorbin’s post “More Twitter Shortcodes for WordPress.” Must read for anyone working with feeds or APIs in the WordPress arena.

Hey, so where’s the jQuery & jSON?

All that context aside, I did successfully write a short snippet that used jQuery to call the RESTFul Twitter Search API and then parses the jSON into a dynamic display.

I did this in part because while I will employ some form of PHP or  Perl to cache the Twitter Search, I still might employ jQuery as the rendering mechanism for said cache. Here’s my test code so far:

/* a counter outside the context of setCountdown() */
var seconds2go = 0;

 * the method that sets the visual display of the countdown timer,
 * and triggers getTweet after 2 minutes
var setCountdown = function() {
  if(seconds2go > 0) {
    $("#countdown").html("Seconds until the next refresh:' +
  ' <span>" + seconds2go + "</span>");
  } else {
    $("#countdown").html("Seconds until the next refresh:' +
  ' <span>0</span>");
    seconds2go = 120;

 * the method goes out to the Titter A.P.I,
 * then parses the jSON block into the display
var getTweet = function() {

  /* set everything up */
  var url="http://search.twitter.com/search.json" +
  var query = escape( query=$("#twittersearch").val() );
  var display = '<div class="tweetDisplayContainer error">' +
       'no records found</div>';
  var urirex = /(https?):\/\/+([\w\d:#@%\/;$()~_?\+-=\\\.&]*)/g;
  var hashrex = /\#+([\w\d:#@%/;$()~_?\+-=\\\.&]*)/g;
  var thashuri = "http://search.twitter.com/search?q=%23";

   * A.J.A.X. happens here -> go get the data, then parse it
  $("#twitterresults").html('<h4><a class="searchlink" href="' +
  url.replace('search\.json','search')+query +
  '" title="see the search query via Twitter">Testing: ' +
  url+query + '</a></h4>');
  if(json) {
    display = '<div class="tweetsContainer">' +
  '<dl class="tweets clearfix">';
      ttext = tweet.text.replace(urirex,
  '<a href="$1://$2" title="">$2</a>');
      ttext = ttext.replace(hashrex,
  '<a href="' + thashuri  + '$1" title="">#$1</a>');
      display +=  '<dt class="tweet' + i + '">' +
            '<img src="' + tweet.profile_image_url + '"  />' +
          '</dt>' +
          '<dd class="tweet' + i + '">' +
            ttext + ' <strong>via:</strong>' +
            '<a href="http://twitter.com/' + tweet.from_user +
            '" title="tweets by ' + tweet.from_user +
            '">@' + tweet.from_user + '</a>'
    display += '</dl></div>';


 * this is where we kick-it all off,
 * assumes seconds2go = 0 initially
setInterval(setCountdown, 1000);

As you can see, the most difficult part was getting it all to fit in a readable format on this blog! Well, that and some additional fun with regular expressions.

Well that and what you don’t see in the code are two html elements:

<h2 id="countdown">Seconds until the next refresh: <span>120</span></h2>

<input type="hidden" id="twittersearch" value="deanpeters #smm" />

<div id="twitterresults">no results yet</div>

Todo: I’m thinking the above script could use a bit of animation easing or some other effect so we don’t simply “flash” new results at the user. It also needs to be objectified and wrapped-up as a plugin. More on that as I work on the widget/plugin.

Demo Stuff

I did create a demo page – it’ s not pretty, but it effectively shows how to get it done. I’ll craft up some CSS for it later.

It’s basically built off a search of  deanpeters  #smm as pictured below:

twitter search criteria for jQuery test

I’ve also created a .txt version of the file if you’re interested.

Additional Reading

In the meantime, I though I’d list some of the sites I visited while approaching this exercise. Some good people providing some good examples:


Thanks for all the emails and retweets of late. Good stuff!

February 26, 2011
by meandean
1 Comment

Using Perl’s Net::Twitter to Harvest Keyword Searches

So you’ve decided to dive into social media marketing on behalf of your church and/or charitable organization.

In fact, you’ve been wisely leveraging bit.ly with Twitter or ow.ly with HootSuite to track and measure your outbound links — but you find yourself in need a more ‘industrial strength‘ means of tracking who is saying what about your organization or an upcoming event.

You also want to speed up your WordPress blog as it’s been gagging when your Twitter RSS feed goes all 503 on you because Ashton Kutcher tweeted about his toenail clippings.

Recipe for Success

As I mentioned in my post last Tuesday entitled ‘Strategy vs. Tactics and your Social Media Activities ,’ I’ve been playing around with some of the cool social networking tools one can find in the CPAN library.

Today I want to provide a quick snippet on how to use the Net::Twitter to write a simple PERL program to harvest a search.

To do this, it mean installing the Net::Twitter library. You’ll likely need root or sudo privileges to make this happen. If you don’t know what root or sudo means, then you’ll want to contact your hosting provider.

That said, once you get it installed, the next step is to go to the Twitter Search page and create an advanced search. From the resulting query string should give you all the parameters you need, for example:

Based on the above example, I created the following script by using the nano editor for a file called ‘eastertweets.pl‘:

use Net::Twitter;
use Net::Twitter::Search;
use Scalar::Util 'blessed';
# Just the Search API; exceptions thrown on error
$nt = Net::Twitter->new(traits => [qw/API::Search/]);
eval {
   # Parameters: q, callback, lang, rpp, page, since_id, geocode, show_user
   my $r = $nt->search({
      q=>"\"easter service\" OR \"sunrise service\"",
   for my $status ( @{$r->{results}} ) {
      print "\@$status->{from_user}";
      print "\t$status->{created_at}\n";
      print "\t\t$status->{text}\n";
      print "-----------------------------------------------------\n";
if ( my $err = $@ ) {
   die $@ unless blessed $err &amp;&amp; $err->isa('Net::Twitter::Error');
   warn "HTTP Response Code: ", $err->code, "\n",
   "HTTP Message......: ", $err->message, "\n",
   "Twitter error.....: ", $err->error, "\n";

Once I created the file, it was simply a matter of modifying it to execute, then calling it:

chmod a+x eastertweets.pl

So Why Bother?

Now this approach by itself is a lot of work for little return. However, here are some things you might want to do with the sample above that would provide some big return value:

  1. feed this into a SQL database history via Perl DBI;
  2. create comma separated values and pipe it into a running log file;
  3. aggregate the returns with other searches into a single RSS file on your server for both the sake of speed and feeding localized dashboards;
  4. grep the returns for other key words, sending email notifications on hot items, while deleting those spammy items that make your feed so noisy;
  5. create a RESTFul web service that dynamically feeds your WordPress blog of select queries using Ajax via jQuery.

The point is, once the data is captured, you can pretty much do anything you want with it programatically.

For me, I’m thinking it might be fun to grab user IDs and feed their demographic information into some sort of analytics engine; or at least have some fun with Google Maps.

Anyway, enjoy the example. If you expand on it, don’t forget to come back and provide a link. I’d be interested to see how this snippet evolves.

October 3, 2010
by meandean

Setting up multiple test sites in XAMPP via virtual sites

It’s NEVER a good idea to test new designs, programs and/or learn new stuff on a production website. This article describes how to create multiple virtual servers on a Windows 7 platform using XAMPP to create a perfect Linux/Apache like test bed.XAMPP + Win7 = great platform to test WordPress, MovableType and   Drupal

Some Context

I’m in the process of re-factoring some websites I’ve let go fallow far too long. Part of this process includes setting up a Linux-like test site on my brand new Windows7-driven Lenovo U350 via XAMPP.

Yeah, I know, that was a lot all at once, so let’s break some of this down for those of you who don’t code for a living:

What’s XAMPP?

The WikiPedia defines XAMPPas follows:

(pronounced /ˈzæmp/ or /ˈɛks.æmp/[1]) is a free and open source cross-platform web server package, consisting mainly of the Apache HTTP Server, MySQL database, and interpreters for scripts written in the PHP and Perl programming languages …

… The program is released under the terms of the GNU General Public License and acts as a free web server capable of serving dynamic pages. XAMPP is available for Microsoft Windows, Linux, Solaris, and Mac OS X, and is mainly used for web development projects..

In short, XAMPP gives me a Linux/LAMP development platform on a Windows based machine.

My Situation

Whether it’s learning something for work, or working on a church website, often find myself jumping between languages such as Perl, PHP and Python … and content ‘manglement’ systems such as WordPress, Drupal and MovableType, I find it’s easier to keep things organized if I:

  1. keep each project in its own path
  2. establish a virtual server for each project
  3. enter the project name in the address bar of my browser

Getting it done

By default, “localhost” is the default domain name for your PC. It resolves to IP address

But just as a hosting provider can support several domain names on a single IP address, so too can your Windows system.

Below are the steps to get this done:

Step 1 – identify the new host

Unlike Windows XP or Vista,  for Windows 7 you’ll need to right click on the NotePad program and “Run as Administrator” as pictured below:

Notepad - Open as Admin

This is because the file we want to edit is now protected. That file is located at:


Once you’ve opened the file and on or about line 23, edit your file so it reads:       localhost       drupal

Save it, close your notepad editor, so you don’t shoot yourself in the foot in admin mode.

Step 2 – establish the virtual host

Keep in mind, the primary purpose of XAMPP is to give you an Apache server that runs on your local machine.

That in mind, you’ll need to edit one more file:

notepad C:\xampp\apache\conf\extra\httpd-vhosts.conf

Once in, you’ll want to modify it so it reads:

NameVirtualHost *:80
<VirtualHost *:80>
 ServerAdmin postmaster@dummy-host.localhost
 DocumentRoot "C:/xampp/htdocs"
 ServerName localhost:80
 ServerAlias localhost
 ErrorLog "logs/dummy-host.localhost-error.log"
 CustomLog "logs/dummy-host.localhost-access.log" combined
<VirtualHost *:80>
 ServerAdmin postmaster@drupal-host.localhost
 DocumentRoot "C:/xampp/htdocs/drupal"
 ServerName drupal:80
 ServerAlias drupal
 ErrorLog "logs/drupal-host.localhost-error.log"
 CustomLog "logs/drupal-host.localhost-access.log" combined

Note, in the default XAMPP install, the above is commented out, and the hosts are dummy and dummy2. I simply un-commented everything and renamed dummy2 to drupal.

Step 3

Restart your Apache server. The easiest way to do this is stop and start the server through the can be done through the console as pictured below:

XAMPP Console

Step 4 – Test It

Finally, you’ll want to test it by entering “drupal” in the address bar of the browser of your choice.

Before you do that, you may want to create the directory C:\xampp\htdocs\drupal …

… and then add an index.html, .php, .pl OR .py file to provide the ubiquitous “Hello World!” to demonstrate everything is running as planned.


Additional Resources

I’m not the first person to write on this topic, nor will I be the last. That said, here are some other sites that offer similar tutorials in case the one above is still as clear as mud.

Why Bother?

Some of you may be wondering why bother at all? Why not just work on your live site.

Personally, as an IT professional with a couple of decades experience, I can say with utter certainty – backed-up with copious examples – that this is a recipe for disaster.

Instead, why not simply take an old box and install a Linux distribution such as Ubuntu or Fedora … or do what I did, took a new box an added XAMPP.

Either way, you’ll be glad you did when one of your tests or learning experiences fries your non-production site.

April 22, 2010
by meandean

The Facebook Like Button Plugin for WordPress

Facebook rocked the internet yesterday with 5 new plugins, one of which is an API for the Facebook Like Button. After reading about it and playing a bit with the Facebook’s Like Button generator, I decided what’s needed is a WordPress plugin that allows folks to easily configure the look-and-feel of the Facebook Like Button, and then automatically add it the beginning and/or the end of their posts.

Update 26-Apr-10

FYI, I just released version  0.1 of the The Facebook Activity Widget Plugin for WordPress – yet another useful (and different) WordPress plugin for displaying Facebook Social plugins on your website.

Update 25-Apr-10

Version 0.4 just got released – it now has a preview feature built into the administrator panel … and I’m starting to get translation .po & .mo files from abroad (thanks!-). It’s also now being distributed via the WordPress Plugin Repository.

Update 24-Apr-10

Version 0.2 is released as of Saturday, April 24, 2010 7:14 Eastern Standard Time.

Also after some excellent email and FB message feedback from some early adopters, you can now also decide whether or not you want the FaceBook Like Button to appear on the top and/or bottom of individual pages, individual posts and/or your front page.

Installation & Use

I also wanted to keep it simple, so here’s how it works — using the standard WordPress plugin installation process:

  1. Upload the ‘fblikebutton.zip’ file to the `/wp-content/plugins/` directory using wget, curl of ftp.
  2. ‘unzip’ the ‘fblikebutton.zip’ which will create the folder to the directory `/wp-content/plugins/fblikebutton`
  3. Activate the plugin through the ‘Plugins’ menu in WordPress
  4. Configure the plugin through ‘FBLikeButton’ submenu in the the ‘Settings’ section of the WordPress admin menu.
  5. Modify the fields to choice and save.

Here’s a screen shot below of the administrator screen (you’ll want to click on it to see it full size):

Screenshot of the FBLikeButton Admin Panel - now with preview

Here’s how the FaceBook Like button appears on the bottom of this post:

Screenshot of the FBLikeButton after fabulous formatting

This being being version 0.1, you can bet your sweet bippee there’s more to come. Still, I wanted to get this out to the WordPress community as fast as possible.

A bit more about the FaceBook Like Button

What’s nice about the Facebook Like button is that no login to your site is required. Even if you’ve never visited HealYourChurchWebsite.com before, they can get social context starting with their very first visit.

If you’re logged into FaceBook, then you can see which of your friends like a site — without the site knowing anything about you. Pretty neat, huh?

Download It

Also, I’m currently in the process of setting getting established with the WordPress SVN  and everything else that goes with publishing an official WordPress plugin.

Until then, click here to download the latest fblikebutton, from the WordPress Plugin repository keeping in mind it is version 0.1 0.2 – so expect more to come!

Download the FaceBook Like Button Plugin for WordPress

Shout Outs and Thanks

A shout–out of thanks for the immediate feedback goes out to Benjain, Julien, Tim, Jason, Dave, and Chuck.

Additional Reading


Oh, and hey, don’t forget to click the FaceBook Like Button for this post … I’d appreciate it.

March 16, 2010
by meandean

Preparing your server for success

So what happens when your church or charity website gets mentioned on a popular blog, like say Instapundit or Slashdot? Are you ready for the surge in traffic when a popular radio host or TV station plugs your URL? How about for the Thursday night before Easter services?

Odds are, probably not.Stay connected, even during the good times

I’ve personally enjoyed an occasional ‘Instalanche,’ and once even the dreaded ‘Slashdot effect,’ along with some air time when I first started this blog. I’ve seen first hand the type of volume that can hammer away at a server when this happens?

So what to do?

Well let’s talk about some of the low lying fruit first. I’ll go ahead and use WordPress as an example platform as that covers the majority of HYCW cult members out there other than Mike Boyink, whom has special dispensation for his Expression Engine ways … but I digress …

  1. Caching is your friend – meaning if you’re not caching your content, do so now. There are plenty of plug-ins available including Super-Cache which rolls out with version 2.8. There are even 3rd party services if you’re in the big leagues.
  2. Optimize them images – I’ve written more than once about image bloat, which basically means for those who are not equipped and knowledgeable PhotoShop practitioners – get IrfanView and resize and optmize your .JPG, .GIF and .PNG images using the application’s default settings.
  3. Update your platform – Even though later versions of WordPress and associated plug-ins are likely to contain new features that increase their server footprint, they often include bug fixes and optimizations that help them perform better downstream.

So now that we’ve stated the obvious, let’s talk about a few more intermediate things we can do that’ll help things keep chugging along – provided you remember to make backups:

  1. Optimize your database – which is built-into phpMyAdmin that most hosts provide gratis. Otherwise, this can be accomplished at the command line by backing-up and then restoring one’s database – which is a good procedure to know regardless of optimization.
  2. Compress your CSS & JavaScript – for those of you who don’t code, there’s alot of repetitive white spaces, commands and operands that can be ‘tokenized’ into smaller symbology. YUI Compressor does a good job with JavaScript. CSS Drive offers one of many competent CSS Compressors out there.
  3. Turn-off unnecessary plug-ins, remove unused plugins – especially the former as they inject code and processing cycles into the page delivery process. No need to burden the user with this stuff if it’s not helping the cause.

Okay, now for the advanced stuff , the type of tasks no one likes because for the most part, these steps either require engaging in planning or policy:

  1. Email notifications – Consider turning off select groups of email notifications temporarily while the rush is on, for example, new registration notifications. This means knowing what emails you get from your site and what happens to whom when they’re altered.
  2. Old Post Comments – Think about using plugins that allow you to switch comments and/or pings on or off for batches of existing posts. I personally use Extended Comments Options such as those over a year old. This may be tough when dealing with pastors with several years of sermon submissions.
  3. Contingency plan –
    • I mentioned this before, but is your data backed-up on a regular basis? Do you know how to restore it?
    • It might help to have an alternate theme that is less graphic and media intensive for use during the rush. You know, one without all the ‘flashination?’
    • Work out an alternate domain with your service provider, and/or a sub-domain with neighboring organization. This could even be a microsite platform temporarily drafted to help with the load.
    • Discuss with your hosting provider other alternatives they might offer.

There are still some other real-hairy things you can do, but I suspect if you’re the type of reader who already knows about employing dual-server gardens for data and application, then I don’t really need to explain such big-league tactics.

The point is, be ready for success.

After all, Easter is just around the corner, and I can guarantee you, even if you don’t get mentioned by an A-blogger, you’re site is going to get hit with first time visitors looking for service times, directions, things for the kids, and what type of pancakes you’re serving at the sunrise service.

It might not hurt to have your analytics goals set up to capture such events either … more on that later.

December 29, 2009
by meandean

What Record Sales of the Amazon Kindle Means to Your Church Website

Yesterday , I was attracted by the Wired Magazine Gadget Labs  headline “Amazon: Kindle Books Outsold Real Books This Christmas.” According to a release cited in the article:

“[the] Kindle has become the most gifted item in Amazon’s history …

… On Christmas Day customers purchased more Kindle books than physical books.”

Now unlike my good friend Vincent Flanders, I’m not ready to tweet:

“RT @VincentFlandersThe bookstore is dead says Seth Godin http://bit.ly/8StlpZ

Kindle 2That said, when I look at all the paper my own church consumes on a weekly basis, I have to wonder if we don’t have as a mission initiative keeping the fine folks at Dunder Mifflin employed (let the reader understand).

This all got me to thinking, even though I’m not the type of guy who is going to chain himself to a tree – I do think judicious of resources falls under good stewardship – and that includes both natural resources as well as financial.

Meaning, as we continue to see the emergence of digital media devices, such as the Kindle and/or smart phones, why not consider providing and/or publishing more and more of your organizations information in supported by such devices?

Providing: let’s say you want to study Os Guinness’ “Dining with the Devil: The Megachurch Movement Flirts with Modernity”. The Paperback version is $12.82 not including the cost of shipping. The Kindle price for the same is $9.99. That’s about a 33% difference, again not including the cost of shipping.

Publishing: each Christmas and Easter, I see many churches publish multi-page pamphlets that contain all the bulletins for all the services. These are nice as they provide continuity, but I can also see where they’re going to run the church and/or charity a few bucks – especially as people forget to bring with them their nicely stapled paper pile from the previous week.

Yes, Amazon does get to keep about $0.65 of every dollar, but I do think there is a cost savings and possibly cost recovery even if your organization only charges the minimum $0.99 cents to sell your Advent Season bulletin on the Kindle.

Similarly, what would be the cost of simply pushing out to your organization’s website the average, weekly bulletin out to PDF or HTML for consumption by those in your congregation armed with BlackBerry’s and/or iPhones? Other than setting up the router? Especially since they can then also use the same network to follow-along Scripture readings with the mobile version of the ESV Bible?

Point is, I think it’s time to look around your church and/or charity’s offices and meeting rooms and see just how much paper could be saved by simply publishing the temporal stuff online.

What are your thoughts?

December 18, 2009
by meandean
1 Comment

12 Days of Jesus Junk – Day 5 – Speak Clearly

Even if you haven’t read the latest writings of Steve Krug, Jakob Nielsen or Luke Wroblewski, it doesn’t take a ‘Rocket Surgeon‘ understand the wisdom the “duck test” which according to the all-knowing Wikipedia asserts:

If it looks like a duck, swims like a duck and quacks like a duck, then it probably is a duck.

Which is why I find myself  a little bit confused when stumbled onto the  ‘Jesus Christ Celebriduck Limited Edition Collectible Rubber Duck‘ parodied in the instructional poster below:

12 Days of Jesus Junk - Day 5 - Speak Clearly

Call me old school but as I recall a rubber ducky is, as Ernie of Sesame Street so aptly described in song a “ .. little fella who’s Cute and yellow and chubby …

Now I know what some of you are thinking “Dean, you dope, the Celebriduck is a collector item thing … of course it doesn’t look like a duck!” …

… kidding aside, I already figured out it’s some niche merchandise marketed who also speak other arcane dialects such as “Beanie Baby” … but that gets to my point!

Using insider jargon-eze is a sure fire way to relegate your website the non-desirable’ SEO’ known as ‘search-engine obscurity.

Consider this:  in the U.S. 1 in 3 adults is unchurched. Meaning 1 in 3 adults don’t understand the ‘church-speak‘ that bables-up and out of expensive color brochures, sermon videos and web sites.

So when it comes to the purpose and personality of your organization, speak clearly and say it plain. Tell visitors precisely what THEY seek in terms THEY understand.

Put another way, by avoiding ‘clique chat‘  you’ll not only make your site more usable to individuals trying to find what you have to offer, but you’ll also help avoid spending $5k on a Search Engine Optimization (SEO) expert.

December 17, 2009
by meandean
Comments Off on 12 Days of Jesus Junk – Day 4 – Unreadable at 11:23

12 Days of Jesus Junk – Day 4 – Unreadable at 11:23

Even though I’m a software guy, I think if I were asked to design a religious-themed wall clock I might steer clear of some of the usability issues I find with the Jesus Christ Carrying Cross Christian Theme Wall Clock parodied below:

12 Days of Jesus Junk - Day 4 - Unreadable at 11:23

What usability issue? Well if I’m a user sitting across the room at 11:23, and possibly at 4:55 and 8:05, I might find it hard to see what time it is because of the dark black lines of the artwork create a dark black background for the thin black arms of the clock.

So what has this got to do with my church or charity website? Glad you asked.

What we want to take away from today’s example is the concept that part of a successful user interface isn’t just design that looks good (not that I find the clock artwork all that inspiring) — but also a design facilitates a positive and productive user experience.

This can be measured in ‘conversion rates,’ that is the rate at which the user successfully uses the website (or clock) to accomplish some item of work or information gathering.

This means we need to avoid design elements get in the way of a web page’s core functionality, otherwise we’re left with the antithesis of conversion – the user abandons the product – often quantified as the ‘bounce rate.

To help avoid this common pitfall, I offer this “fast five” lists of things to remember when designing a webpage:

  1. You are not your user;
  2. solve their problems, don’t burden them yours;
  3. don’t assume all any of your users are idiots;
  4. engage in user testing – where non-geeks attempt simple, common tasks; and
  5. when a problem and/or encumbrance by a user is reported – do what it takes to provide the user a clear path to operational/work-flow success.

On that last point, think Amazon.com, the premier example of conversion goals in action. When they hear of something that gets in the user’s way – even if it sounds stupid – they fix their site to accommodate the customer.

I’d recommend doing the same, perhaps starting with some good-old-fashioned hallway testing and moving out from there.