{"id":6187,"date":"2022-10-12T14:26:05","date_gmt":"2022-10-12T11:26:05","guid":{"rendered":"https:\/\/creativethemes.com\/blocksy\/?post_type=documentation&#038;p=6187"},"modified":"2024-01-09T17:20:50","modified_gmt":"2024-01-09T15:20:50","slug":"search","status":"publish","type":"documentation","link":"https:\/\/creativethemes.com\/blocksy\/docs\/header-elements\/search\/","title":{"rendered":"Search"},"content":{"rendered":"\n<figure data-wp-context=\"{&quot;imageId&quot;:&quot;69eb9d364c3ca&quot;}\" data-wp-interactive=\"core\/image\" data-wp-key=\"69eb9d364c3ca\" class=\"wp-block-image size-full has-lightbox wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2022\/10\/Screenshot-2022-10-12-at-14.49.50.png\" alt=\"\" class=\"wp-image-6190\" \/><button\n\t\t\tclass=\"lightbox-trigger\"\n\t\t\ttype=\"button\"\n\t\t\taria-haspopup=\"dialog\"\n\t\t\taria-label=\"Enlarge\"\n\t\t\tdata-wp-init=\"callbacks.initTriggerButton\"\n\t\t\tdata-wp-on--click=\"actions.showLightbox\"\n\t\t\tdata-wp-style--right=\"state.imageButtonRight\"\n\t\t\tdata-wp-style--top=\"state.imageButtonTop\"\n\t\t>\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewBox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\" \/>\n\t\t\t<\/svg>\n\t\t<\/button><figcaption class=\"wp-element-caption\">Search element in action.<\/figcaption><\/figure>\n\n\n\n<p>The Search header element will let your visitors easily discover the content that&#8217;s been published on your website. Be them blog posts, pages, products and more &#8212; everything is just a search away!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Granular Controls<\/h2>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:33.33%\">\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" src=\"https:\/\/creativethemes.com\/blocksy\/wp-content\/uploads\/2022\/10\/Screenshot-2022-10-12-at-14.50.28.png\" alt=\"\" class=\"wp-image-6194\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:66.66%\">\n<h5 class=\"wp-block-heading\">Icon Controls<\/h5>\n\n\n\n<p>Since the <strong>Search<\/strong> element is represented by a single icon inside the header, this section will let you control how that icon looks like.<\/p>\n\n\n\n<p>The first option will let you pick the icon that you want. <strong>Blocksy Pro<\/strong> users have the ability to upload their very own custom, SVG icon.<\/p>\n\n\n\n<p>The <strong>Icon Size<\/strong> option will of course, let you select the size of the icon. This can also be changed independently of the device.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Label Visibility<\/h5>\n\n\n\n<p>This option lets you show the&nbsp;<strong>text label<\/strong>&nbsp;of the element on a per device basis.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Search Results<\/h3>\n\n\n\n<p>Since the search overlay does provide live results as you type, this section will let you control that behaviour. Let&#8217;s note down what options are available.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Placeholder Text<\/h5>\n\n\n\n<p>The search form has some placeholder text, to signal users where they need to type in their query. You can modify that placeholder text right here.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Live Results Images<\/h5>\n\n\n\n<p>As you type, results will be shown up dynamically. This option will let you control if you want to show the featured image for each result that&#8217;s part of the search query.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Live Results Product Price<\/h5>\n\n\n\n<p>If your website is mainly an online shop, you might want to turn on this option. This will show up the price in the live results window, letting your visitors make quick decisions on what they might want to purchase.<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Search Through Criteria<\/h5>\n\n\n\n<p>This is probably the most important option for the search element. It will let you decide what items will be searched when the user performs their query. As you populate your WordPress installation with plugins that might offer CPTs, they will also show up here.<\/p>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>The Search header element will let your visitors easily discover the content that&#8217;s been published on your website. Be them blog posts, pages, products and more &#8212; everything is just a search away! Granular Controls Icon Controls Since the Search element is represented by a single icon inside the header, this section will let you [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":6203,"comment_status":"open","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"doc_categories":[124],"class_list":["post-6187","documentation","type-documentation","status-publish","has-post-thumbnail","hentry","doc_categories-header-elements"],"blocksy_meta":{"styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":6}},"acf":[],"_links":{"self":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/6187","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation"}],"about":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/types\/documentation"}],"author":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/comments?post=6187"}],"version-history":[{"count":1,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/6187\/revisions"}],"predecessor-version":[{"id":9148,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/documentation\/6187\/revisions\/9148"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/media\/6203"}],"wp:attachment":[{"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/media?parent=6187"}],"wp:term":[{"taxonomy":"doc_categories","embeddable":true,"href":"https:\/\/creativethemes.com\/blocksy\/wp-json\/wp\/v2\/doc_categories?post=6187"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}