How to Create a WordPress Search Results Page? [Ultimate Guide]

A user will not find everything on your website readily. You need a proper WordPress search results page. 

A good search experience is crucial – users want answers fast, without any hassle. An optimized search experience can help visitors find the right solution. This, in return, can improve conversions. 

An improved search experience results in improved conversions. A steady improvement of even 1% in conversion rate improvement is huge! 

The article today will focus on creating the proper WP search results page. The focus will be on creating the perfect search results page in WordPress using 3 methods: 

  1. Using the default WordPress theme
  2. Using a WordPress plugin 
  3. Using custom code in WordPress

But first, let’s dive a bit deeper into the necessity of the WordPress search page.

Key Takeaways

  • A proper search results page is super important for users to navigate to the right solution – a solution they’ve been searching on the web
  • There are several ways to create a search results page like using the default theme, a plugin, or custom code
  • Using the default block theme and the PostX plugin (showed in this tutorial) are the recommended ways
  • Using custom code in 2025 to solve a problem isn’t really worth it

WordPress Search Results Page [The Use Case]

What does a user do when they don’t find something on your website? They perform a search. 

And the experience of this search needs to be precise. There are 3 things to note here: 

1. Share Relevant Results

    The search results page on your WordPress site needs to be accurate. Failure to do so will result in a rise in bounce rates. 

    The search must yield relevant results. It must not provide bulk, irrelevant results. The user mustn’t feel overwhelmed. 

    2. The Ability to Handle Typos 

      The search results page should be able to handle ‘faulty’ queries. If a visitor makes a typo – the search results should at least be ‘close’ to what the visitor is searching for on your site. 

      3. Control the Search Page Appearance

        You need to create the right appearance for the WordPress search results page. It should align with your brand identity. 

        This works as an indirect ‘brand’ promotion. It’s not so noticeable, but it keeps the consistency throughout your website alive. 

        Essentially, the bottom line is: 

        ‘Make the user experience as easy as you possibly can’. 

        If you can do so, then: 

        • Navigating the user becomes easy for the user 
        • User retention time increases 
        • The bounce rate of your site goes down
        • Your site receives an SEO boost

        Now you know what a search results page can do for your site. It’s time to start creating!

        Customizing WordPress Search Results Page [Ways to Do It]

        As mentioned earlier, you can create a WordPress search results page in 3 ways. You can use any of these ways – depending on how you want to create the search results page.

        Creating a WP Search Results Page [Using the Default Theme]

        At the time of creating this content, WordPress comes with the latest 2025 WordPress theme.  

        I’m assuming that you already have the latest version of WordPress installed on your host (and of course you’re using the 2025 theme that comes with the default installation). If you want to test it out on a local host, you may want to check out the guide here

        The Twenty Twenty-Five WordPress Theme was released with WordPress version 6.7. You can learn more about it here. There are a bunch of new things including the new 2025 theme, bug fixes, security patches, and more. 

        Now before we begin, the first thing you need to know is: 

        The 2025 theme is a block-based theme. So WordPress has these blocks that sort of work like Legos. You use these Legos to create your website. 

        You have templates and template parts; the idea here is to create page templates using the template parts. 
        If you want to learn more about it, check it out here. For now, let’s get back to creating a proper search results page for WordPress using the default theme.

        If you’re on an older version of WordPress, I just want to say that you should definitely update to the latest version. Otherwise, you’re essentially compromising your site’s security by missing out on the latest updates.

        Step 1: Go to the Theme Editor

        You need to go to Appearance > Editor from your WordPress Dashboard. Here, you’ll see the options for page templates, navigation, styles, etc.

        Go to the Theme Editor in WordPress
        Go to the Theme Editor in WordPress

        Step 2: Go to the Search Template 

        The next step is to go to the ‘templates’ section. Here you’ll find the different page templates. There are some dedicated templates for the twenty twenty-five theme as well. 

        Go to the WordPress Search Results Page Template
        Go to the WordPress Search Results Page Template

        You should find the search template here. Click on it and it will take you to the editor page. 

        Step 3: Choose a Premade Design

        You’re now on the search results template editor page. Here, you can choose the individual ‘template parts’ and create the search page – just the way you want. 

        Editing the Search Page Template
        Editing the Search Page Template

        There are some pre-made search templates ready to use. Just choose the one you like – as I did with this tutorial. 

        Step 4: Save the Template

        The final step is to save the template. 

        In Summary, to create a custom search results page with the default WordPress theme, you need to: 

        1. Go to the theme editor
        2. Find the ‘Search Template’ in the Templates Section
        3. Choose a pre-made template design and ready the page
        4. Save and publish the template

        How to Change Search Results Page in WordPress [Using a Plugin] 

        There are plenty of plugins you can use. But I want to use the PostX plugin for a couple of reasons: 

        • You can create your search page from scratch 
        • You can use a pre-made search template 
        • Easily customize every part of the template
        • Access to a lot more functional features

        The issue with themes like the 2025 WordPress theme or other block-based themes is the flexibility. PostX offers exactly that – allowing you to customize your website with a wide array of Gutenberg-friendly blocks, pre-made templates, built-in features, and more. 

        So, how do you create a custom WP search results page with PostX? Here’s the solution. 

        Please note you need the PostX plugin installed on your WordPress site. To install and activate the plugin, follow this link

        How to Customize Search Results Page in WordPress Using Pre-made Templates 

        PostX has plenty of pre-made templates to create a custom search results page. Here’s what you need to do to create a custom WordPress search results page using PostX: 

        Go to the PostX Builder

        PostX has 2 things – a dedicated site builder and starter site templates. I’ll be using the site builder to create a search results page using one of the pre-made templates. 

        Go to the Search Results Section 

        From the PostX builder, you want to navigate to the ‘Search Results’ section. Here you’ll find 2 options: 

        Creating a WordPress Search Results Page with PostX
        Creating a WordPress Search Results Page with PostX
        • You can create the page template from scratch (more on that later) 
        • Use a pre-made search page template 

        I’m going to select a pre-made template here. 

        Import and Customize the Template 

        If you click on ‘Import’, it takes you to the template editor page. 

        The first thing you’ll see here is the conditions window. Here, you’ll be able to select (or deselect) where the template appears. 

        At this point, you can make small customizations to the template. It’s all up to you – PostX has all the necessary blocks and features.

        How to Create a WordPress Search Results Page? [Ultimate Guide]

        You can change the appearance of the WordPress search field, add new grid blocks, and more. 

        Publish the WP Search Template

        Once you’re happy with the changes, you can simply publish the template. 

        In essence, you need to do the following to create a search results page in WordPress: 

        1. Go to the PostX Site Builder 
        2. Go to the ‘Search Results’ section in the builder 
        3. Choose a pre-made template and import it 
        4. Make changes to the template 
        5. Save/Publish the template

          Create and Customize the WordPress Search Results Page from Scratch

          You know how to create a WP search results page with a custom PostX search template. 

          You can also create it from scratch – the process is similar: 

          1. Go to the ‘Search Results’ section of the site builder 
          2. Select ‘Start from Scratch’ 
          3. Set the page conditions
          4. Use PostX blocks to create your search page template
          5. Save/Publish the search results template

            That’s all there is to it. 

            Use Custom Code to Create a Custom WordPress Search Result Page

            I can’t really recommend this process in 2025. You have excellent WordPress plugins (even some really good themes) that can help you with it. If you’re trying to keep the load on your site minimal, then you should consider it. Otherwise, going with the built-in theme options or a plugin is your best bet. 

            Here are the things you need to do: 

            • Create a ‘search.php’ file in the theme directory
            • Create a ‘style.css’ file 
            • Add translation strings 
            • Test the page

            Custom Code for the ‘search.php’ file

            Here’s the custom code for the search.php file: 

            <?php
            // Include the header
            get_header();
            ?>
            
            <div class="search-results-container">
                <header class="page-header">
                    <h1 class="page-title">
                        <?php 
                        printf(
                            esc_html__('Search Results for: %s', 'your-theme-textdomain'),
                            '<span>' . get_search_query() . '</span>'
                        ); 
                        ?>
                    </h1>
                </header>
            
                <div class="search-results-content">
                    <?php if (have_posts()) : ?>
                        <div class="search-results-list">
                            <?php while (have_posts()) : the_post(); ?>
                                <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                                    <h2 class="entry-title">
                                        <a href="<?php the_permalink(); ?>" rel="bookmark"><?php the_title(); ?></a>
                                    </h2>
                                    <div class="entry-excerpt">
                                        <?php the_excerpt(); ?>
                                    </div>
                                </article>
                            <?php endwhile; ?>
                        </div>
            
                        <div class="pagination">
                            <?php 
                            the_posts_pagination(array(
                                'mid_size'  => 2,
                                'prev_text' => __('&larr; Previous', 'your-theme-textdomain'),
                                'next_text' => __('Next &rarr;', 'your-theme-textdomain'),
                            ));
                            ?>
                        </div>
                    <?php else : ?>
                        <div class="no-results">
                            <h2><?php esc_html_e('No results found', 'your-theme-textdomain'); ?></h2>
                            <p><?php esc_html_e('Try searching with different keywords.', 'your-theme-textdomain'); ?></p>
                            <?php get_search_form(); ?>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
            
            <?php
            // Include the footer
            get_footer();
            ?>

            Custom Code for the ‘style.css’ File

            Here’s the style code for the custom WP search results page:

            .search-results-container {
                margin: 0 auto;
                max-width: 800px;
                padding: 20px;
            }
            
            .page-title {
                font-size: 2rem;
                margin-bottom: 20px;
            }
            
            .search-results-list article {
                margin-bottom: 30px;
            }
            
            .entry-title a {
                color: #0073aa;
                text-decoration: none;
            }
            
            .entry-title a:hover {
                text-decoration: underline;
            }
            
            .pagination {
                display: flex;
                justify-content: center;
                margin-top: 20px;
            }
            
            .no-results {
                text-align: center;
            }

            FAQ

            You may want to know answers to the following questions.

            How to customize the search results page in WordPress? 

            There are patterns for the search results page with block-based themes, especially the 2025 WordPress theme. But if you want more functionality, then you should certainly use a plugin like PostX. 

            How do I create a custom search results page in WordPress? 

            As mentioned before, there are 3 ways you can do it: using a plugin, using internal theme settings, and using custom code. Using a plugin is the best way to do so. But you can certainly use the other 2 options as well. 

            How do I display featured images on search results in WordPress? 

            You can use one of the PostX blocks (post grid, post list, etc.) to show featured images on search results in WordPress. You can also change the appearance of the featured images as well. 

            How do I change the search bar style? 

            If you’re using the basic 2025 WordPress theme, then there are some settings to change the appearance – you can change the colors, border radius, and such. You’ll get similar settings with the PostX search bar settings. However, the PostX search block settings are a lot more comprehensive than the theme. 

            Wrapping Up 

            That’s all for now. 

            There’s actually a lot more to creating the perfect WordPress search results page. So, if you have questions, sound off in the comments below. 

            We’d love to hear from you. 

            Like this article? Spread the word
            Sadik Ahmed

            Written bySadik Ahmed

            My casual writing career took its turn in the technical space 5 years back. Since then, I’ve been working in the WordPress industry (not limited to WordPress themes and plugins of course😉). My writing career spans 8 long years - mostly helping newcomers, professionals, and enthusiasts work on interesting WordPress themes, plugins, and other digital products.

            2 Comments

            1. David McCreary

              David McCreary

              January 28, 2023

              Image above shows Elementor Add Ons turned on as well as the PostX Dynamic builder. I assume from this that there would be no conflict with using the Dynamic builder alongside Kadence Theme with Kadence Blocks Pro?

              I’m using Cloudways server built in Elastic Search and the ElasticPress plugin, but those just work in conjunction with output from a normal wordpress search widget placement… will this Builder work with those as well?

              • Ruhul

                Ruhul

                January 29, 2023

                Hi there,
                Yes, our Elementor addon works pretty well with Elementor, and there won’t be any conflict with Kadence too. When you are using our PostX with Kadence Elements, our saved template will be the better option rather than using our blocks directly.

                For the time being, we are working on an advanced search functionality which will be coming very soon. It will be implemented inside our builder once the development is done, so you need to wait a bit.

                Have a nice day!

            Leave a Reply

            Your email address will not be published. Required fields are marked *