Building a search page isn’t as straight forward as you’d think. At first a client will want something which users can search content, then they may want to modify the search results or even change the ranking of certain content. Long story short, something you thought would be as simple as enabling a module, ends up taking twice as long.
If you need to create custom search pages in Drupal 7, more often than not, you use Search API or create a search page using Views. But the core Search module for Drupal 8 has become more powerful than in Drupal 7. One of the big changes, for site builders, in Drupal 8 is the ability to create custom search pages.
However, there’re a few limitations to creating a search page. First, it’ll have a prefix of “search/” in front but the full URL can be changed by creating a URL alias. Second, you can only adjust the content ranking on these pages. If you want to index extra fields or remove ones from being indexed, you’ll still need Search API to do this.
In this tutorial, you’ll learn how to create a custom search page and how to modify the search results by overriding a template.
Getting Started
Just make sure you’ve installed Drupal using the Standard installation profile. By using the Standard profile, it’ll automatically install and configure the core Search module.
If you’re using the Minimal profile, then you’ll need to install the Search module manually.
Generating Test Content
It’s useful to have real content indexed while building a search page. If you’re like me, you don’t like to spend too much time creating dummy content only to have it blown away.
So to generate test content, I’ll use the “Devel generate” sub-module which ships with Devel.
Just install the sub-module and then go to Configuration, “Generate content”. Select which content types you want generated and click on Generate.
How to Create a Search Page
1. Go to Configuration, and click on “Search pages” from within the “Search and Metadata” section.
2. Scroll down to the “Search pages” section and from here you can manage the existing pages and create new ones.
3. From the “Search page type” select Content then click on “Add new page”.
4. Enter “Site search” in the Label field and add site to Path.
Then scroll to the bottom and click on “Add search page”.
5. Once you’re back on the “Search pages” page, you can reorder how they’re displayed.
And, you can set the default page by clicking on the down arrow in the “Operations” column.
Index Content
Before we can test the search page make sure the site content has been indexed. If it hasn’t then nothing will appear in the search results.
To check the index status, go to the “Search pages” page, the one we’re previously on and look at the “Indexing progress” section.
If you see “0% of the site has been indexed.”, then make sure you index the site, by running cron. It can be ran manually by going to “admin/config/system/cron” and clicking on “Run cron”.
Once indexed you should see “100% of the site has been indexed.”.
How to Search for Content
To access the search page directly go to /search and you should see all the search pages as tabs. If you’re logged in as an administrator, you’ll see Content, Users and “Site search” (the one we created).
If you’re an anonymous user, by default you won’t see the “Advanced search” field-set and the Users tab. This can be changed by adjusting permissions in Drupal.
So to search for content enter in a keyword into “Enter your keywords” and click search icon.
Permissions
I mentioned in the last section that certain parts of the search page, i.e., “Advanced search” and the Users tab are only accessible if you have permission.
The Search module comes with three permissions: “Administer search”, “Use advanced search” and “Use search”.
Administer search
This permission let’s you access the “Search pages” configuration page.
Use advanced search
This permission allows access to the “Advanced search” field-set.
Use search
This permission is required to access the search. This permission is granted to anonymous and authenticated users when you use the Standard installation profile.
Where is the Permission for Users Tab?
You may have noticed there’s no specific permission for the Users tab. That’s because there is none. Instead, the “View user information” permission from the User module is used to access the tab. This is a bit confusing and I had to look in the code to see which permission is required to access the tab.
So if you want users to search account profiles, give them the “View user information” permission.
How to Modify Search Results
Sometimes you may want to change the markup that’s rendered in the search results. This can be achieved by overriding a specific template. Just copy over the search-result.html.twig file which can be found in the Search module or your base theme.
Summary
The functionality of the search page can very from site to site. Sometimes the out-of-the-box solution is enough other times it’s not. The core Search module should only be used if you’re happy with what it offers. If you need something custom then you’ll need to build your own page using Views (we’ll look at this in the next tutorial) or Search API.
FAQs
Q: Nothing appears when I search for something?
Make sure you’ve indexed the content by running cron.
Q: Anonymous users can’t access the advanced search section?
Assign the Anonymous role the “Use advanced search” permission and they’ll have access to the advanced search form.
Q: Can I change the URL to a search page?
Yes. Just create a URL alias for the search page you want to change.
Hello
I want to display pager in search result page. How can i do it?
Thanks in advanced.
Hiral Vyas
Hi Hiral,
The search page has a pager. It’ll display 10 items per page.
The pager won’t appear if the search results returns fewer than 10 items.
Cheers,
Ivan
Hi,
im trying to display images on the search results..how i i do that? i created a page with views with the URL you wrote but its not displaying any results or display Everything..how i just show images in the core results page?
Thanks
Juan
Hi Juan,
Good question. I think I’ll write a blog post about this. 🙂
You’ll need to write a bit of custom code in
template_preprocess_search_resultand get access to the node object. It’s in the results array and then you’ll get access to the image.Cheers,
Ivan
Hello and thank you.
Is there any Search API Views tutorial for Drupal 8? I cannot seem to find one and the D7 version does not match the new one (and does not seem to work).
Thank you
Hi Tomas,
Sorry, I don’t have any tutorials around the Drupal 8 version of Search API.
Cheers,
Ivan
Hey Ivan..Nice Blog.
I have two questions.
1. How can I edit the size of the search bar?
The link below is for Drupal 7 and below.
https://www.drupal.org/node/154137
2. How do I make the search flexible like google? I see google has the ability to like guess what you are looking for. For example, if there is an article with the title “Lessons I have Learn’t in the Apps Business”,
and you search “What to consider before making an app”, google will bring you in article of apps business. But in this search module, I get no results, despite having an article with the lessons in the site.
Thanks in advance.
Hi Nahashon,
In regards to the first question, it should be same as Drupal 7. Look at this code example, http://cgit.drupalcode.org/custom_search/tree/custom_search.module#n48
Also check out “Custom Search” module, https://www.drupal.org/project/custom_search
Now about creating a flexible search like google. Google uses a lot more signals (SEO, links, traffic, etc…) and applies machine learning. Whereas on a Drupal site you just have the content. And remember they’re expects at search. 🙂
If you’re looking for an advanced search look at Solr or Elasticsearch.
Cheers,
Ivan
I’ve been trawling the web on how to customize a homepage search form to look like google and see what comes up my dear old Ivan of Webwash! Thanks for the tip. I’ll evaluate the custom search module, it looks good enough
Thanks.
Hey Ivan, thank you for sharing your knowledgement.
Can you help me to know how to remove the search formulary from the search page. Since I already have a search in my header, it is being duplicated.
Thanks
Hi Gabriel,
What do you mean by “search formulary”? The search block?
If so, you can control the visibility by editing the block from the blocks layouts page.
Cheers,
Ivan
Hi Ivan,
I am using the core search module available in D8.2… I have two language enabled on my site ‘Fr’ and ‘En’…How can i restrict the search results to list only the results of the current language of the site..I mean if the site is on the ‘FR’ version i want the search results to list only ‘FR’ version only and vice versa…Currently when doing a search, it is displaying both the ‘Fr’ & ‘En’ versions in the result list.
Hello,
I’ve never done this so I can’t give you an answer. But, could you create a view using the search filter and language filter?
Cheers,
Ivan
Hi Ivan,
Thanks for writing a nice article.
Have a question, how can i have search page which only searches within releated entities in a group.?
Hi Jayanth,
When you say “group” what are you referring to?
If the content is accessible it’ll get index, which means it’ll be displayed.
Cheers,
Ivan
Hello Ivan,
I am looking to create a link (in non search page) with parameters to redirect on search page (with facet parameter already clicked).
Have you some idea ?
I try that :
$adapter = facetapi_adapter_load($searcher);
$facet = facetapi_facet_load($facet_name, $searcher);
$href = $adapter->getFacetPath($facet, array($tid), TRUE);
outpul of $href => search/site
I would like $href => search/site?f%5B0%5D=im_field_ref_thematique%3A6216
Thanx
Hi Michael,
Sorry, no idea. Best to ask in the facetapi issue queue.
Cheers,
Ivan
Hello,
I have search solr api installed and configured, along with search api pages. How can I add an advanced search form with AND/OR/NOT operators to search in solr index??
Hello,
If the “search api pages” module doesn’t offer it out-of-the-box, then you’ll need to write code to implement.
Cheers,
Ivan
What is the best search to use?
The default drupal search or Search API?
Thanks
Hi Shan,
If you need a basic search page and you don’t want to customize it then the core Search module will do the trick.
Search API is technically “better” but it requires a lot more configuring.
If you need to implement custom search requirements and you want to use Solr or Elasticsearch then use Search API.
Cheers,
Ivan
thanks for the reply. Do you have any video tutorial in which you have explained that how to configure Search API with Search API Solr Search as a backend?
That will be really helpful.
Thanks
No video tutorials on Search API for Drupal 8.
hello,
i want to do customized design of default search result. how can I do that??
please tell me if there is any tutorial or reference link.
Also Can you please provide any tutorial link for content migration from Json file.
I don’t have any specific links, but I’d start with a simple google search. 🙂
I want to change the search results page H1, list type (from OL to UL), and change the no results message. How do I do that?
Best way to do this is to override the search templates.
https://www.drupal.org/docs/develop/theming-drupal/twig-in-drupal/working-with-twig-templates