The Problem

The client services team where I work was having to manually add alt tags to images on a client’s website. This was a very time consuming process, so I decided to build a plugin to automatically generate these alt tags.

With all the recent developemnts in AI, I figured there was a way to leverage this to generate the alt tags and cut out lots of manual work.

The Solution

I found a NextJS example site that generated alt tags for images using AI. I decided to use this as a starting point and build a WordPress plugin that would integrate with this. The NextJS app exposed an endpoint that could be picked up within WordPress.

The plugin then added a page to the admin panel, where the user could run a task that generated alt tags for all images on the site that were missing one. This would then call the NextJS endpoint and pass through the highest quality image available for processing. The NextJS app used a ML model on Replicate to generate the text, and retunred it to WordPress.

The most challenging part of this was pulling out all of the images within WordPress that were missing alt tags. WordPres doesn’t provide a straightforward way to do this as the data is serialised in the database. It didn’t take long to figure out, but that shows how straightforward the NextJS integration and Replicate setup was.

The Tech

  • WordPress
  • NextJS
  • Replicate