{"id":4952,"date":"2022-01-20T15:50:38","date_gmt":"2022-01-20T09:50:38","guid":{"rendered":"https:\/\/betterdocs.co\/?post_type=docs&#038;p=4952"},"modified":"2022-02-17T18:46:12","modified_gmt":"2022-02-17T12:46:12","password":"","slug":"betterdocs-advanced-search-elementor","status":"publish","type":"docs","link":"https:\/\/betterdocs.co\/it\/docs\/betterdocs-advanced-search-elementor\/","title":{"rendered":"How To Configure BetterDocs Advanced Search In Elementor?"},"content":{"rendered":"<p><a href=\"https:\/\/betterdocs.co\/it\/\" target=\"_blank\" rel=\"noopener\"><b>BetterDocs Pro<\/b><\/a><span style=\"font-weight: 400;\"> allows you to make your knowledgebase search panel more advanced with the popular or category-wise searches in Elementor to help your site visitors more. Follow this step by step guideline below to <\/span><b>configure BetterDocs Advanced Search <\/b><span style=\"font-weight: 400;\">in Elementor:<\/span><\/p>\n<p><b><i>Nota: <\/i><\/b><i><span style=\"font-weight: 400;\">If you want to configure this <\/span><\/i><b><i>BetterDocs Doc Search Form<\/i><\/b><i><span style=\"font-weight: 400;\"> advanced search features in Elementor, then make sure you have <\/span><\/i><a href=\"https:\/\/betterdocs.co\/it\/docs\/install-betterdocs-pro\/\" target=\"_blank\" rel=\"noopener\"><b><i>installed and activated<\/i><\/b> <b><i>BetterDocs Pro<\/i><\/b><\/a><i><span style=\"font-weight: 400;\"> on your WordPress site.<\/span><\/i><\/p>\n<h2><b>Step 1: Configure BetterDocs Doc Search Form In Elementor<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">First, navigate to your <\/span><b>Elementor Editor <\/b><span style=\"font-weight: 400;\">and open up your doc page to<\/span> <span style=\"font-weight: 400;\">configure BetterDocs<\/span><b> Modulo di ricerca documenti<\/b><span style=\"font-weight: 400;\">.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Afterward, just look for BetterDocs <\/span><b>\u2018Doc Search Form\u2019<\/b><span style=\"font-weight: 400;\"> element in your Elementor Editor <\/span><b>\u2018Search\u2019<\/b><span style=\"font-weight: 400;\"> panel and <\/span><b>drag &amp; drop <\/b><span style=\"font-weight: 400;\">the element in the <\/span><b>\u2018+\u2019<\/b><span style=\"font-weight: 400;\"> sign section.\u00a0<\/span><\/p>\n<p><b><i>Nota: <\/i><\/b><i><span style=\"font-weight: 400;\">If you want to know in detail about creating a <\/span><\/i><strong><a href=\"https:\/\/betterdocs.co\/it\/docs\/docs-page-with-elementor\/\" target=\"_blank\" rel=\"noopener\"><i>doc page in Elementor with\u00a0 BetterDocs<\/i><\/a><\/strong><i><span style=\"font-weight: 400;\">, just go through the link.\u00a0<\/span><\/i><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Drag-Drop.gif\"><img fetchpriority=\"high\" decoding=\"async\" class=\"alignnone wp-image-4954 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Drag-Drop.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2864\" height=\"1168\" title=\"\"><\/a><\/p>\n<p><span style=\"font-weight: 400;\">From BetterDocs Doc Search Form, you will get three advanced search options<\/span><b> \u2018Enable Category Search\u2019, \u2018Enable Search Button\u2019 <\/b><span style=\"font-weight: 400;\">&amp;<\/span><b> \u2018Enable Popular Search\u2019<\/b><span style=\"font-weight: 400;\">.<\/span><b>\u00a0\u00a0<\/b><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525.png\"><img decoding=\"async\" class=\"alignnone wp-image-4955 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525.png\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2880\" height=\"1506\" title=\"\" srcset=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525.png 2560w, https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525-300x157.png 300w, https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525-1024x535.png 1024w, https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525-768x402.png 768w, https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525-1536x803.png 1536w, https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525-2048x1071.png 2048w, https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/screely-1642654942525-18x9.png 18w\" sizes=\"(max-width: 2880px) 100vw, 2880px\" \/><\/a><\/p>\n<p><b>BetterDocs Enable Category Search<\/b><span style=\"font-weight: 400;\"> option is there to help you add a category-based advanced search in your Knowledgebase in Elementor. This will help you sort documentation with any required keywords with available categories you have created.\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Category-Search.gif\"><img decoding=\"async\" class=\"alignnone wp-image-4956 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Category-Search.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2864\" height=\"1450\" title=\"\"><\/a><\/p>\n<p><span style=\"font-weight: 400;\">Dal <\/span><b>Enable Search Button<\/b><span style=\"font-weight: 400;\">, you can search the knowledgebase and hit the keywords <\/span><b>\u2018Search Button\u2019<\/b><span style=\"font-weight: 400;\"> to get all related results.\u00a0\u00a0\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Search-Button.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4957 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Search-Button.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2864\" height=\"1450\" title=\"\"><\/a><\/p>\n<p><span style=\"font-weight: 400;\">Con <\/span><b>Enable Popular Search<\/b><span style=\"font-weight: 400;\">, you can showcase the most popular keywords on your BetterDocs Advanced Search panel. It can help visitors to go to your most searched documentation right away.\u00a0<\/span><\/p>\n<p><b><i>Nota:<\/i><\/b><i><span style=\"font-weight: 400;\"> This <\/span><\/i><b><i>BetterDocs Popular Search<\/i><\/b><i><span style=\"font-weight: 400;\"> feature is functional for a particular doc when it is <\/span><\/i><b><i>searched a minimum of five times<\/i><\/b><i><span style=\"font-weight: 400;\">. Otherwise, it will not visualize any of your popular search terms in BetterDocs Doc Search Form panel.<\/span><\/i><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Popular-Search.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4958 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Popular-Search.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2856\" height=\"1466\" title=\"\"><\/a><\/p>\n<h2><b>Step 3: Add Style To BetterDocs Advanced Search\u00a0<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">As you have fully configured your BetterDocs Doc Search Form advanced search features in Elementor, you can now <\/span><b>&#039;Stile&#039;<\/b><span style=\"font-weight: 400;\"> your doc search form the way you want.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">BetterDocs Doc Search Form comes with four separate styling options <\/span><b>Search Box<\/b><span style=\"font-weight: 400;\">, <\/span><b>Search Field<\/b><span style=\"font-weight: 400;\">, <\/span><b>Search Result Box<\/b><span style=\"font-weight: 400;\">, <\/span><b>Search Result List<\/b><span style=\"font-weight: 400;\">, and<\/span> <span style=\"font-weight: 400;\">exclusive<\/span><b> Ricerca Avanzata<\/b><span style=\"font-weight: 400;\"> options. <\/span><\/p>\n<h3><b>Search Box<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">A partire dal <strong>Search Box<\/strong>, you can customize your doc search panel <\/span><b>\u2018Background Type\u2019<\/b><span style=\"font-weight: 400;\"> into <\/span><b>\u2018Classic\u2019 <\/b><span style=\"font-weight: 400;\">&amp;<\/span><b> \u2018Gradient\u2019. <\/b><span style=\"font-weight: 400;\">Accordingly make the changes with background color, fonts, add a background image, and others.\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Sytle-1.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4959 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Sytle-1.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2864\" height=\"1554\" title=\"\"><\/a><\/p>\n<h3><b>Others\u00a0<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">A partire dal <\/span><b>Search Field<\/b><span style=\"font-weight: 400;\">, you can change the placeholder, field background, or text color, typography, field padding, margin, and border-radius. You can even change the search icon and close the size and color.\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Style-2.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4960 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Style-2.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2864\" height=\"1554\" title=\"\"><\/a><\/p>\n<p><span style=\"font-weight: 400;\">A partire dal <\/span><b>Search Result Box<\/b><span style=\"font-weight: 400;\">, you can change search results box width, background type with Classic &amp; Gradient. And experiment with color, add a background image, border types, and more in advance.\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Style-3.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4961 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Style-3.gif\" alt=\"BetterDocs Doc Search Form Advanced Search\" width=\"2860\" height=\"1426\" title=\"\"><\/a><\/p>\n<p><span style=\"font-weight: 400;\">From this <\/span><b>Search Result List<\/b><span style=\"font-weight: 400;\">, you can configure the <\/span><b>Normal <\/b><span style=\"font-weight: 400;\">&amp;<\/span><b> Hover <\/b><span style=\"font-weight: 400;\">option. You can customize the<\/span><b> \u2018Normal\u2019<\/b><span style=\"font-weight: 400;\"> search result list typography, item color, border type, padding, doc category, and more.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Moreover, you can change <\/span><b>\u2018Hover\u2019<\/b><span style=\"font-weight: 400;\"> over your doc search result transition speed, item background type, color, border type, count, and more as per your preference.<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Style-4.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4962 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Style-4.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2864\" height=\"1526\" title=\"\"><\/a><\/p>\n<h3><b>Ricerca Avanzata<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">A partire dal<\/span><b> Ricerca Avanzata<\/b><span style=\"font-weight: 400;\">, you can style all BetterDocs Doc Search Form advanced styling options like <\/span><b>category search, search button, <\/b><span style=\"font-weight: 400;\">e<\/span><b> popular search<\/b><span style=\"font-weight: 400;\">.\u00a0<\/span><span style=\"font-weight: 400;\">You can change the doc category typography and font color. Also can style the doc search <\/span><b>typography, font color, background color,<\/b><span style=\"font-weight: 400;\"> hover padding, and more.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Besides, if you want, you can modify the <\/span><b>placeholder content, color, keyword typography<\/b><span style=\"font-weight: 400;\">, background color, hover color, text color, and more in advance.\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Screen-Capture-on-2022-01-19-at-15-26-47.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4963 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Screen-Capture-on-2022-01-19-at-15-26-47.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"2856\" height=\"1506\" title=\"\"><\/a><\/p>\n<h2><b>Esito finale<\/b><\/h2>\n<p><span style=\"font-weight: 400;\">By following the basic steps and a bit more modifying, you can configure your <\/span><b>BetterDocs Advanced Search <\/b><span style=\"font-weight: 400;\">as per your preference in Elementor.\u00a0<\/span><\/p>\n<p><a href=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Untitled-1.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone wp-image-4964 size-full\" src=\"https:\/\/betterdocs.co\/wp-content\/uploads\/2022\/01\/Untitled-1.gif\" alt=\"BetterDocs Advanced Search Elementor\" width=\"1600\" height=\"763\" title=\"\"><\/a><\/p>\n<p><span style=\"font-weight: 400;\">By using <\/span><a href=\"https:\/\/wpdeveloper.com\/plugins\/betterdocs\/\" target=\"_blank\" rel=\"noopener\"><b>BetterDocs Doc Search Form<\/b><\/a><span style=\"font-weight: 400;\">, this is how you can organize an amazing knowledgebase advanced search panel for visitors to improve user experience.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Getting stuck? Feel free to contact our amazing <\/span><a href=\"https:\/\/wpdeveloper.com\/support\/\" target=\"_blank\" rel=\"nofollow noopener\"><b>Team di supporto<\/b><\/a><span style=\"font-weight: 400;\"> for any assistance.<\/span><\/p>","protected":false},"excerpt":{"rendered":"<p>BetterDocs Advanced Search allows you to create an advanced knowledgebase search panel in Elementor and encourage self-servicing more.<\/p>","protected":false},"author":8,"featured_media":4955,"template":"","meta":{"_eb_attr":"","inline_featured_image":false,"_eb_data_table":"","_analytify_skip_tracking":false,"footnotes":""},"doc_category":[309],"doc_tag":[232,231,277,230],"knowledge_base":[282],"class_list":["post-4952","docs","type-docs","status-publish","has-post-thumbnail","hentry","doc_category-configurations","doc_tag-advanced-search","doc_tag-betterdocs-advanced-search","doc_tag-betterdocs-doc-search-form","doc_tag-betterdocs-knowledgebase-gutenberg","knowledge_base-wordpress"],"year_month":"2026-04","word_count":635,"total_views":"7218","reactions":{"happy":"12","normal":"2","sad":"15"},"author_info":{"name":"Afrin","author_nicename":"afrin","author_url":"https:\/\/betterdocs.co\/it\/author\/syeda-sanjida-afrin\/"},"doc_category_info":[{"term_name":"Configurations","term_url":"https:\/\/betterdocs.co\/it\/docs\/shopify\/configurations\/"}],"doc_tag_info":[{"term_name":"Advanced Search","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/advanced-search\/"},{"term_name":"BetterDocs Advanced Search","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/betterdocs-advanced-search\/"},{"term_name":"BetterDocs Doc Search Form","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/betterdocs-doc-search-form\/"},{"term_name":"BetterDocs Knowledgebase Gutenberg","term_url":"https:\/\/betterdocs.co\/it\/docs-tag\/betterdocs-knowledgebase-gutenberg\/"}],"knowledge_base_info":[{"term_name":"WordPress","term_url":"https:\/\/betterdocs.co\/it\/docs\/wordpress\/","term_slug":"wordpress"}],"knowledge_base_slug":["wordpress"],"_links":{"self":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs\/4952","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/users\/8"}],"version-history":[{"count":8,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs\/4952\/revisions"}],"predecessor-version":[{"id":13122,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/docs\/4952\/revisions\/13122"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/media\/4955"}],"wp:attachment":[{"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/media?parent=4952"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/doc_category?post=4952"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/doc_tag?post=4952"},{"taxonomy":"knowledge_base","embeddable":true,"href":"https:\/\/betterdocs.co\/it\/wp-json\/wp\/v2\/knowledge_base?post=4952"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}