Skip Navigation

[Closed] Integrate search form via shortcode into Divi?

This support ticket is created 3 years, 8 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 8:00 – 12:00 - -
13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 13:00 – 17:00 - -

Supporter timezone: America/New_York (GMT-04:00)

Tagged: 

This topic contains 3 replies, has 2 voices.

Last updated by Christian Cox 3 years, 8 months ago.

Assisted by: Christian Cox.

Author
Posts
#1693025
Bildschirmfoto 2020-07-09 um 16.23.57.png

Hey there,

I am wondering if it is possible to create a custom search form with search results and include that via shortcode into a page / template with Divi?

Otherwise I would need to create a custom sidebar with two images with the Toolset Builder?

What I want to achieve is a page like you can see in the screenshot. And I already created a template with Divi for that, but for archives without search form and it would be easier to just duplicate that and insert the search form via shortcode.

Thanks for your help!

#1693341

Hello, yes you can use shortcodes to do this. The classic Views experience used shortcodes exclusively, and they are still available in Blocks, but hidden by default. You must activate the legacy Views interface to create a standalone View. Go to Toolset > Settings > General tab and find the Editing Experience section. Activate the legacy editor here, or choose to activate both editors so you can toggle between Blocks and legacy builders.

Then you will find a menu item called Views in the main Toolset menu. You can create a standalone View here outside of the blocks editor. You may use the Blocks Editor to design the loop template if you'd like, or use the classic shortcode approach that requires more HTML knowledge. Once you are finished creating the View, you can insert it in a standard text block in the Divi Editor using the following syntax:

[wpv-view name="your-view-slug"]

Replace your-view-slug with the slug of the View (you will see the slug in the View editor at the top of the screen when you create the View). This shortcode will insert both the filters and the results together.

Let me know if you have questions about this.

#1714153

I am feeling totally overwhelmed. I think I managed to setup a view, but then I am not sure if I need to setup filters, when I want the user to have a field to choose the category and the radius around a specific address. I am not able to setup a dropdown field so the user can choose the category.

I inserted the shortcode for this archive: hidden link

In addition to that, I am not finding a way to design the loop. I clicked on "Edit with Block Editor" and I am ending up in a WordPress Gutenberg Editor with two shortcodes in it. But I cant figure out how I can design the loop and how to setup which custom fields should be shown.

Is there a good tutorial for this way to work with Divi?

#1715131

I think I managed to setup a view, but then I am not sure if I need to setup filters, when I want the user to have a field to choose the category and the radius around a specific address
To create front-end search filters for category and distance, you must be sure the Search and Pagination panel is visible. That is where you will create your front-end filters. If you cannot see it, scroll to the top right corner of the View editor screen and click Screen Options to activate that panel. If you already added Query Filters, you should probably remove anything you created in that section. The system will generate Query Filters for you automatically based on the front-end filters you create in the Search and Pagination panel. When you click "New Filter" above the Search and Pagination panel, you can choose "distance" to create a distance-based search.

In addition to that, I am not finding a way to design the loop.
Click "Loop wizard" above the Loop Editor panel of the View editor screen to select a loop format (grid, table, list, etc). Then when you click "Edit with Block Editor you will design one iteration of that loop, and the system will automatically create the rest of the design structure for you. Drag into the Block Editor different blocks to display custom fields, like a Single Field block or a Fields and Text block. If this isn't clear, please take a screenshot of what you see in the Block Editor and I'll try to guide you.

The topic ‘[Closed] Integrate search form via shortcode into Divi?’ is closed to new replies.