Create Search Page Layout Using Elementor

• Go to AE Template -> Add new to create a new AE Template, which will be used for search layout.
• Do the following settings for AE Template.
  • Render Mode: Search Template

  • Enable Canvas: Select this if you want to use the Elementor canvas for the search page.

    

    
    
• Edit it with Elementor
• To display search keyword and result count, you can use the following shortcode with the text editor widget of Elementor.
  • [AE_SEARCH_KEY]: to show search keyword

  • [AE_SEARCH_COUNT]: to show the search result count

    
    

    Sample Use: You have searched for [AE_SEARCH_KEY]

    [AE_SEARCH_COUNT] results found.

    

• For search results, you will have to use AE - Post Blocks Adv widget with the following configuration.

  • In the Layout, section selects the layout style for the post blocks, choose the Skin as Grid, Carousel, or Accordion. 

    

  • Primary Block Layout:  Choose a created Block Layout
  • Do the other configuration settings accordingly.
  • Then, under the Query Section, select Source as Current Archive.

• You won't be able to preview the result part, so temporarily switch the Source in AE - Post Blocks Adv to "Posts." This will show you all posts. 

  Configure the rest of the settings of the Post Blocks Adv widget, and once done, switch back source to "Current Archive."

• DONE!! Now search on your site, and your search page will reflect this design.