Say you have a WordPress site, where each post is an article that has been written by multiple writers. And say that the specification calls for a section on the site’s homepage that features information about three random authors, from any of the hundreds of posts on the site — the information being: the author’s name, their image, and a short biography.
That was a challenge I was faced with, and this post will follow the steps I took to solve it.
The site was an aggregation of scientific articles, each of which was authored by multiple writers. Since none of the authors were members of the site, I couldn’t use WordPress’s user interface — I had to find a different method of storing the authors’ info and matching it to a post.
Then I had to look for a strategy for displaying a section of three authors’ info from random posts on the homepage.
Storing Authors’ Info per Post
Creating Author Info with ACF
To store the authors’ info, we decided to use the ACF — Advanced Custom Fields — plugin. In the plugin’s admin area, we created three groups of author’s info— since each post could have been written by up to three authors — each group consisting of three fields:
- A text field for the authors’ name,
- An image field for their image,
- And another text field for their bio.
Filling the Author Info on the Post Edit Screen
Now the website editors can fill in the author info at the bottom of each post.
See picture below.
Displaying Three Random Authors
Now that we had the authors’ info stored as the posts’ custom fields, we needed a strategy for selecting three random authors to display on the site’s homepage.
Select All Posts That Have Authors
The ideal implementation would have been to select all posts from the DB, and to choose three random authors. That way, the authors would be taken from the pool of all authors, ensuring absolute randomness. However, while this implementation was ideal from a randomness point of view, it turned out to be far from ideal from other standpoints, as we’ll find out shortly.
Another parameter that I added at first was a meta query, to ensure that only posts with author info would be selected.
But we soon realized that all posts had authors’ info, so we dropped the meta query.
If You Care About Performance, You Can’t Select All
As I stated before, the initial implementation selected all the site’s posts, and this solution held up for a while. But as time went on, new articles were being added, and one day we got a complaint that the homepage was taking too long to load. I shut off the plugin to check if it was causing the delay, and sure enough, the homepage loaded quickly again. I realized that the rapidly increasing number of articles was causing the query to slow down, and thus becoming a performance hindrance [the volume of posts was taking its toll on performance].
Therefore I decided to limit the selected posts to 50, thus significantly decreasing the number of retrieved posts, while still using a large enough sample — between 50 and 150 authors, though not unique — to promise a new selection on every refresh. I combined this limit with a parameter that ensured randomality, and that solved the performance problem.
Setting the Ground for the Author Search
The next step was to loop through the retrieved post IDs and look for unique authors. To do that, I initialized the following arrays:
- An array of authors of the current post (
authors_collection), - An array of the chosen random authors (
$random_authors), - And an array of post ID’s already checked (
$random_author_post_ids).
Out of the 50 posts, I then selected a random post ID using the mt_rand function. If the post ID didn’t exist in the $random_author_post_ids array yet, I inserted that ID into it. If it did already exist, I broke out of the loop and went back into it to select a new random number.
Armed with the new post ID, I had two more missions:
- Find among its authors one that hasn’t been shown yet in this round,
- Display the author’s info on the screen.
Finding an Author
The quest in search of an author from this random post called for a separate function — find_populated_author_field — whose code was inspired by this answer in the ACF forums.
Since I needed to select three fields (name, image, and description), I built a helper function called set_authors_array that, as its name implies, filled an array of authors using ACF’s function to fetch custom post fields, get-field.
Back to find_populated_author_field: after calling the function that filled the authors_collection, the function went on to check that the info was full enough for featuring on the front page. Since there could be cases where some author info wasn’t filled, the function checked before adding an author to the array, and only if all the info existed did the function insert the author’s info into the random_authors array.
Displaying Author’s Info on the Front End
The find_populated_author_field function returned the index to the author it had just inserted into random_authors, and the next step was to wrap the author info in HTML.
As you can see, we wrap each author with a <section> tag, and then call a helper function to wrap each field with its own HTML.
Creating the HTML for Author’s Name
- The author’s name is a link to their page (I’ll discuss the creation of this page in a future post)
2. The image is, of course, wrapped in an <img> tag. If there is no author image— the code inserts a default image.
3. Lastly, the description is wrapped in a simple <span> tag.
And so, we got our section on the site’s home page featuring 3 randomly selected authors, as you can see in the screenshot:
To Summarize
This post has demonstrated how to store authors’ info, and easily retrieve them to feature three random authors’ info, by following these steps:
- Storing the info as post fields using the ACF — Advanced Custom Fields — plugin.
- Selecting 50 random posts from the DB.
- Selecting a random post of the 50 posts array.
- Collecting all the authors connected to this post.
- Choosing an author that hasn’t been displayed yet in the current page load.
- Wrapping the info in HTML and displaying on the screen.
- Following steps 3–7 until three authors’ info are featured.
What about you?
What about you— have you encountered a use-case that needed such a solution? Do you have insights you’d like to share? You’re more than invited to leave a comment, I’d love to hear from you.
Data in the screenshots was generated from the following sites:
📝 Read this story later in Journal.
👩💻 Wake up every Sunday morning to the week’s most noteworthy stories in Tech waiting in your inbox. Read the Noteworthy in Tech newsletter.
