Suggestions as badges
View code be16056f5bcadd0adac768950cdd7034ec0af57d2775a53daf7a9963977a0e337a246a8f546839545c5e15dcb3d9ebfb08f5040ad92e46d59c8b2c7ffb07efd1e0f6c38b42407e8f5beb8012d02e113abea8a37143340138ec5bc77991eda977e9b613c7fcc3b63b5fa6f5176d8d0a5a591be191c1cfb28f750c4c733f622b899dee7eb0b2b7fc69d28b803b4dd93c431e4d23396ecfa49078ad43a25123e754659c539885e6fa28fbd32e0b9fed4c5a7a15772863dc67fce6900ef0f35cc523a57719acc2451379cff2f7265932e4ed5ba6741a138734632ddfb3008dc86f0def87543bbb1ab35cdf6efd7a280730dd9aeb240cd070ebe95e66afca6c280696075aee8cdf00eaa2a78bf4911c1a0032fb77a31a308ea0675360187379970e808ccb59c49d11334be990349934d5f8cf12f54baf1a22aea24ac80e2abfd1663206b32b46577ae8d32070277b10676808fa7cba95af9c35b54cbe2c2430e2eaff2698d1d595a92d37eda197211dd95ef61eebb50d179807662dd868178d598d62d9838a0ea5bab2f2b0c591d9b6df74cbabb1be40b32c7bb62a38f99b46157a65202f2b6a3a9cdf136c40dc8d14a5c4c27609bfe79a99a49dacc04e06fe05f2a33fd643f79576b699485943010c6a11e6a1966a457a7e34dfd3126807502e4da43f87ae058622695bd23396dafdabdbe13403d196c842bb70bd930d9dc0f41213e8000c858f4fa6c478509dfad70f19d12eb688568b17a492b9f8e40e7baae2da57930f084106295a15bf2211bb7ebb5f612190fa623c6aa6d7547eaefdcd16fc45c280544999573d93f62c6d434e7afedb225970d949da487172c20c36be0d0db00629cdf3e3426efefc3a6fe5554c31057c729512b9068ab0aba9a7ddd4f44be1f0449b144adb92d5e24d5c326dbfb434917ef9942e0202ac545600aab5c19779465415435c2ea96d52dd2e2640a751203683d81f25901e9e1f09ea5419a0afc4b103e68290124aa184a0663d5d51373c5f5c08603d043125fa4fc8bfe830f3e4eed467dcf39e29b04c97881e7317caa74b475bb01df7a0790f748bc7009ea89239915bc4bf721a0d5843d394e843da574bbe688160af14e06b58d7cecf5203194897d9cfc584d06dfab32a5adc7d8856ceecc38c61c4ef0c93969b9150f1e4d546ece940d0a011edb2c3209a707d3d2fa13ec47bb9232f06397580900886d0e3e1216b139119c119b5370b4e60e1490b8cddabb24bbbf47ad3ea08d959dc51a584e154617d8c25e0521f7cb862f235f5d1b0325897fd01f5460c42ba25850f3c1a2c253c1d7f7ee31d8297813d13a257baa023f235a03edb681b9f7c195c9cf285f6c9c2823d2f5d3ed7ede689a9fe1fff405c4a5d0149800042e91dea1d5acc40ff45b9c201fcd80e05fca26b410fb1c2c00bd9d1b81e1c1d6080af3795e8b74cfb74852d879e96a52d81c6246b1e8b4182f55e929de1ccb3ecdeeec4d9fa7aeffafe5c534cd0afeb3cd9767fad3d4ea417b70649d6c098fa3915c1fa14e4eec2fe7637ad07fd1a1fccf0f6f26bdecc1bb799dceb115bdb89bbd20396ebd44a9a3edca3d15438426d8bb597e05f4f4784bd6716ae5e0b4374e82663ea125d67afa9fc956d7613f3242b27f2b6c8af8f7d7c62fe388fadf530eb77efe248cf3c1fa197b5923b703644f33447a55d46c4e2d9d196b8d18a0fe019b13710c4a76103dc5e2e2e46e745de6b58255eecff64b25a7931d1a7f342720155354564ff7d2084f087104266dc63266969963e363dd1d67fca98211598cabc663217888f7634d09d61c348296fc402f23ce170858d0ef47df9b4b4c1c63d6c23a8807aa004a5a6a2e4b0f6d53af1f0ae06d9c4be2fb3457f7b9673045430c8d901ad395ddd96cd614054b83992c7c2028c81efc402414ea84f488c389a966e4d0bfc24e3b10824df38a6d3df46043fe39a2691c9
Suggestions as badges
View code e13fdc231f98854397c9a6d2d206b5248c8cd50d2906b938de325aeedded6d7e458ddd4304eb338a069388f55cb56a6fe8a8f22675741194629906ab807cec1b1cf336440518bf24b53bb13f98c9a3505399e098cadb962836dc285e0a2f56ec3dd7929082500bc9d21bc9ee296655247e9aa7097008874254914a0c3219716cea9086fb748876abe080d57452affb1b7c5636aa5c680eeea595ce77a5dfeb01b1432bc2813d22fb09841dfc5cffe731becd9368f3e8689b9ef7aef51655c528d4735fdcb9c9913eedd1a534caf8ef043b18d3119ad42b192b3ebb4e0fa53d57e77433123d5c8f6a35ce9cb92a2f3619d15564d1515307fc965dba56952d6f902ba31488ac3b87b60f461929ef0265e906a11434c979ee81e1f8971626eeaf59d9d2bdbd5f894c713cd3d449e2576b982db7f53a1f860d1213aaab5c2c7f6f750d69844e5829d4230c5c0a9100b829f3621a0f8d79c20ac6ec2c56da9be68f8fb32595105caec764009bdf92f2b1b0961a8f3907ada8a54f2b00e794f050c7d379f31e9a43431f6eb4bb84c4920834250100836a97610f2b00596918ee02fed8ac22991ca324f402d3818ae6bc645bbea0e46737bdb97e4b3a415b6ab0084cfa9ba41289ec9a28f7d800308ee9e9c03a08776dc6c7f24a009afd58fe1f01d15874c5f415efde1f56c6de6fd43e9b67a5e80b2de9b017fb27770772d26c3464343fba12f5de46c9c4257899e24ec65538567cc5a7da38302652b91ee454d21a6eb281c21203ba7e1833c3d7d21b89d8e41b28bfa8e0abe1b7c65bffbd99b859aa6afc7d4b2470e0d0833ddedc87a00885f8e9b86152983bba095e4101fc22eb859d8ba64039c073394377f344eefecd480275db749b28d33e34304a5bfaad6efd65f6ed05d534c2098382f925c740b0a0264a7a2a0fd9f5f9a44909e42c37cdba55e8e031884581efdc744d853bd364a4a298788f3e6620d9fb0c0b18c598a81a697a18a5f6926aa18edd1d0f1d7e521dc6698689cfeb78023e448a34261aa3c6c9b3e5bb4a44497ae2b86de7953bd1658430a1c396e49276443dc7a66cf3c5b081022ce83898d97d156e7985d9af742abef1e696986f74e6871a75688744060d97e6146a3dbd1efd6cfe6af1b5cbd40d889c00737ac32abbfcc7d5dc3c33b72d689ef023f451edd6bd62cfc600586ec66aa0efa67c6c6a344dfbe8b3b6cf64bcd3519c4b458af77eb5e8d23ec97b6782c56296500280640d67593d5f8e9e1dedaedcb2fba3dcdf9a31092f65dc3c1675d6c7b33b6332f19ac5cd008ef57215e7a47cc9d76486132225b7e3ebc912d86b6d382ac2466f915d3608ff8dfed30d163b04b23ce760cbabe6df2860be847aad306f48619348d6fea4c713e8a4ceda2c9086ad1367f1e97b272ea870e1003f7ba5e61cc6fb7f06c34ffea9fc3866079d55a35adb417b32d1baadced7194206b415d3a9efccdae20539969fbd19e88b12a4d94efbc741eb98c69222777278c521de0c2c82ffe9e0ae225c7548865e0e51684e005d234e311552f64043ac24b53ab748a9685a4fc1fdab284bdc6dc5f29ca143be7d06267a574d9ec715478b411597df5a739b96c471600ccc78c55a49b17b57af3778f81ba13831b5eae8bf7ea1bdd0a628927244a8c6334ab68a9b0b3ddcf94923ac90f59fe84177421f6e700b244bbb209367ee154b07702a6c11e900dafdbc0718f09ba525fee132eb02fcceb77d5c9e537ca73d2e8ae9b10d128506ccd7f54d734b7c5aaa4685e4caf17f621fc17c4ef4beff793a9389dc1374c349485718be0ab57d35049c22aab45e6675455e383220a20cc62f47ead62ed034a6fa226ed91951bf4e123f2198cb86c797abea99c9f68fba98ecbb9dd7be62b36ca89a081d128c223043122bd06d3a6415406d9e92e8491ff1ddbd2d7372b722336d612d49ebe1f9caebd41e23d7604987
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.
