DEV Community


Posted on • Originally published at

Search and WordPress Shortcodes

My wife and I run a WordPress blog about our family, and I’ve incorporated the Algolia plugin to replace the default search to improve it. With its addition, search suggestions and search-as-you-type improves the whole experience (if I do say so myself), especially in showing text match snippets in the results. I did notice something odd, however:

Screenshot of WordPress search with shortcodes appearing in result snippets

A shortcode appears in the first search result's snippet.

As you can see here, snippets include shortcodes. In case you aren’t aware, shortcodes in WordPress are special codes written inside square brackets. They’re stored in plain text as part of the page or post, but WordPress’s rendering process converts them on the fly into whatever content they’re actually supposed to be.

In the above image, you can see the beginning of a shortcode: [aesop_video. This is because for quite some time, I had been using a plugin called Aesop Story Engine to contol the display of images and videos in my posts. This was well before Gutenberg gained traction, which for themes which enabled it, could break media out of the normal post width. (Aesop did it first. 🙂)

Unfortunately, this resulted in an unpleasant side effect of showing the shortcodes (which are stored in plain text) in the type-to-search powered by Algolia. The only way to fix this is to go through every post with Aesop shortcodes, replacing them with the equivalent Gutenberg block.

I’ve lost track of how many posts I’ve updated. I’m down to about 250 more to go…

This post was originally published on Bold Oak Design.

Discussion (0)