With JQuery, we can target an input dynamically, and add in the attribute using the attr(); method. Since the attribute doesn’t require a value, we’ll need to pass the webkit speech attribbute, and an empty value to JQuery’s attribute method like so: attr('x-webkit-speech', '');

//add speech input to a text field via JQuery
$(document).ready(function(){ 
  $('#search').attr('x-webkit-speech', ''); 
});

Big thanks to phpied.com for the inspiration.

For a bit of extra flair, I included some CSS3 transitions, box-shadow, and opacity on the drop-down menus.  The WordPress integration also included tweaking the “custom background” feature so the background on the homepage can be changed by the user via the backend.

UniqueConformity.com

However, as functional and useful as some of the features are, optimizing your site for search engines and user navigation can be a little daunting. One thing that has been bugging me for a while now is Ekk’s lack of attention for the <title> element.

Because of how the Monk CMS API works, each template (or module) type uses a different API call to spit out content. This means that each page, article, event, or sermon requires a different getContent() statement to find the page’s content.

Here’s a hack-ish solution I came up with to display a more relevant <title> element using PHP to find the template type using the page URI. After the page URI is found with $_SERVER['REQUEST_URI'], we’re using preg_split() to find the first part of the URI, which is the template type. After that’s found, we show Ekklesia which getContent() statement to use and then we get the correct title, no matter where we are in the site.

This should help those (like us) who have been victims of the dreaded “duplicate content” warnings on Google webmaster tools and similar systems.

<title>
<?php
  $hdtitle = getContent("page","find:".$_GET['nav'],"show:__title__","noecho");
  if ($hdtitle == "INDEX"){
    echo "Wheatland Salem Church | Naperville & Oswego, IL.";
    } else if ($hdtitle != "") {
      echo $hdtitle." | "."Wheatland Salem Church";
    } else if ($hdtitle == "") {			
      $uriPath = preg_split("/\//",$_SERVER['REQUEST_URI'],-1);
      $uriKey = $uriPath[1];		
      if ($uriKey == "article") {
        getContent("article","display:detail","find:".$_GET['slug'],"show:__title__ | ");
        echo "Wheatland Salem Church";
      } else if ($uriKey == "sermons") {
        echo "Sermons | Wheatland Salem Church";
      } else if ($uriKey == "events") {
        echo "Events | Wheatland Salem Church";
      } else if ($uriKey == "sermon") {
        getContent("sermon","display:detail","find:".$_GET['slug'],"show:__title__ | ");
        echo "Wheatland Salem Church";
      } else if ($uriKey == "event") {
        getContent("event","display:detail","find:".$_GET['slug'],"show:__title__ | ");
        echo "Wheatland Salem Church";
      }
    } else {
      echo "Wheatland Salem Church";
  }
?>
</title>

I designed the site, integrated wordpress, and included a ‘progress’ meter on the frontpage that we could dynamically update during our giving Sundays.  The site (as you can see) does not get updated as much as we’d like, mainly because the updates depend on missionaries who are in remote locations, much of the time without consistent internet access.

Another iteration of this site is planned for Christmas 2011 focused on testimonials of those who have received the donated funds and more updates from missionaries – though due to budgetary concerns, the status of this year’s RC campaign is not yet known.

Visit reconnectchristmas.com.

With our small team, we planned, designed, and produced “Wheatland Life” in-house. On the earlier versions, I was responsible for the design, layout, and printing, but later inherited the project manager role when our staffing situation changed.

We distribute this publication by mail, but also use issuu.com to provide our congregation with an interactive online version they can read directly on the web. This has been a very successful change in the way we communicate with the younger, more tech savvy members at the church.

I now manage the production of the publication from planning to printing, working with and coordinating a group of volunteer writers and staff members.

A list of Wheatland Life editions can be found on wheatlandsalem.org/wheatland-life.

I was responsible for communicating our needs to Fishhook, working with them on the details of the design and functionality, and content-population after the site was complete.

My ongoing job responsibilities included updates as requested by the staff and ministry teams, designing site graphics and other media, and aided in assessing current and future needs based on user input and staff requests.

After the launch of the site and a new online communication plan, we saw a 35% increase in unique visits.

wheatlandsalem.org

We also used to send a TON of emails. Before we enacted a communications plan, we gave the whole staff unfettered access to our Constant Contact account. One month, we sent 32 emails, and over half of those were to the “All Church” list.

In early 2010, we switched to Mailchimp, and haven’t looked back. I designed an email template using Mailchimp’s template tags, set up user groups, and gave our users a way to filter out content that they didn’t want to see.

Here’s a look at the new email:

This Week at Wheatland Salem Church

Orbs Motion Loop from Wheatland Salem on Vimeo.

Orbs Motion Loop by Wheatland Salem Churchq is licensed under a Creative Commons Attribution-Noncommercial-Share Alike 3.0 United States License.
Permissions beyond the scope of this license may be available at http://www.wheatlandsalem.org.

This was my first experience using JQuery UI. I utilized the accordion plugin to collapse and expand the different sections containing the artist’s information. I also used a flash-based media player which communicated with javascript in the page to play different songs from the different artists, so the player remained independent of the different sections.

A live version of this site no longer exists on Provident’s servers, but you can find one here: shawnhubbard.net/provident