How to create custom search results and categories archive pages?

Hi Ravi,

You seem forgot to link the site.
Can you link it again?

just shared the link this time...

Hi Raul Dixit,

Yes, you can also set Content templates for the Search results page and Post Category archives through the Display Rules as such:

https://share.getcloudapp.com/12u0nvx4

Hope this answers you inquiry. Kindly let us know if you’ll need further assistance with regards to this. :)

Can you please guide me a bit more, because I tried to add but it is not working?

I have added the post grid but latest posts are showing the search results pages also. Can you please guide me a bit more...

Thanks

Here is a screen recording of what I see from my end: https://share.getcloudapp.com/kpu4q8x1

Also see: https://share.getcloudapp.com/jkumwXbD

Specifically, I can see that the Search page already has a similar template to your front page.

Perhaps you’re referring to a different issue? May you kindly provide a screenshot of what you’re seeing from your end, and what you want to achieve?

https://docs.generatepress.com/article/using-the-premium-support-forum/#uploading-screenshots

Moreover, to rule out caching issues, can you also try clearing your cache?

Hope to hear from you soon. :)

You are seeing the search result page template which I created using the Elementor but the same I want to create with GeneratePress elements, can this be done?

I want to remove the elementor template and keep using the elements for search results pages and category, can you show me how I can create search results with elements?

I see. If that’s the case, to create a Content Template, here is a video by Leo which you can refer to: https://generatepress.com/forums/topic/how-to-create-custom-search-results-and-categories-archive-pages/#post-2127257

Also see: https://docs.generatepress.com/article/block-element-content-template/

Also see: https://share.getcloudapp.com/7Kuq5kxe

Hope this helps! :)

In the given video, Leo is showing how to create a custom content template but my query is different from what was shared in the video. I want to have a custom template for search results and categories archive using Elements.

I want to show the exact same designed post grid on search results and category archive too (https://prnt.sc/b44nBetAwG8O) the current grid layout was created by Elementor but I want to remove the Elementor and use the GP Elements there.

Can you please show me if I am not understanding it correctly?

Hi there,

lets assume you remove Elementor. You know have just the templates from the GP Theme.

**If you create a Block Element - Content Template, and you set the Display Rules to: All Archives then this will apply to all Post archives, including Categories. For Search Results you will need to add a Location of: Search Results.

Okay, I got this but I am not able to understand how can I use the Content Template to give a better grid view to my archive posts page, I will be glad if you can guide me a bit about that...

First off note my erratum above. You have to add Search Results to a Display Location in the Element.

There are two parts:

1. You set the Columns options in Customizer > Layout > Blog. This defines the grid.
2. You then design the individual post 'card' in the Block Element - Content Template which is covered in the doc that Fernando provided:

https://docs.generatepress.com/article/block-element-content-template/

Its a visual builder so creating that design should be easy, and the block element comes with some Templates to get you started:

https://www.screencast.com/t/XuiJFhAMj2a

Thanks for guiding, it worked, I have created a similar archive page. See here https://prnt.sc/x9cElBE9cGmD

but there are a few tweaks still needed like I want to make the page(search result) contained, it is still full width. Also, minimize the horizontal gap between the post grids.

It would be amazing if I could give the box a bit of shadow and hover image like this https://prnt.sc/q5OzGyWsxyBn

Also, the pagination is not showing good https://prnt.sc/CLDPKxUfSem-

Link of the homepage added in the private information field.

Thanks in advance.

Edit the Block Element , and select the Parent Container Block, and in Advanced > Additional CSS Class(es) add a custom CSS class eg. search-content-template or something relevant.

Once thats done let me know where i can see it

I have already tried it by adding the custom CSS but it is taking the white space also, check out this https://prnt.sc/UWXcCYmdFv2S

I custom CSS class is archive-template, I tried merging it with existing CSS I added for the homepage post grid.