WordPress Search Theme Tutorial

WordPress Search Theme Tutorial

FavoriteLoadingAdd to favorites

In this lesson we learn how to add a search form to our theme’s header, and also how to control the output for the relevant search results screen. Check out my “Get a Developer Job” course: https://www.udemy.com/git-a-web-developer-job-mastering-the-modern-workflow/?couponCode=YOUTUBE-HALF-OFF

To view a complete list of the WordPress lessons in sequential order visit:

Link to download .zip of theme files as shown in this video (note: this is not a “complete” WordPress theme yet and this download is only intended for educational purposes to dissect and review):

Want to share the WordPress website that you’ve been creating on your computer with the world? Learn about the web host I use and how you can get a domain + hosting for $4.95 a month ($60 savings): http://learnwebcode.com/web-hosting/

Sign up for my newsletter to receive periodic webDev tips, tricks, resources and coupons. Join the list at http://learnwebcode.com/

Follow LearnWebCode on Twitter for resources and updates:


  1. omgapotatoe April 27, 2017 at 12:56 am - Reply

    My search returns post titles just fine but when searching for categories, it returns nothing.


    EDIT: Oops I thought that you were finding the posts by category and not title. Nevermind everything works.

  2. Milan Jalic April 27, 2017 at 12:58 am - Reply

    thanks for everything but seriously dude hiding an element with left: -9999px? how about display: none? don’t show people things that could mess them up… Great course by the way 🙂

  3. Kelvin Bernardino April 27, 2017 at 1:01 am - Reply

    Great Job Man, awesome tutorials!!! Thank you very much!!!

  4. kaleem ullah April 27, 2017 at 1:02 am - Reply

    fantastic tutorial

  5. Jahangir Alam April 27, 2017 at 1:03 am - Reply

    tutorial is very best
    anything i write 100% same to you but it shows error php error

  6. Aniruddha Roy April 27, 2017 at 1:06 am - Reply

    You are awesome man,I have learned wordpress theme functionality from this valuable tutorial,awesome man………………………

  7. Helios ing April 27, 2017 at 1:08 am - Reply

    @LearnWebCode 3:30 Why can’t we simply make label element to Display : none and add aria-* attribute for accessibility reasons ..???

  8. عبدالعزيز موسى April 27, 2017 at 1:11 am - Reply

    Please add more lessons
    Thanks very much

  9. sayed akbarali April 27, 2017 at 1:11 am - Reply

    Thank you so much for enhancing my wp knowledge

  10. Isuru Fernando April 27, 2017 at 1:14 am - Reply

    Thank you again for the useful videos! I am following your WordPress lessons, although I am a SAP consultant and new to web development they are very clear and easy to understand. Keep up the good work.

  11. Its-me92 April 27, 2017 at 1:15 am - Reply

    Great tutorial! You have learnt me a lot! Thank you!
    I have a question. In HTML5 specification it is said to use "article", "section" etc instead of the "div" element. Isnt it wrong to use only "div" elements?

  12. Wasim Dar April 27, 2017 at 1:16 am - Reply

    Hi There, i am facing one issue regarding CSS, it’s seem it is not communicating with anything i have to wait at least 10 hours to see the actual change, can u suggest some please?

  13. EGY Kurniawan Setyo April 27, 2017 at 1:17 am - Reply

    This is amazing, you have great ability to teach complicated things became simple. Love your tutorial.

  14. Mr Hassan Javed April 27, 2017 at 1:19 am - Reply

    and can you make a video for make own Widget for featured posts or for any part we can add as in mind ? will wait for your reply thanks.

  15. Mr Hassan Javed April 27, 2017 at 1:20 am - Reply

    if we want search results by tags, which query will be used?

  16. Luly Gooch April 27, 2017 at 1:20 am - Reply

    Can someone answer my question. So basically he’s teaching us how to make your theme for WordPress?

  17. metalicarock April 27, 2017 at 1:21 am - Reply

    thank you so much for all your uploads, it really helps me a lot

  18. jellycoding April 27, 2017 at 1:21 am - Reply

    Well, when I search for a category that I have on a post I get no results. I have tried with different categories but without any luck.

  19. Justin Munce April 27, 2017 at 1:22 am - Reply

    Could you please show us how to, when no results are available, show "No results found. Search again? [__search box__] ?

    Thanks for the tutorials (again). I have watched these dozens of times over the past half year of learning code.

  20. Harpreet Singh Saini April 27, 2017 at 1:25 am - Reply

    I am not able to search by category or tag name. I have assigned the post to categories in the admin panel. Is their any thing else I need to do to enable category or tag search from search input box?

  21. Sammy Youm April 27, 2017 at 1:31 am - Reply

    oh fuck… this guy is a coder and developer… i copied a bunch of videos only to find out that this stuff is way over my head 🙂 well, back to the drawing board.

  22. adasand21 April 27, 2017 at 1:31 am - Reply

    Hi you are doing some great work! Can you please give some pointers on this. I have a database with certain information, I need to run certain querys based on user input and display the data. I tried to do it in the traditional way, by doing < form action="formprocess.php"…> but when I load get_header() in formprocess.php it gives me a fatal error.

  23. Subba Pdm April 27, 2017 at 1:31 am - Reply

    You are the perfect ,, How easily i could learn… Thank you soo much .. i expect further more useful tutorial of wordpress.

  24. vandy vicario April 27, 2017 at 1:31 am - Reply

    nice tutorial sir, one question. how to create a pagination for search result page?

  25. zin moe April 27, 2017 at 1:32 am - Reply

    Hello LearnWebCode!
    Your tutorials are very helpful for me and
    I very appreciate.
    I have one question about my stylesheet doesn’t work with the correct code .
    Can you show me why and how to fix it.
    Thank you very much.

  26. Miroslav Jiriste April 27, 2017 at 1:34 am - Reply

    Best WordPress tutorials I’ve ever seen. Thanks a lot!

  27. ZyncInteractive April 27, 2017 at 1:34 am - Reply

    Brilliant tutorial. Thank you!

  28. John Meas April 27, 2017 at 1:34 am - Reply

    Great series!

  29. Prasad Chintala April 27, 2017 at 1:35 am - Reply

    I think, You are the Master of not only Web Development but also web Designing. Thanks lot.

  30. Samiron Barai April 27, 2017 at 1:36 am - Reply


  31. nathonas April 27, 2017 at 1:36 am - Reply

    Maybe somebody can answer this – is there any reason why you use div.hd-search to target the search bar, instead of just .hd-search?

  32. antikiller497 April 27, 2017 at 1:37 am - Reply

    Help me out here ,when i search any post whole layout just messed up floated to right ,
    and Nice work man !

  33. Hassan Cherry April 27, 2017 at 1:41 am - Reply

    Nice video 🙂 learning a lot 🙂 Waiting for the nest video 🙂

  34. A Cat April 27, 2017 at 1:42 am - Reply

    I suppose I can find all this info in the wordpress documentation?

  35. Moriell Pangahin April 27, 2017 at 1:43 am - Reply

    how to put placeholder in search form?

  36. skizzo muppet April 27, 2017 at 1:45 am - Reply

    one question though : for the div.hd-search label , why tou did not want to use the display:none; ? it would have affected the accesibility ?

  37. poloacustic1 April 27, 2017 at 1:48 am - Reply

    Hi great video, just wondering how to improve the search function of wordpress, since it just evaluates titles and content in posts, i want to add it categories, author, dates.

  38. skizzo muppet April 27, 2017 at 1:48 am - Reply

    Another GREAT lesson!!!

  39. Nick Wilson April 27, 2017 at 1:50 am - Reply

    Question, at 0:55 seconds roughly you’re doing something to create a open div, comment, and close div with comment at the same time. How ?

  40. Piotr Wasilewski April 27, 2017 at 1:51 am - Reply

    Well done

  41. Andrei April 27, 2017 at 1:51 am - Reply

    two more to finish the playlist. These videos were really helpful, thanks for your effort

Leave A Comment