Adding the Full Job Location to our Prima Child Theme

One of our community members recently asked us for a how-to guide on displaying job location with each listing. Although this comes packaged with the original JobRoller theme (from Appthemes), it was decided that salary was a tad more important than where the job was located – although, with hindsight, that call might have been made prematurely.

You’ll Need the Following

Nonetheless, today’s guide will give you a brief overview of what code to use, where to use, and when to use it. Before we get around to it, there’s a few things that I you’ll need to know that goes beyond the scope of this guide:

  • We’ll be using the <dt> and <dd> tags a bit; If you don’t know what they are or how they work, you should do a quick google search first (They’re like <li> tags, but different – heh!)
  • You’ll need to a text editor (e.g. Dreamweaver, Notepad++ or even cPanel’s code editor when using File Manager) – using WordPress’ “Appearance » Editor” functionality won’t cut it in this instance as it can’t access all the files we need;
  • You’ll need to be familiar with the WordPress directory structure, specifically where themes are kept;
  • A working knowledge of how Child Themes relate to parent themes (even if it’s just how to install one);

The code we’ll use is relatively straightforward:

<dt><?php _e('Location', 'appthemes'); ?></dt>
<dd class="location"><?php jr_location(); ?></dd>

Note that we’ll only be inserting the abovementioned code in the actual listing, not in the popup that appears with our Prima child theme (that’s a whole different tutorial in itself).

Here’s the steps

  1. Open up loop-job.php in your chosen text editor;
  2. Find a line with the following code in it:
    <dt><?php _e('Location', 'appthemes'); ?></dt>
    <dd class="location"><?php if ($address = get_post_meta($post->ID, 'geo_short_address', true)) echo wptexturize($address); else _e('Anywhere','appthemes'); ?></dd>
  3. Highlight this code and replace it with the following:
    <dt><?php _e('Location', 'appthemes'); ?></dt>
    <dd class="location"><?php jr_location(); ?></dd>
  4. Save this file and upload it to child theme folder (remember to make backups of the files you’re replacing)
Unfortunately, this will only affect a small part of the theme: The normal job listings that users post in your website. You’ll also need to make the same changes to the following files:
  • includes/featured-jobs.php
  • single-job_listing.php

What did we just do?

In our Prima child theme, we were only interested in showing the city where the job is located. This required us pull in a specific part of the location, not the entire location. In contrast to this, if you want display the whole location the code is a bit easier (especially with the latest version of JobRoller) in that we only need to call a function entitled jr_location().