Support » Developing with WordPress » Using a shortcode in a plugin to display data from a third party API

  • jjz0393

    (@jjz0393)


    Hello – I thought this would be easier to figure out but I’m not sure how to approach this. I’m relatively knew to WordPress plugin development but not to PHP.

    I’m building a plugin that creates a shortcode to display an initial list of jobs wherever the shortcode is placed. What I’m trying to figure out is how to I link each of those jobs to a description about the job itself. Those descriptions will be pulled back from the same third party API so I don’t want them to be custom post types (since there will be no content in the WordPress database for them)

    So I’d like something like url.com/job-listings – this page would use the custom shortcode I created to pull job listings. The shortcode currently outputs a list like this:

    <a href=''>Job 1</a>
    <a href=''>Job 2</a>
    <a href=''>Job 3</a>

    So my question is how do I create a link like url.com/job-listing?id=xxxxxxx where the URL parameter could be used to retrieve and display that specific job information. Obviously this plugin will not be theme-specific so I’m avoiding creating a custom template for the theme I’m currently using. I’d like to just basically display that job information (inside the layout of whatever theme I’m using) if the user hits my ‘job listing’ page.

    Hope that makes sense! I’m sure there are a few ways I could hack it together but I’m looking to understand the best practice as I know this isn’t an uncommon request.

    – Do I create a custom template somehow within the plugin?
    – Do I just use an action hook and check for the existence of a url parameter job_id and then display what I want instead of the page content?

    • This topic was modified 5 years ago by jjz0393.
Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    You don’t need a template nor any action or filter hooks. It can all be managed within your shortcode handler. Templates are properly the realm of themes. They are tricky to implement from plugins. Since you don’t need one anyway, don’t bother.

    How you build the link and include it in the shortcode output depends on what data you are actually getting from the API. If the API response is JSON, you’ll want to decode it into a PHP array structure so the elements are easily accessed. Do so with json_decode().

    I’ve no idea what sort of structure you would end up with, let’s assume it’s like this:

    $data = array( array('id'=> 1234, 'title'=>'foobar',),
        array('id'=> 1235, 'title'=>'snafu',),
        // more elements...
    )

    You could do a foreach loop through each of the $data array elements. In each iteration you could add another job listing link to the main $content variable that is collecting all shortcode output like so:

    $output = '';
    foreach ( $data as $job ) {
       $output .= "<a href='http://example.com/job-listing/?id={$job['id']}'>{$job['title']}</a>\n";
    }
    return $output;

    Once all output has been collected, return the variable containing it and WP will echo out the content every time it encounters your shortcode. Hot tip: be sure you do not echo out or otherwise generate direct output from your shortcode handler. All content must be collected into a variable that is returned to WP. Direct output will end up somewhere where it does not belong.

    Thread Starter jjz0393

    (@jjz0393)

    Thanks for the reply @bcworkz. I understand everything you have there and that is how I’m currently outputting the links in the shortcode handler to display the job links. My question was when someone clicks on that link, where does it take them? I’m not sure what the target of the link should be since there obviously is no actual page or post to link to. I know whatever “page/post” I send it to, I’ll use the job_id url parameter to retrieve the job’s description via the API and then display it but the question is what do I link to?

    In my existing dev environment I’m putting the shortcode to display 10 job links on the homepage (example.com). That all works fine. So now that those jobs are displayed, should the target be example.com/?job_id=12345 or example.com/some-arbitrary-slug/?job_id=12345? Again, there’s no real WordPress post/page to handle the job description.

    Thanks in advance!

    Moderator bcworkz

    (@bcworkz)

    OK, I think I misunderstood what’s happening where. I thought you were linking to the site that provided the job list, that the IDs caused a full job listing to display on the remote site.

    Are you trying to link to a “resource” (even if virtual) on your own site, which in turn displays data taken from a third party API? In that case, the job_id parameter becomes a query var and you can manage what WP displays anytime this query var occurs. First, whitelist your query var so it becomes part of the query object. Use the ‘query_vars’ filter to add “post_id” to the passed array.

    A good way to display a virtual resource is to utilize a custom page template. Add a page based on this template (a one time thing, not for every request). Hook the “pre_get_posts” action. If the post_id query var has a value here, alter the other query vars to cause that page with the custom template to load.

    The custom template can then get the query var from the global $wp_query object or $_GET. Then request the description through the API. Decode and format the returned data in any suitable manner, then output it along with all the other usual page chrome like header, sidebar, footer, etc.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Using a shortcode in a plugin to display data from a third party API’ is closed to new replies.