ChatGPT Quickly Wrote This WordPress Plugin

This morning, with my limited guidance, ChatGPT wrote this WordPress plugin that displays a Tangilla JSON events feed. There is likely a slew of available JSON feed display plugins for WordPress. So why did I do this? Because yesterday a client told our team at Tangilla that their web partner could not work with a JSON feed to display their events and get real-time updates. I found that more than a little surprising.

It’s surprising because a JSON feed is an extremely simple way for websites to send information to each other. Imagine you are on a website that shows pictures of houses. That website wants you to be able to display the latest pictures added to that website on your website. One of the simplest ways for them to do this would be to use a JSON feed.

A JSON feed is just a list of information sent over the internet in a special human-readable format. The information is broken up into pieces called “objects,” and each object has a set of “keys” and “values.” For example, one object in the feed might have a key called “image” and a value that is the URL of a house photo. Another object might have a key called “caption” and a value that describes the photo.

To read a JSON feed, your computer sends a request to the website and asks for the latest information. The website sends back the JSON feed, and your computer reads the feed and shows you the information. JSON feeds are a quick and easy way for websites to share information. It’s a web standard, so it surprised me that a professional web development company would say they couldn’t work with a JSON feed. I decided to prove its simplicity by asking ChatGPT to build a WordPress plugin.

I’ve Never Built A WordPress Plugin Before

It should be noted I’ve never written a WordPress plugin before, and I have almost no coding skills. I have a rudimentary understanding of what I’m looking at in various lines of PHP, but that’s it. So, I decided to start with a very straightforward request and keep asking questions until I got to something that felt like it might work.

Me: Write a WordPress plugin that takes information from a JSON feed and displays it.

ChatGPT: Sure, here is a basic outline of how you can create a WordPress plugin that displays information from a JSON feed:

1. Create a new folder in the wp-content/plugins directory of your WordPress installation and give it a unique name.
2. Inside this folder, create a new PHP file and name it plugin-name.php, where plugin-name is the name of your plugin. This will be the main plugin file.
3. At the top of the plugin-name.php file, and add the plugin header information. This is a block of comments that specifies the plugin name, author, version, etc. Here is an example: (it then gave example code.)
4. Next, you will need to create a function that retrieves the data from the JSON feed and displays it. You can use the wp_remote_get() function to retrieve the data from the feed and then use the json_decode() function to parse the JSON data into a PHP object. Here is an example of how you might do this: (It then gave an example of the code.)
5. To display the data from the JSON feed on your WordPress site, you will need to add a shortcode or a widget that calls the display_json_feed() function. (It then gave an example of the code.)

Next, I gave ChatGPT an example of an item in the Tangilla events feed for the Austin Board of REALTORS® and said, “Can you write the plugin to display this content?”

It quickly churned out some code, and I began asking it to modify the code based on my goals. My side of the conversation looked like this:

• If I want to only display the first ten events in the feed, how would I do that?
• Where does the function display_json_feed() live in the plugin? Where do I put this code to make this work? Can you place it for me?
• I need the entire PHP file, including the functions, to be updated so that the plugin’s name is Tangilla Feed Display and the shortcode is ‘tangilla_feed,’ please. (Yes, sometimes I talk politely to my AI chatbot. I don’t want to piss it off.)
• What if I need to sort the feed to display in date order?

The final version of the code is shown below. The only modifications I made manually were, adding in replacements for generic data and links, eliminating the location address field from the display commands, adding an h3 tag to the price, and changing the dashboard’s name to “Tangilla Events Feed.” All of the actual “heavy lifting” was done by ChatGPT.

<?php
/*
Plugin Name: Tangilla Feed Display
Plugin URI: http://tangilla.com
Description: This is a WordPress plugin that displays information from the Tangilla JSON feed for events.
Version: 1.0
Author: Jeff Turner & ChatGPT
Author URI: http://jeffturner.info
*/

function display_json_feed() {
  // Retrieve the data from the JSON feed
  $json = file_get_contents( 'https://api.tangilla.com/event/v1/feed/0000/live' );
  $data = json_decode( $json );

  // Sort the data by date
usort( $data, function( $a, $b ) {
  return strtotime( $a->event_date ) - strtotime( $b->event_date );
} );

  // Display the first 10 events
  $counter = 0;
  echo '<style>';
  echo '.event {';
  echo '  border-bottom: 1px solid #ccc;';
  echo '  padding-bottom: 20px;';
  echo '  padding-top: 20px;';
  echo '  text-align: left;';
  echo '}';
  echo '</style>';
  foreach ( $data as $item ) {
    echo '<div class="event">';
    echo '<h3>' . $item->event_title . '</h3>';
    echo '<p>' . $item->event_description . '</p>';
    echo '<p>Date: ' . $item->event_date . '<br>';
    echo 'Time: ' . $item->start_time . ' - ' . $item->end_time . '<br>';
    echo 'Location: ' . $item->location . '<br>';
    echo '<h3>Price: $' . $item->price . '</h3>';
    echo '<p>Registration Link: <a href="' . $item->registration_link . '">' . $item->registration_link . '</a></p>';
    echo '</div>';

    $counter++;
    if ( $counter == 10 ) {
      break;
    }
  }
}

function display_json_feed_shortcode() {
  display_json_feed();
}
add_shortcode( 'tangilla_feed', 'display_json_feed_shortcode' );

function add_json_feed_widget() {
  wp_add_dashboard_widget( 'json_feed_widget', 'Tangilla Events Feed', 'display_json_feed' );
}
add_action( 'wp_dashboard_setup', 'add_json_feed_widget' );

I copied my new plugin into the wp-contents folder as directed in step one above, activated it, and voila… a working plugin. Here is a screen capture of it working in the dashboard on this site.

And here is the shortcode displaying as intended on a WordPress page.

Is this the most incredible display of artificial intelligence capabilities? Most certainly not, but I guess that’s why I decided to do it. The fact that an established real estate industry web developer would balk at a JSON feed seemed ridiculous to me. Frankly, I’m sick of vendors in the real estate space holding clients hostage to their aging technology. Even for someone moderately skilled in PHP, building this simple plugin should be a breeze. It was certainly a breeze for ChatGPT.

---