Third party cookies may be stored when visiting this site. Please see the cookie information.

PenguinTutor YouTube Channel

Adding search capability to Wordpress web site

I've converted WatkissOnline web site to be completely generated by wordpress. One of the benefits of this is that it means that the Wordpress built in search function can be used to search the entire site and not just the blog as it was before.

There are a few things that needed to be done to integrate this into the site properly which I've listed below.

Add search bar to header.php file

I added the search bar to the header.php file within the theme so that it appears on every page rather than having it on a search page.

The html code used is shown below:


<form method="get" id="searchform2" action="/wordpress/index.php">
<div style="float:right;position:relative;top:100px;margin-right:20px;">
<input style="width:150px;" value="" name="s" id="s" type="text"><br />
<input style="position:relative;right:-80px;width:80px;" id="searchsubmit" value="Search" type="submit">
</div>
</form>

This was placed into a division that is floated to the right hand side of the header section.

Disable search bar in search.php

I removed the text in searchform.php. This places a search button on the top of the blog sidebar which is no longer required.

Added Excerpt Editor to add excerpt for dynamic pages

Some of the pages on my website are dynamically generated by embedding PHP code within the pages [Exex-PHP plug-in required to enable PHP code]. If these pages are included in the search results then it may result in ugly php code being shown in the summary text. This can be overcome by adding excerpt text to the relevant pages or posts.

In the case of posts then it can be easily added on the edit post page, but excerpts are not included in the page editor. I added the Excerpt editor plug-in, which provides a way to add excerpt text to pages.

Unfortunately the text within the excerpt does not appear to be searched from the search bar, but at least it doesn't give the ugly code view. I tend to include a blog post when I add a dynamic site (eg. photo gallery) so the blog post often comes up in the search results anyway.

Excluding certain pages from the search

Another thing that I have done is to include the error / status messages as pages within Wordpress. This includes the 404 file not file page, email ok confirmation page and the Legal and Site Information page.

Of course I don't want a 404 error page to display when searching so I used the Simply exclude plugin to disable these.

Firefox Search Bar

I also provided a means of adding the search function for the site to the Firefox search bar. I had done this before, but it was called "blog search" whereas now it is a full search of the Watkissonline site, so I did a little tweaking there.

How to add search engine to the Firefox search bar

The search engine code is included within the header, so it is embedded within every page of the site.