Suggestions as badges
View code f84ce51f5fc4dd28b78160bc3f785bae38a879b49c57d111496363df49ecd08757b4482f3ae6cf0f6d171f94f1e25d28876eb18241706aa863a037d5b6ff44fb8d110236b14da1b26f2d231d9f228ccc7b20d4a5041414aacbd9b89bcabf7cbba3239a9ae3c5d5a29d4501affe32f243c99cab62af1dcf94e69c4579d9d00c5f8485a90e4d691a5df63fd43fb7210f2cd77d39941f4866ffa76669ca718422d855809bf7e0768eb1fb97b85c1228ce961e49dd6d3787d1cbc83d969b5ac8a119328c71a83507efe667201162b0856450075ef8d4f48a5655b38952dc30dfd1452337f2491627b0803ca562ac1122c40c2531f215cce2fbd8248a907d3101813811d79393b6c88208c9e8ec128d9afb8ee08e693a0080699ba3e2f65e005bfcc6bb597a2988ff0711c06ac24d441d1686b2f02367a9857f608bdee4ae6c2cb7677042b154da3c4b03830bc5e13750bdb672b5edb0ffbb98ab48d290ddd1521a15be2f20b02dfb89ce4a92f2746ac04995fbad1b0e8ce375fd88421f1ff45a2ee6d586d0a339c913defa4dd897fa2787566dbc0024990abcc0e7bccf180f863b9af30fff1bbcb370b8e22b609e862779e0fe432bfd9d771b8d478618e786ee51591285801ea4062d4e47a09b0b03e6215cf40eec7d5dddfddabf44ca3f0a2ac241989d12faf3ca01ad3d84c992b8266d5adefa361bbb321403c5baaf8e83c2c0540abea4a7503f1c525e82a3653cf38649b20a30bd26149965013721694b665691be42ad53d4f336f98bbeb59b9a4947694b69d8cf6fccddc27a8236be5a1886e8f77de353becce6707a33e8145247e72d4e202feedb6c9c9b873698dbb2cd49851539ffe80d320a953a0af71a58d69bed4142eab9c80c7d933fa1354d28a00f019fa836b965d9a6567994c8f5b2a183d3ef1987004447d5d9b60a43509197cfc5876091661afebd3d1814f4c414489bdc93b59b6a5ee3fadcbba9736c9711f6a95a3592e9dd74ef89b44f54b6f7daff5f89c1a61ec71c2ede9af969dd18b84aacb341db05ab2631074d512cc4e8e164ef95b65d6fb250de26519e14d2de06590f3a4dc391914241742df6b42155ebaf19e4f5715f8e40fb9cf22764258acacb18cef00415e381a9ebca20845121a9f0742f47aa9af3d123a995180264ffd398b112516616dc993379b9be73bef02e5315679643c5e0ef301325839ba4914022665eb08b173079263bfa6a0b7baa63d271cc5188274b0b503e1b467643f0cf344b3e5dbb8f01fad2d7667ad308f8722300ad1753e70e6699e44257de2d1ac01e3b88e58218e369aae7369aba5bf48dd1ae5275a48717ea383b8b247ff632e2371c1128e50034da7a5ed3eb8e15c2291be13802450432321e851d220e4c0bba7cd8eeb41ee2add751d6c2e4a0ec5db49bca29b7d6f59f199f5c282f2b95ca6c0f252b6daa70743d32e44c74d5c1e7a47b464d618538c45759b72d7e8c94c51a78cac6b45e0bd3567fbe3253b38e717208da740c9cb1e14044c619577485eb188a2a4814b17b8c087b4d5eb5a4e8266f3cab195c2a3c8133f21af437bc379fa0baf5b43acdd62296c2a698e9730d90f695f57f95c34640db3e036ae0341fc69579df93d0fbcacc1b1573248552d78d5797531dbb9f8c956fef3c87918dc86441a7b1a9bda3d3931c46394409bc3b82bd4b141dcd5691458c8b7340a1ce863845d8ed98b8f8051651dbfd85e366bbb32b351e710dc427071a62a5f53c197388fc404b5285dd2f1ec4ce37ed1a005fd655cfb97734b0fd3cf83be4c2fa9bf4db7e4af6cd9bda42bd3992045a353c0a085bc3e33ef4644125502ba452ecbceb21338a40bca18e7885e2535a771f87ce378560237ef925f7e0931a5b90a51b774e8e96e4be2b57b6bed71b7c543813bb5d102c2b938ae2437cc370563dbcd8b90e30857c15f9fceceaaf2806939d47d1c189b970
Suggestions as badges
View code 21b4d3eead1586452cac6aab00c0d9c090ef2c7dfcf9004a933091acef7040fd7189679ba9827b23e3d128f628cb1bd97eeba8dea5aa1ca606b5ed02cce545e90715a084aecdb48ac772ac9843c20aba2e48ecb16ef7d0c399b37a6a49a1eb73beffa2c1fa9b1db7098473a4f765b60ff0c03fe727f14506089b5247f576091f7c20059b747f00787aa5d08d01131f4fd394a3fe1d88bf71a730ec662f59712f1f56067e319ac05015a864dc38f30926bd04b322899ee1e527d4d6a79a818b38ffc19dfdb9450f2fdb5d11f97fbbda674e7a9f6b2dae52963b455587f28a86cd36ce53b88e962a8a38a786c7a45edd5f215e0a38bc28e2eefb41c8a6bde8f266c1ac12ae34e8ecd096cf28a0dacc409e8978711ac729f909722f5e424e791d368446fa944e86af1bc30189d21d2150a510a99e18d4ec204823122a1c866f80a3bb8ef418e749b3da4bac9d692f197db2fddeb5c5ca11864cd416bf4af893e63d64826c3f57825090074aa8d73ae0b6e5b66ade043bcef89f09d0adb45333351472932b5292d8d2cef670e44c7082cf67286ec9edc37008a74c94aef26baa8e6eb002937ebd8ca0f22b676860491785cfe94a87887d2981a2e51171ed770a06296faa5c845f03d2e7836f74e5f7d6d8b6adce543846bae006130449ef1958b87eac4b01e31241fb56039cb29fa876d9698f5523cd5c4caa80ef64732631327d91ca3a17f40c58f48dfc07a6946a485a6ded266874586878ca74c055e033c85c14a0bb15ed8d3e3aed2704874980093b69cc2b4c6a1d01d704067aa66052d0d98c4a6be639741f15235745007bf5c294bd52afce9e5015f4f23363bb8724308247a35f8d6847568ac6f95cfad75ffe82c730abfe50d80e5608a2705ab6f38a5c94f0f85b177bd2f64fbe98d551b9d50b02a6e1920d7878fe643d52283e5f829f9749d88e5dc8a6485dfba580fc69231341c305cc6d5a295947ed65118886b04b69397c4a034ade57d3e193449f966370a7fa8d45b181830f252e3e494754ea991cbf63f2273d346dd6a88124ff298c1308bf5df972133a53cc079630ab65f82b19d664bfffafee4018b57512e102667ceca3f23ef1494677635e81dc19f13d3dd77f14b6c87e9a9cd4822d8f07d1d092382da1ab5fc91c8c7d09fddd04fd3b12ceddfc0e1d41878e10e73c2a05acd8ba9711cac96561ba3add04f722f1a8ebfe32cc0d7eac2a2430fbd09e57940b2929e04712dcf4048ef4b753ff08e49f30ce2830a1f60188be0e7709834ba55d1a9f2eac5c247e4f379029d05fc3e9ec365ea803d66d85fd96111d62660980165fd042b2c9ee4ee2830360d0a14fc55c9ac2f972b07fa929dcea35ff901a12614594aef16deb5a7e1ebca66bf32fc237a1278c23a658773e115caf736be4361db169bdbe1c3724509a2335aa1e3fcfb814f4d1fc0f1a4534c89b60f542e37dbb9652abe40bbe1f8c99663fa1bddbfc32e93ed8a81d1144263aae7be3741b5a8a63d0e6bc62c5618b38d0d5d2de397505ae261508ef9f0226ec3230bbff5a55c1c816e4f613e9ed9c9f75a4060e834412556a4bf02ba1e5208c6bbf679fa3acc79fc10b0abbbd1f8f50f4cffb0b6a39c89dab854954f98d9af2cf9d6d04c0e37947fa9a63d90e5820f264b67ac24af4c3491a842cb790d6fda10aa94bb29ec3019040c2cad2113d8c4d89bbb3f35bbcc5ff1121ef5a43d46775150d79bf02a6c70318f8e1ab014ae5106a200283fb2dc84b1fd5323594f7d54d335f0e78c807ce013016bb24547f9c5896e85aca6dc2cf402af1d30b95b9b04d399f18a8292ba5324f657b86f48a66996cb3661dbfe3323d2d81044ab8f745a613007d093cae8d0f4380c1846baf6a4c010c272fec63bab87c83d081fb6e9df1527ad007f32f5b6fcfe324ab99209831f84103e984af723d2b06d0d2cdedc2d81bbe5bfd4cb05864c48a
Search suggestions are designed for use with the search bar on the Home page, but can be used anywhere in the help center.
Search suggestions can be added to the Home page (home_page.hbs) using the Popular keywords theme setting in the Home page elements setting group.
- Select a style from the Popular keywords style dropdown list.
- Enter one or more keywords in a comma-separated list.
The search suggestions will then appear below the search bar in the hero element in the style selected.
To use a custom pattern, copy the <template> from your selected pattern into the bottom of the Footer (footer.hbs) template.
Search suggestions can be added to any page by copying-and-pasting the following hook into a page template:
{{~#isnt settings.popular_keywords_style 'none'}}
{{~#if settings.popular_keywords}}
<div id="popular-keywords">
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', () => {
Util.renderTemplate(document.getElementById('popular-keywords'), 'popular-keywords', {
keywords: '{{#if settings.use_translations}}{{dc settings.popular_keywords}}{{else}}{{settings.popular_keywords}}{{/if}}'
});
})
</script>
</div>
{{/if~}}
{{/isnt~}}}
The search suggestions will appear in the position of the hook element on the page.
To use a custom pattern, copy the <template> from your selected pattern into the bottom of the Footer (footer.hbs) template.
If you select the Custom template style option, copy-and-paste your selected pattern template into the bottom of the Home page (home_page.hbs) or Footer (footer.hbs) templates.
