They took my advice and modified the plugin, and it worked.

Today, one of our clients contacted us saying that they are trying to install a certain  WordPress analytics plugin, and the code that the plugin produces appears in the footer when they switch to the default theme, but it doesn’t work with the theme we created for them.

I realized that it must be the same missing hook problem, and we looked into it and identified the following hook which indeed was missing from their theme:

<?php wp_footer(); ?>

We added it to their footer.php file, and the plugin started to work!

So take note theme developers for the WordPress community and for private clients (I am including myself in this): it is important to run through a checklist of code snippets that your WordPress themes should contain so that users and clients can enjoy smooth running WordPress sites.

<?php wp_footer(); ?> is just one of them. The WordPress Codex has a very handy page called Theme Development that goes through functionality and code that WordPress themes should have. Here are some important sections:

Theme Template Files List – list of all the possible theme template files.

Plugin API Hooks – list of all the pieces of code needed for plugins that use those hooks to work. Weblog Tools Collection reported that another API hook that’s regularly forgotten in themes is wp_head();.

The best place for wp_footer();

WP Designer (when he was still writing his amazing blog) wrote about this hook and discusses the ideal placement for it within your theme files. He says that often plugins will break your theme if they use this hook, so it’s best to put it in a style-less div container “that your layout doesn’t depend on. Otherwise, you might end up with an incomplete layout while waiting for a slow loading plugin.”

I’m a bit embarrassed that I wasn’t aware of this apparently basic yet important WordPress theme issue. But I hope that by admitting my lack of knowledge I can help some of you solve plugin problems or theme problems.

I installed it here on WordPress Garage so you can see it in action, but basically the way it works is key terms get a dotted orange underline (which helps differentiate them from your regular links), and when you mouse-over those terms a pop-up window appears with information tabs. These tabs display the following content:

1. A short summary about the key-term (Wikipedia style information)
2. Related News, Articles & Posts
3. Related images from Flickr, Panoramio, Picasa, etc.
4. Related Tweets
5. Related Videos from Youtube
6. Related Products from Amazon
7. How your readers Facebook friends relate to the key term (requires readers to approve Facebook connection)

For geographic locations the pop-up will display a Map tab, and for films a Trailer tab will be displayed.

The field of semantic technologies is so new that Headup is only one of 9 WordPress plugins that have “semantic web” as a tag in the plugin directory.

How to install the Headup plugin

1. Go to “Add New” in the WordPress plugin menu.
2. Enter “headup” as the search term to find the plugin in the directory. There will only be one result for this term.
3. Click the “Install” button on the far right, and then activate the plugin.
4. You can configure some settings for the plugin under Settings > Headup for WordPress. There you can choose a maximum number of annotations to display on a page, how many times the same term should be annotated, and whether hyperlinks should be annotated as well.

It will take about an hour before the key terms on your site start displaying the dotted orange highlights. Here’s a short video explaining how to install the plugin:

Click here to view the embedded video.

Here’s another video overview of the Headup Blog Widget and WordPress plugin.

Why would you use this plugin?

The creators of the plugin say that by offering this type of content, you can “reduce bounce rates and increase your readers’ engagement.” Since I tend to judge the world by my own preferences, I was a bit skeptical as to whether such a feature could really achieve those goals since I prefer to find my own info rather than have it dictated to me. Luckily, my pal Mike works at SemantiNet so I decided to ask him a few questions about this plugin, their technology, the semantic web in general, and whether he agrees that Cookies and Cream is Ben & Jerry’s best ice cream flavor.

WPG: Mike, tell me a bit about SemantiNet and what you do there.

Mike: Whereas much of the activity related to semantic web is still very much academic and theoretical, SemantiNet’s products are among the few examples of practical applications of next generation web technology anyone can enjoy today.

What our technology does is identify key-terms in publications & blogs and then provide relevant and personalized related content in real-time. For example, say you’ve written a post about Barack Obama recently being elected in Oslo to be honored with the Nobel Peace Prize. What we’ll do is automatically identify the term “Barack Obama” as being president of the US, and suggest content related to him, and identify the term “Oslo” as being a city, and suggest content related to it too.

The big deal here is that the technology realizes that Oslo, the city, has different attributes from Obama, the person, so it will offer different types of information for each. For example, Oslo’s Headup results would include a city map, while Obama’s would not.

As for me, I’m a Project Manager in the company and am responsible for managing the company’s site and blog widget.

WPG: Call me an ignoramus Mike (don’t look so happy about the opportunity), but I still don’t quite get what the semantic web is about. Please explain and make me feel more intelligent.

Mike: What makes companies like SemantiNet exciting is that their understanding of online content goes beyond the basic key-word matching we’re familiar with from current search technologies, and enters the realm of true object identification. This is a fancy way of saying that whereas today, if you search for “Apple” you’ll get results related to the company and the fruit indiscriminately, the vision for Semantic Web is that the same search will deliver results that relate not only to “Apple” but also to “Steve Jobs,” “iPhones,” ”iPods,” etc. even if the word “Apple” isn’t explicitly mentioned in the text results.

For more information about the Semantic Web I recommend seeing Sir Tim Berners Lee’s excellent TED talk on the subject.

WPG: How can bloggers and publishers offer this type of rich information on their own sites?

Mike: To date we have three products people can use to get a better feeling for what this does: the Headup Firefox addon, the Headup publisher and blogger widget, and most recently, the Headup WordPress plugin.

WPG: Why should bloggers install the Headup plugin?

Mike: Bloggers who install our widget will gain longer engagement times and reduced bounce rates. Besides these advantages the widget has the ability, via the “Friends” tab, to enable readers to personalize their reading experience and see how the key terms you blogged about relate to their circle of friends. To the best of my knowledge no other widget out there has this capability.

A significant benefit is the fact that everything I’ve described so far is entirely automated. All you as a blogger need to do is a single one time installation of the plugin and within about an hour your entire archive will be covered. This level of automation is again, to the best of my knowledge, unprecedented.

WPG: How does the widget promote engagement time and reduce bounce rate?

Mike: The widget reduces your reader’s incentive to browse away by letting them access all the related content they need right on top of your pages. Why go somewhere else when you have everything you need right where you are?

In your interview with Lior Haner from Yedda you asked, quite rightly, how Yedda was solving bloggers’ need to have conversations take place in their blog. We don’t deal in conversations, however as far as complementary and related content is concerned, we’ve pretty much guaranteed bloggers that their audience won’t have to open another tab or browse away to get the little extra that was missing.

WPG: Can bloggers contact you with questions?

Mike: For sure! I’m personally available for any support needed both on twitter @headup and via email – miked[at]semantinet[dot]com. Don’t be Shy!

WPG: Anything else you’d care to add?

Mike: I agree that Cookies and Cream is Ben & Jerry’s best flavor.

WPG: Of course you do! That’s why we’re pals.

So there you have it. I’d love it if you, our readers, would check out this new feature here and tell me what you think: is it useful, annoying, or somewhere in between?

Let’s say we have 2 search forms on our site:

1. General Site-Wide Search
2. Recipe Search – searches subcategories of the Recipe Category

The first thing we need to do is tweak the search.php template to use it as a filter that will recognize if a search is coming from the Site-Wide search form or the Recipe Search form.

1. Open Search.php and delete everything.  Add the following code:

<?php
/* Template Name: Search Results */
$search_refer = $_GET["site_section"];
if ($search_refer == ‘recipe’) { load_template(TEMPLATEPATH . ‘/recipe-search.php’); }
elseif ($search_refer == ’site-search’) { load_template(TEMPLATEPATH . ‘/site-search.php’); }; ?>

2. Open Header.php or wherever the General Site-Wide Search Form is located and add this line:

<input type=”hidden” name=”site_section” value=”site-search” />

The Site-Wide Search form will look something like this:

<form method=”get” id=”searchform” action=”<?php bloginfo(’home’); ?>/”>
<div id=”search”>
<input type=”text” value=” ” onclick=”this.value=”;” name=”s” id=”s” />
<input type=”hidden” name=”site_section” value=”site-search” />
<input name=”" type=”image” src=”<?php bloginfo(’stylesheet_directory’); ?>/styles/<?php echo “$style_path”; ?>/search.gif” value=”Go” />
</div><!–/search –>
</form>

3. Open Recipes.php or wherever your second search is and insert this line:

<input type=”hidden” name=”site_section” value=”recipe” />

You can change the value “recipe” to whatever suits your needs. Just make sure it matches the value in search.php.

The Recipe Search form for your second search will look something like this. In my case, this second search is meant to search the subcategories of the Recipe category.  See my previous post to learn about hacking the search function to search subcategories.

<form method=”get” id=”rsearchform” action=”<?php bloginfo(’home’); ?>/”>
<div id=”rsearch”>
<input type=”text” value=”Recipe Search… ” onclick=”this.value=”;” name=”s” id=”rs” />
<?php $categories = get_categories(’child_of=11′);
$catlist = ”;
foreach ($categories as $cat) {
$catlist.= $cat->cat_ID.’,';
}
$catlist.’11′;
?>
<input type=”hidden” name=”cat” value=”<?php echo “$catlist”?>” />
<input type=”hidden” name=”site_section” value=”recipe” />
<input name=”" type=”image” src=”<?php bloginfo(’stylesheet_directory’); ?>/styles/<?php echo “$style_path”; ?>/search.gif” value=”Go” />
</div><!–/search –>
</form>

4. Customize the Search Results Templates

If you recall, in step 1, we added the following to the search.php page.

if ($search_refer == ‘recipe’) { load_template(TEMPLATEPATH . ‘/recipe-search.php’); }
elseif ($search_refer == ’site-search’) { load_template(TEMPLATEPATH . ‘/site-search.php’); }; ?>

Create recipe-search.php (or whatever you named this template) and customize the layout of the results page to your liking. You can use index.php to start with and customize from there.

Create site-search.php (or whatever you named this template) and customize the layout of the results page to your liking. You can use index.php to start with and customize from there.

So, I started exploring the whole family in Wordpress – grandparents, parents, and children. Translation for those not yet used to seeing Wordpress analagous to the family in My Big Fat Greek Wedding: Pages, sub-pages, and sub-sub pages

Simple Directory Setup

• Directory Page (grandparent): Displays list of Non-Profit Organization Categories (ex. social, environment, health, etc.)
• Category Page (parent): Show title and excerpt of each Organization within a category (ex. Environment Organizations)
• Single Organization Page (child/current): Show content about a single organization(ex. SaveTheEarth – made up org for this example)

Here’s how to do it

1. Create a Page Called Directory. This will be the Directory Page (grandparent)
2. Find the Page ID. Let’s say the Page ID = 5. Depending on how you want to display the category info, you can
3. Manually add the name of each category, a short description and a link
4. Open up page.php so we can setup The Category Page (Parent Page). We want to show title and excerpts of each organization for each category.
5. Add this code to page.php – Checks if we’re on a sub page / child page of the Directory (Page ID =10) and if so, list the pages in alphabetical order with excerpts. For the excerpt, I’m using the plugin Limit Posts since it didn’t work with The Excerpt Reloaded.<?php
   $current = $post->ID;
   $parent = $post->post_parent;
   $grandparent_get = get_post($parent);
   $grandparent = $grandparent_get->post_parent;
   ?>

   <?php if ( $post->post_parent==”10″   ){ ?>
   <?php $pageChildren = $wpdb->get_results(”SELECT *    FROM $wpdb->posts WHERE post_parent = “.$post->ID.”    AND post_type = ‘page’ ORDER BY post_title ASC”, ‘OBJECT’);    ?>

   <h2 class=”titles”><a href=”<? php echo get_permalink($pageChild->ID);  ?>”> <? php echo $pageChild->post_title;  ?></a></h2>

   <?php the_content_limit(280, “”); ?><div class=”readmore”><a href=”<?php echo get_permalink($pageChild->ID); ?>” rel=”bookmark” title=”Permanent Link to <? php echo $pageChild->post_title;   ?>”>Read More &raquo;</a></div>

   (make sure to delete the space between <? and php -  I had to to do that so it wouldn’t execute in this post)

6. Single Organization Page (Child Page) On page.php, after the code you added in step 5, add this code that will check to see if we’re on the grandchild page. This will be the actual organization’s page. In our example, the SaveTheEarth Page. This is very helpful information in case you want to add a different style or add special items in the sidebar, etc.
   <?php if ( $pageChildren ) : foreach ( $pageChildren as $pageChild ) : setup_postdata( $pageChild ); ?>

7. Set up how the rest of the pages on your site will look:

On page.php, after the code in step 6, add this code which instructs every other page in the site to act normally and display the content

<?php endforeach; ?>
<?php else : ?>

<?php the_content(); ?>
<?php  endif; ?>

You can see the full page.php code here

You can see the directory in action here

I figured this out using the following helpful posts:

* http://wordpress.org/support/topic/186206
* http://wpguru.co.za/page/display-title-excerpt-of-child-page