Get Qi Theme with 150 superbly designed WordPress demos

Get Qi Theme
Qi Theme
Sign up for our newsletter and be the first to get all the latest Qode news and updates.
BACK TO TOP

How to Customize Your WordPress Search Results Page

How to Customize Your WordPress Search Results Page

If you’d have to sum up WordPress in one sentence, it would be hard to avoid the word “customization” in it. When you think about the things that make WordPress awesome – the freedom, the plugins, the themes – you’ll see that they either enable WordPress’ customizability or are a product of it. WordPress lets you fine-tune everything, from what people see when they land on your website, to how very specific pages – like the WordPress search results page – look like.

Still, some things are easier to customize than others. You can, for example, use a WordPress search plugin to easily change the native search feature. You can completely remove search from WordPress using the same hassle-free method. When it comes to creating a custom WordPress search results page, however, things get a little bit more complicated.

In this article, we’ll talk about search results page customization. The topics we’ll cover include:

Qode Themes: Top Picks
Bridge New Banner
Bridge

Creative Multi-Purpose WordPress Theme

Stockholm WordPress Theme
Stockholm

A Genuinely Multi-Concept Theme

Startit WordPress Theme
Startit

Fresh Startup Business Theme

Why Customize Your WordPress Search Results Page

Search Results

The search function is one of the most useful functions a website can have. It can significantly improve your website’s user experience by making it easier for people to find things on your website. You can also use it for a whole host of other purposes, like product suggestions and cross-selling, and there are lots of plugins you can easily use to make the most out of this important feature.

Keep in mind, however, that the ability to search isn’t the only thing that matters about the search function – the presentation of the results matters, too. You can affect the presentation in two ways, by changing the parameters of the search, or by changing how the search results page looks and behaves. That’s one of the reasons why you’d want to create a custom search results page.

Every new thing a visitor sees on your website, be it a page or a post, can either persuade them to stay on your website longer or make them go away. This is the mindset you’d have when optimizing any other page on your website, and there’s no reason why you wouldn’t apply it to a search results page. Still, that brings us to the problem, though – the search results page isn’t ordinary.

How Is a Search Results Page Different from a Regular Page

The appearance and functions of the search results page are governed by the WordPress theme you’re using. When you perform the search function, the results are displayed on a page using the template as dictated by the search.php file, if it’s there. If not, WordPress uses the index.php file instead.

The search results page isn’t a regular page – it’s an archive. If you don’t have WordPress 5.9 installed and you’re not using a block theme, you won’t be able to create or edit a search page like you would any other page. You’ll still have options, though, and we’ll let you know what they are. First, however, we’ll show you how full site editing makes your life just a tad easier by letting you do something as awesome as customizing your WordPress results page using the Site Editor.

How to Customize a WordPress Search Results Page Using the Site Editor

If you have WordPress 5.9 installed and you’ve selected a block theme for your website, you can rely on the Site Editor to give you access to the search results page. With a block theme enabled, head over to Appearance > Editor, and then choose Templates from the Editor menu. The Search template will be among them.

Search Template

After choosing Search for editing, you’ll have access to the full layout of the page. If you’re not sure what you’re looking at and you’re having trouble navigating all the blocks in the main window, you can always open up the List View panel. It’s a great place where you can easily visualize all the elements and their relationships.

List View

The structure of the WordPress search results page, as provided by the 2022 theme, is fairly simple. The header contains the standard identity and navigation information. It is followed by a search bar, which can come in handy when there are no results for the page to display.

The results themselves are displayed using the Query Loop block – an advanced block you’ll have to dabble with if you want to change how the results are displayed on the page. The bottom of the page is reserved for the footer.

Changing the Results Layout

If you want to change how the posts look on your WordPress search results page, you can dive into the Post Template located within the Query Loop block. There, you’ll be able to list the different post elements – title, excerpt, date, featured images – you want to appear as results, and change their position.

Post Template

You can also delete the default template and choose a new one from the Query Patterns list. This might be the quickest and easiest way to change the look of your WordPress search results page.

Patterns

The patterns themselves will have options you can set, too. The one we used in the image above allowed us to include fewer or more columns, for example. You can, of course, add new elements to the page, as well as edit the header and the footer – you’re not restricted to working with results layout alone. That’s the great thing about WordPress 5.9 and block themes.

How to Customize the WordPress Search Results Page Without 5.9

If you’re still not sure about 5.9 and you haven’t found a block theme you’d like to use for your website, you’ll have a couple of different ways to customize or create a brand new search results page for your WordPress website. Keep in mind, however, that none of the methods will be as easy or affordable as using WordPress 5.9 and a block theme.

Using Plugins to Create a Custom Search Results Page

Elementor Website Builder

Most popular page builders offer a visual, what-you-see-is-what-you-get experience. You can still write every page or post on your website in HTML if you wanted to – it’s just that a WYSIWYG drag-and-drop approach is much more accessible to people who don’t have coding knowledge.

Some of the same tools you can use to create regular pages can also be used to create and customize a search results page. They should, however, have a feature that lets you edit templates or theme files. That feature isn’t readily found in free page builders, so you’ll need to invest in a premium page builder to access it.

Elementor, for example, is a very popular page builder that comes in a free and a premium version. To be able to create a custom search results page, you’ll need the Theme Builder feature which is only available with the paid version of Elementor. When you have access to it, however, you’ll see that creating a custom search results page with Elementor isn’t all that different from creating any other page.

Changing the Search Results Page with Code

Search Results php

WordPress has its Theme Editor, too – but it’s not nearly as fancy and visual as Elementor’s. Still, if you know how to code, it will give you everything you need to write yourself a new search results page.

You can find all the theme files you can edit by going to Appearance > Theme Editor. You can look around if you want, but you shouldn’t make any changes unless you know what you’re doing. Even then, you’ll probably want to create a child theme first – it’s much safer and more forgiving of mistakes.

When you’ve created the child theme, you can come back to the Theme Editor and edit its search.php file to customize the search results page. If you can’t find a search.php file, you can create one manually. If you used a plugin to create a child theme, you might also use it to create a copy of your search.php file in the child theme, and then edit it to add, remove, or change elements.

Customizing Search Results with Plugins

Better Search

If either of the two options above seems too daunting to you, don’t worry. Maybe the change you want to create doesn’t necessarily require you to purchase a theme-building plugin or learn how to code. The truth is, many of the plugins you’d use to change WordPress’ native search function might also change either search results or the search results page.

For example, you can exclude certain results from WordPress searches. You can exclude posts and pages using a plugin, or even authors, categories, and tags using snippets of code. There’s no need to change the whole search results page if that’s the only change you want to make.

The Better Search plugin will allow you to choose how the search results are sorted, and which parts of the content – the title or the body – are more important for searching. You can also add Ajax search to your website to allow the visitors to see the results as they’re typing the query. If you want to add a “Did you mean?” type of spelling suggestion, you might try Relevanssi.

Let’s Wrap It Up!

The WordPress search results page is a piece of real estate on your website that has a lot of potential – you can use it for all sorts of purposes, from branding to visitor retention. It’s often overlooked, however, and for a good reason – accessing it and editing it are not very easy, especially for people who are new to WordPress.

Still, if you think it’s time to pay more attention to your WordPress website’s search results page, don’t worry. There’s an option that will allow you to do it no matter what your level of proficiency with coding might be. You can take the easy route with a block theme, or choose between premium plugins for complete overhauls or free plugins for minor tweaks.

Post your comment

Comments0