Contact blocks

Contact blocks allow you to present contact options to users on the Home page (and sometimes internal pages) of your help center.

Contact blocks, like custom blocks and content blocks, are configurable through theme settings. The style, color palette, images, text, URLs and number of blocks and columns will determine how things look on your help center.

Left-aligned contact blocks
View code
05539e9a20154c240e51fc48142ea526b12ba2da36d5834cf23421273a154f554acaca512f7c6c732953f66dc15215ea479cf82e008f2ad05d83c4e3dde1c7a92d522e7570a8962dc307b71fe344cdf2c34f77c8cc2eea50e6b2705c33e45f010d8f4543b464ed0bab1aa37d4975bf7ab51b3130ee5436e292210a01d40b1600f56674167104043dcc35179912e1c30b16850940065633693667b1fc4a68498d14373a24341d4db422e732bc4098d86e0b467483c87f2bd90b92bf33cf809534edc844493d4aa90b7644f39b574f033473dbef2f64bdbc4a9b55454613947abb464438081368361850c200fad9de6f90d54056952e940d59cba0d0b5e9de6629480a43b3ff37b8fe39f597a8a6e4998e1c090dd4729758e191b69008132e562aa60c5519e28d8cfe1183608a59a1b833fc12a099b6793e686443348cf9c9f02e60397f3c06820f5b00c5910d1ac58add41a5aa448015d8261d75bd8ca558f2e1b7ce3fece120b23b4b41295930ad09d65d0f6e492bce3428c1ae8917e7633a78d4bf23fe1eee1650b8dc09b77d98d8871055f37993b90df2aa277598a085a6d4ae4c3587d713c46ecad5579740452f5e6d88bd7fcc4cd912df7ca81e047bc5af3c1ec4a3e867a6db8f9b6a54a8d7a818e712bbc85b95ebbc2e442e5694b7f1132e69514a059e3c3e2c05a5949ccec585c9d5c2b11ecb02268979e2d306446e33c2640e7935d2697eeae2c36092f89f5cb351eaaa04fa79a199dce815473263e7eb550169c5c596072bac5e76401c1bcc700abd41f16740f9ca90899e3036c342c7d162e4ff41aa1de5e805d9a1d683da22f34014af3444e6cef7128f3392b626e13f52e03a79efdde3445810caead06670f1513040c39cb6a5c7e41720175e3abf4a8841399dfeb43e712a0cf9174b4455c2d5a337560b96c3fdad7c57d646e48ebdc02d295e061ad7f9b29b345619eb37726292785ba6e37b4e671b2af9cd8d7a7721a782a75276fb2f7a8d247db81fc2ee66b3f71d1b548b60e1f77322be97de4e8096f0954016177ac09377ca700dcf8a0026a17bcad774fc3c61068f50d55e68108dc1b7af22fceedfe2b0b274e1432506fbadacd4731b7716c3663ce03d103b5ef87c607b773e8a39176c044b0bc832485debeb7fba3f03c9f613c9ea2065cd74dfc942ca1f0838f2565b49350d4425d14c2dd72fbe8f0c6954dc35d1328da4bb821017a7b74955681e7668c71b5c1f9df7053d0480beee227d3b595e34997caaebee9abd4fdea46d618ee3031551c1599c472e4d2949a04ff14f37beea9f817eb27d7609f29eb97fe964d9607813fbf910475266a8810ffd0d6cd5ca9a8907837a0519c0102c29d1f672a9d9b4c3b9c3c0ccfa255fa75823f59245b2dd0bb5b65e47ffd5d179169b1e786d3f06191ab3782e4db2bc93e51f39406063e3b2d9b32e3e9f7833bfdb6256637e1a777342f13e85138951d271673f09d8dcbb33d13c38062efa15ed6cf9af1dda7bf99263edd3c5757067b277b3354d5bc7f47df737e93d06f9b71e42924c3e4e73158a08242df282daf8e49528f5048e2235ff3473c41ea2543c4ccf25eb6f52c1a7324987f92bb0b4aced01428d34eb0eafda869c1ec63ba228177fdc45a5e5f7a1513e0e8714bb0b47073bbb4082d4fed898bd8751d65997800a0c471889cc54b3e883ff84013dec75e60e17782745d567ee48d6f3a0d09025751d7ad040efb5e1ccec52dcc350ded989d798190c0e83ff02d309c0fc2e2a9f345eafddb6a64cd6ad1034c5de8d2d9160b051f10308b7a468c6df6d4eb2f40962d670f3753c99aa453dcc088aecdc20400dae48254594fe349893177692e91a390c233733ed8a018dc6f5ef75ac9e60d5315ba1d12be15ee433c22411cc3f6bdc144290d296147389a8aca70dfd868110f82745011fda85a3ee7cf8751426f766b69ec7c02021a579136d03b8d9263cfe9afd31f3a76afcabef3a58127709e33e4f8a3c939bee1c7a5f6c568382f04206011234bc7808327e5dce45d86863b5eb459e6af57c8a2c5798b9165f8a91d82615df29b402cb237c7c0d200b158e3e51839ade4e58500915792d315a42b6b1f6ec4348637ac27ac1c4cfdba2163b774656fb102c9ad24f6f6dbc6e2706bd2a23609f864a4fec0742913ba2a977f06f21d823fea6ea547dad88277a226bc669681fdfd6eb271a9a039f3759bbfac68ea4ba58cb318790229aad157476d85f8e010ee42a7277bfd7bbe5d4282e6aac41604ad7699f13af21cb47e708a99738dddde13342a24925e3f67998edef9aa29b1cf205816ad278f6eb3589872d91180d9bc7873b7777510cc7775b066461d001a67a07e13ebf35b6f14ffa9276cb8e9ecaf057663b7c6677ca81e368f1cb4c90438d91038e236d17ee73149c83c282222809eaa0b9f7a69ee943e028bea1068de0760e7a87ea98fb6c2aba4a622b4e51d87c84fdf9588933043aea3fc613bdf63a6d29de9dd6ed92d921283b98e995606cceca035ddc8fff58ba3571a27ce689549a68e1d12f9fd03e3068c745ee77624fa944e031307c2c33d9337058ab08578157ea1def2a2fc8bc19b1bff4dc088ab3589076e3f41a21b97937fdd82519b44ea46bfac28d425fefb742027f6c2652217bed7cfaffcee0b2418bbbab9d68a319af3dfc775278221a08ee1d03e25a5a6e61d4743edb5bf779223e166c5d20379256ddb3d0dd68a9e6114163377b30dbd0a5fd200448543713cef4a9ec37823cc7f2df4f319c83c7eb150c9d402041e39fffdd8e8553854f2bfe1807b636a1394951de2cfb29dc3a4ef5bf21351d5e8bf2fa59782c7ae2f4e9e890e8ae2863dadde3b3f66f505c4259acc77e2773a11a7996bf422f69814be3940e614fd47da8cd3b8e9d6069caf9aa726c1517bd8b039187bafc08e72b6b248e504360a9ba7ed420eb9d2d201c0d37111ac4425c88de28fbb8a038137efa729fbf58040a4f519b189794dd7332226c00d81dfa24cf34108dbb1eab2b93dd32a0ff21c6f880c7c21e28be3e4b29a8f6bd2033e0beebac3cea5d2e4c419385f873f6b855bca98ef3e5b5d389556324c4177ca0b0920acbb47bbf4dd217a29d59ac28f24c85d81d9e1c7cb142c3b6f225c16e973caf275d3c4d5c007cd9ff3fa9800f271fbbf256fcd560f83c4982e3493043056f9393d0d8b0d2a19b39357db90ee453474f2b8e65543efe335565472ab0589de26aa92ec4cb1ca7d28fe700b8f96ffdccc0765cc10e81a310ed33c4c8b7d6f0a8b0d6a716d90d8aa567dd9f4ce2006f3c4296c3f44d474e640f3c3a133e9cba2ef88784e9c2b704a65bd762cfdc16df617dbbd52476aef2a69b73cbe3f7455ce0d5c17c2a7655f8d96423039b9a5dda91bbb707c3ca283285e4173837cec71e1b4ccbf90f8fc6c4f3547f3de2e60809125cce25a458abb8f9995900d86829123fed136da75f841e8d42497f210068abf4aa65333804cb1a51865dd6218214d3f479da308e4ebcb3a69ea247550d1cef1d89a92c20cb182c072f111a80e3d20df14794e08e7686ba21f537906bebb3b6a282dc0cc6db9474342f9f4819794dd6122ced0ced00cfb15d2eccb8a5ac7e29110c6899b64a47202fefdc3dac634c9a008eed142a1cf930ba7da3554c04e62ad7df378aed8f52b7c8a834ff92b50cbe26515f795168197163fae28736e7ac9ddcf1aaa118f6c0c11349a49fb51ea609ce42cc64f0b610733a27480315d5ca3dad98fb241b061a454da8ad55830087fdefc5bcce8959cd50ae0f18511cdef5eb264ee77b9bb32508fbf1cb81501400694a79688a2d7741304c4a8f46a8ba5e2ba9103c1df5afddcf7b1890d2448a313f0ce22ba5a9d30b84ccfc0829eee98ee6952a28015272796346c15074d4005b1a06b2fd7fb6a09cbeef57a5922fef054556ec18c4cb6c0f0e25bb79f30a4f5fb7f64b2f575f74e6bc50a2994c3ba3acaa0baa9ec33d187e69176da2e0b2207817f5d877190a14060398d5ff108111867d34b0e2702636eae800fefb3934ef3c0ee4d7c4027dbd00679e654d737ec98b0cfc49e9532b95c5139df63dccf1d142e8ec1fa5a1b0601cad2d3cc08754b1d2f13b9cc660ff278d31a32736f58dee7a0282486339522446adf2595848e6eaeac018c7234f5bfde218eec689e4008112a5f2a6d987e977824eea3b9f40f7e577d09ffa18bf735cd646823acad7c19307d73102d7dd09320d8c771855e05b3318d1879d8f8504f9c4365f9a06a93c59469c6cf0725d63ce7b7fd3f68bd0a1a8bb82259b9c681b7de10575862a85e47326cfa8ada95b756f4f7fd4577bfac16743f97f6de67583392739437295e0abf608c6a36dc169e6a6c484fd6171cac7f97ab4ec7957b4e298b079f6ea910b4763eff8e50d5e031d094a7d7ea25439fb812dc2c497ce9cb3070bb701f414e2cb8c87c3fdee32e7ec760de100b5bbd8b1de16965d9bc13347cfd332373b641afacff1ddb9ba1d34ca438df005b8b5638821fb874cf7a9eebaa7c500326783f60dbe010a731f688a220c28a99b2b0668e877f73613737bd9dc4221d858e677e688e6c11cd3e280f166c76b5fb666cde63b34f7c0331ce142c14727ddd443006d65b1e6f1bc0fdb8a9af761def133fc297fd2d776ae4628fa8139007c15debf29274e151044b181f4974733aa5c8edf006d2a34a6b49d1b8dba4475cc8b18ed9f84b124ed9d28db60e1019406b86785ca92eb3f0c21a0f5688b559b6401b89e1a2e49940d843db522bbe8d4c4b44f4a1c2d87a38a739d14e3e480744044f08ab15ff2cb3448c33cbf9a1176c5460e35e74c76f803ba82f1f2fc2f73b007664eb69b24cda7b97e56477d0707a6d5579aed6580cdaa54e503ce642aa579369b754558ee4a34177faee7bca5dfac7442facdaadbdad09a3864d8439b9609f4a2ff19eb721b3838ec4f9bda4ecc88ca1d0e10fe009358023282dbee783a68b090768167be7ae0c1a6b64634337a4035955386d55bdb803f727e4a03229b84cb1d665473e638e177d4c0f362204ac29ca98752134e5a1f7d7c09cfe9c4a515ece58c46df721d554cfba86e5586e8af6408d5d40824f1d67cab1afa6a3c6f2a7458184b75795ac0a4c1cb10df26b4a8acd047cf1294d3076b3f7c537ec81cc482e00d6cab5d34dce016a75ac450daf2e025590a5428410e970625dcfceb66ef83b5c65ceb20ea0ca8cb605789bf86bd836ed6dff8fdb42eb4d3d9ec3a6449bf642a7fadafe1f03d073466ef85da7d0fd16a5148cff37cf6c3f21d23d81f24a1d9e60669937cb1dd18d881b0e4b3f105e65fd05b3fd2faae8aafa5bf9b3c89dd0783fc95fc07c73999236ca30e00e6d8f864026ec32f235632d439418cccbd1835587f0322e445e83d76175ac5abc7ec5c025e5cd2c0722c8ae88c15cbf2605130fa16f531fe6e62d6a411cce6dce3588e3b5b61eb0cc2b66e828466f848d79cc182c2bdde948e660d6aa2bdbbd1a5cce7cfaeb1ab88a96a3986acfda0d186e927eaddda8cf36018e405a06b2917fa784d4e3c42665c15748956d825b316aa74a2edcb6aee28a9a482e0f02fa93de08fc4efa46868248c0cdd49fd4254c1be5637c5fa912bd1292576e69b2d9f65e7e3464b938b47d2d78f002b2d95c4a39f7306568254bee99b272f5a1b70bb034eb797c2ae3db950b42b55ce7762af10225e7bca667b4b8d7f1981c239839c329f9502d0837915adb297f45733f5a5f10ae9bd7ab0aae39efbaac0ccfcdbcd16f404f982455fc133a7f8ecb72586eb572e852ea7c1e1ad34b2ddcf392a5c9578ad7cbf152158
Centered contact blocks
View code
b05941f87b0258bd9d1c86089caf2ce9eb0e3425bc3e7f1dbd5c79df34cedcb6f04400688489a22f2ed00a83af7e49ef97e122e9aaa40a0db20f61ce4fe964bf8feda98807dc06ca7efc92bc602990623ac0e0044386ec9b9f463e44a310f214c7c638f8bc882d06ffd980dcc5ae7eea1013349bc2ac9392ba8849fbca65efa92d61db3c51e4cc81658b39a4379f85c82a8747fe292b15d3c8268bc463737f9415ac82ce97e21e79163ad7e1f0caebfc0e5902d2d5c0f1231dee2d9ed92629f5de0e924f5dae74ac5430811df22f86f9a2b4ada7090c96cf12c9afbed419f7250da181ce7cb077024e625bff928ab68af3e9b12d67f03a4ff36dab41fb2c4819faa32aa86cf8cf21cc63dc1584b25c0f295785a3777c945bb67155d65344e39e8e2a761685b866c3acc49e6f3b9a0f189dad65bbc9de1f8bf01557a6382a0cd5b9928e1e59d11de5d08bfb42209ce3a39cb42c1adfce7469aa4f590bed3acbb8815c61d0d2f75120dec2d2acc159c8580f3fbbaa822b8097fabdcdee2728d98a68af65893f82b90191ea4f45bd45cf3269d4735a86e01533c2de095b2233b0ce0c1935d1d1ed2a5d020cf8fca0ac28b313d8d4af7a84513a9a341c568599fe818c00d9e7d33314c23d216cb2b1fb1304331e17fec0bb0890e60529886dbcc7ace6c35753d9381798948944a54f42085b3c222d7f1add3d76722762b5c490a91d47ae0ace81b75d48406dbc0675a50d60b1a90936373726c1bb53952024fbf1e876ccdfd8748176e9f928254600ce34d492aba7847485f2d3d7364c2373f575466d009b47006224322cef6c9d7cea3bb1b75c99a7ef6f5e1626fefdb92a7074bec398825c98c1bd651efd6dc8c13451ff008a7be04d64deae0912caecbc8a17024cee4d6867ab02562412cdd1d8adf821a2dd5232dc1b0bcd7f20c886b9ff8c09ccdf31782de7b81303c9c7271c652ce41cd32297751a57de82d5f814eed0d5b5cf316c9a3b800cd33f70998d5382670818874459843dfb01a3d54613c5d7373e73542d3e6d4b97507aedc679508318ab52bd57be17b6496adcc05e2776249a43e40c96d807f9b5f92fb029b8b5ebb9e90171c7352afd0c475732e2995beb7692b7fc85d240d3914f64e152b8836976fa48c6856d0cfde19ce312421c856785e9a5d65340d35307bf846e6b1078dedbbf907f79cfae789b873329b53352101de52b7660c0739b6bb084ce292b61fe05260964a4baeb77f7cd3e48d53a30c40001bafc2245194846e8dac067bbc696038d5becd919425ed230b658c4393a57955154ca6395c04493d2d0a769fcf5d8ac9bf64742cdb3dcae58844e8a9f3b3008a64e23e047c4bd65186695d45c420d6078e5bb5f0654c75178c28627d04c87240cdfec95b00210566791221ca0a0ae3e8a16c3fedadf5a4d8e5c0544509f487057a32b39c8cd774b566146ca2b8291e1fb4206adf6795f0773c28c62d60bd9b12a254fc11e11a596047d04ab9e250c0280c7898b5887c704ced4bdf63cb43636c4cff4c202517ee63110ffe487319bbfe86737a1793fbf4b5637cfa3d56497e3bdf09b03f7ef9138e67a83f9add483b382b1c58615db00ae8207c888ab5ddae780fff2f7fd348c70b89728e67db1327d89aa3e274f7abfcf4856f68618d28e38d36b2683a25451cee52739f6b1233bc326a7f51017fb696e09f10a791ba39408c966abf95c668219d875eaa26223d3073d97b1a1a872ffb80ee464fb175b52367c822532240de2504662c9f7ddf07289d40b6c063f760fa90ba165c9d8ad833d131ae95efc24cda16089e09dbf7a567d09a72b47e911cf993f53440505cb6c7b2c64143ce45d405b23c8f8ac217669d266e7e27bccaa5378ea055e84cf3cec203df79b1a4eb7115530a3a0e886f89bbc4f6396e47fb57f3faab8038d052834452e7ad5eba00f0a9377c96a540c08972c324871398bcb643fca78173343b26d9e181430da79ad7b6e9c329d875316d9565be9e1cb08be5069f2be5c4252b16d04f21be0e198794d775d250013565d7f470031db7741722ad9df644072c3ae72fa7eb1cc300095ca6d986294d3f270f4872dca909810d8cc6f8a8f78ed19b3ac0913e1eaad931f6969ced996a60ff510946edd9292bdb10fdf7c61b7dd62b392a0b7106df85a4eb4d6f8015ede386cfc93b5f99834308140f60d265cc08a7376ec767d522f509582e6451eb010a4c8a4f1b717134ef4b1f88135bd9637027af7cdbef777e6ae163a568eecaed9b989543a3d6ff169215e79b3cdbde73ae305c04dc6d97ee856abe2ea41c1a20887028ad8145a7abf13f7ad64bb74eaa3eb9bb3ce245f528dda665637e5e9447601d054ae4f81fb952e03f4e54b38be02e87a7a916884945a8d4880a34862e976277efd8c2bcc7b6ac4d6043722803f39c29c8f9deb5a26603fd3ab9532245dcd1fe7276b0b99d4db64171dee3317324d756643a58cd3e13f1fc2e359a76869952ab89c620c7dd05c0c129f6307dca0fe772a9a08252d36d0cdb49630a579b68ee926a303ba18052ee37b3693dd58b004fbd5af1801275033cb5bc879c408a2b566862723134a4a3a97a78918bebc01a2e45b52b727fee0cd4754c5da79854f5396e29a2d4edf8ee554919e5e542d119030fe6b8f43bc16d26eed6e63a9cad6adc0501b968b96064f74efc60bb98830902721372a81a105b6903e4c95bcdd2164b391d631c6fd7838e2b5ccf5bcb2937b2ee111c92ad85f183bd601b594218ce8f9e645f9c1ea2c47ae44217c83622b8538ef0a1c9928088faafd863c89350292acee9776f5ccd0774e51e2e47529e024125a465089421afd6dfd53494459222cd33fb3ffb8be57791bcbc05631177f496f2f8f6d1a5f4da1d411aa758e8739befc89640d80e79353e60517e5bb8645606d87d1c6b3f6e0187570b08d5527328784e27d4f5884c91ce7f8bfd29191f65265a4dffab795564bba90f1ca7efb2d7a04b299105c5e2747c06f9f18b907ef6d776ff76795ef539c92647218eaf9b3560049a62011b727608349808b448da47980ae912d8fddbd775bd513d1e32329dad9b8a39f92d2dc412e12b7680339ddc3d640a437b07c5283ceac62340184df830eff02bd3eacb0eb4cf460034a94202704fce6c560012c12e86d18c31a718ba835b253c31fb0a0eac8664fffd1dfc9db7e19dc6ad291e1dc65c40cfcda3b139a6cad42ac799a374d21c8968a79f4a8f395cd883d5674f3432c3042062f841d76a5be762b00c60c067089caf53a3714efd040312a08b37b23363e5a6af4d7ba2fcd62e6115242de1cc8d0423be1a665dc9bd48c3bde3fd8c77257059af117868831f3035440771e23a7a0e25d4f208cfe2ec10595f52ea6d3787202f22369da2065cb6b0611df98feffb65add3294bcc68f6a255751224c1b9a1388e13784a5df6692d665441edaea5e1e7e632da4d286c71d9a83f9ffcdc19dadac0f2929268984762ced2299bb40facf63600fa29decff32fb4f5829d61798a3e228b5650735447d7a40fec35addc9b4e8a3259124f2d00ec349731822b97424c4e1600bd4999a7abf13660a3275166b76635bcff81ee1590735e045b44a6fae2b27e57a57d55395d82e1dc2d2a001a3ee21bb28a5d74e1bc9379421331de9a13654d265768fa40fe8bd3c0566d1e070548e60e55278ce16a16ca1f5762d64fb7eb7ec9daaeb765502045f573fbb04c3854315c46c5ae1c3c010e7d42dfba3fc7bf1bd2b7bf6ec52c36253b41845012e997535de9f669e771107e2b603c8382bc5343154e0b2df1ad2793f1a4ac42897f4fddd39702889a291ac620a0957ad9cedad39555589fa533c9620260056daa7698ad927f6dd4efa9a32282b623cdbbad3324b4eb22c27a3f948666374ec0f21b0e3726bd2a3137d34183a6e911314349d5515d36f1bc70e35475f42acae1ae4a5542b861c887fe36b6803aed9a5f372e960d253fafee251667eefe1182866c736b72f6d187a9e9767f6412dae75351bd512481f034e9737a3ab69877321f2d5091d94d8f87218af578ce4cfe1d5da51e099359011ac9f8b013492218bbfed6c7edec7d813774a338eee9d789e8f8766898c56b31418bd7312fe21eb793331a58d7a4e3fb748a14c171c9e3213e00b028d39109e766f11b8d228a13f5549731d1e0d3859c682d824fc648868c638e9345f5bcf232bef04e726689e10cd4a603c9a6c7304348a05a10f95cb22e9498f8bf334f491797ef9a562417729d4d0c897a597f680bf06c2b96fd99812b4501e0ed9691a18ce85a06e0057b2efb24bb3b9dc2aeaa0f11cc7cd022c3e697afb04aaa5ebc6864d44f064380f5900c7d4fe71e18246362f77c6772ad0294c9754aee2598f55850f6bcaade7c58f786e03eaefacf3707c9540f9ff212d63edc60e2c1520c8ccd8c42ae337681499d8d3d8f7658b8b28801fc8cf868f5119830519b143588aad60049f95fd29c0cc934fe8c021a5d2672c2f7f6873b1391a1e3fd0615714982214835fa802e6d2a8961b6f2a2bdc7970c6caa6d0061855dd196295f556c7674eddb7d8971817d866ae5f804b26102539881fed46975b7b00e42621cb7096a9185cced8a21a0d1bd6f716355630cd41bb3da26657dd12f54c9474585fe56080efffd36e54f05316deaf9abaa0ab3dbd0ec7646d9417d286ef2398d8a32187cc946148b8ee582596e741593d4887668d96447fc9cff88270776cf2a2ec14aef51b4063aef2b641c8b9460c544432af791b6017810b4b901acfdf39ea5ff948e04b8a98f3401c6e86fcb4c0986d6e8441fa3c9eb4a3b3646ec890d36fb099355544b8a826442ffccd187f58fe898e418798fd391e914da52544b492e23f394e016389e29bba0233ca87b8c70bef0b77e21ca7b00be77d7bb639f12941b09298a1d28a17527c94d9d219ee31d0f6da78a0100a7259bb5c9994f79bfa0a11b2c5f2c5844c8e0acbb1b285a394630e5569d91c1a46c071a6eb2327eb5be8c8c696d9c03e039b90b1fef6f36944f3521853abbf0f92d31ecd5035cc5c00dc3fc9a79f10f976672b3302f827c42abb7551ccb9eb099cc421e79aed87c213f1506da79041f02d5764c1bb8a39c6a55fa7a77daf08f85ab97d9da13076ce06cb81aa63a5b267dbf89e562115950abfde395c7c2790437c36f8b7e6d6759833ab9b329961d4b43adfe101edf1ef44d2a0c76c2a99e68e3d5cf7ed3046b0e86cf80d9e4bc569e06742a12117688c31189fd6543434b1178a1bc72f1049fd466020542ca4b95ac75d37c9fdce75bf1240fb2db8b1e468543249da970d213a425cd4d86293c8844bbc2c7d5aa98807276e2c519c876ccc79d4440734bafce3571f396e3ef24d60445f93437ae5185395920b6468ed967d2559ac5cdd69f9a3a4166c687cf261d51564c094b684f20bec1914e810b403dd9ee2edf45c8660be3d9ed1522f03bb86db4c4bed0af5d223305024bf50cc36002af636036770e294515fa1737496104f7c7120677ac8001b3aff11d0036d5d4273816570f04462da4815a8560a93a169871d7d8482fd8f461ccf72e4844c31f3ba65f9128f50d8a6661a7a3f5e88c11ced558ebb8b9b5f572959804b78248fa3e6194dda26a52536429bbe5b879f63d4492f31f862f548883a20ef54ab5b24a7ec90e009d516cdc176a904ba045fca59f876e7dab40967deeea6f50c0a7e7237cb28e0c34ed00ca4f503ec0e6899d464ba3fdfad8db88f7fb32f9e175b8600df644ea276c868973ce70aa70c293afffff96a13dac17c464e94b97018b1add697f86de2c3a0939673
Blocks in bordered columns
View code
06b869e7aa4228f8462f5045e9ace2ee324c55e975991ac186ee85d99734d049998fae195e69c119aef81c55acfa034ad93cd81accf27590cf06b359307a96e55259eac35c02346c2a6ac5d2aa0769f90e51620bbd01528d761b9aad88b386e3282351fb8d5640c85dc79e068210803e286d7e3b0de2ded15080a824a3de4945ea5be784cc7e87bde740d76b5ef507fe3080d26a11b46e3a51a0bbb24aab1065e761916491a58a5dbd40f8bfd325d16a4617b439adf6b0315f52584313b9171f0f3549d3d2fb7a9743606958a55529503d1920da85fc61f08b3a1dfbe41ef1ada949fd8a192a46b612690f830bcecd6584d9fa397d49d1401d0f553dda02c55bbc7ef40891c5450f439118a9aca7f3438cc697203870529aa930382e3402c5122f60dc57e73dbf0df4bfe189e9a650ca9fe7eddf2cdab9a3af7d0a1deb3902f41e1de57c950c349d35dee17ad518f1c8da9de0201c69c182a6e77eebb49a8f4ee8ab236982c44d67cdd17c1661f17fe59b01c3d367a49afadc3015b7d1a5b30e135ec8b494ddcdd10bb41b66981439a319987b3a49cc066f1c6c6ef8837ee0009f5a5cd21ecfa713e065734a7f5582b021c255c5926a630f39833ce349db7aac0e6f02bffb6857952266c6b9f9467b32637ea06b62a9abf7a26c3b688cccc6646867ffd0dfdb757c2151e28c895bf58b07885122f023ba6fa20a91fe2dcfd246fc24f7dd1e31fb34455a8a1d8c0d8f2429bcb948ae920b454ea648ec870034428fc1b7bff257183bac3d39292ab0d8a2701cca39765b10009343ba8d7b947d77718fff4ce3668ccd3ec88676e3bd65c09d992f0a7156047455bbedf67c7a458cb1aea9491e3bb06fbd196d0093296023b1d1115ce3366b85d1a497974a86c5d9f31febbd236e080d3b0e946b05622a643004647a2277961659fe44e177b7175b8cbb33641af961537a5e6a770beedeeed505270f3951954ae9c3ed1af961891f950656e6101ec40e449b1d924d2bff2828bf8230a3780481976ada6a86071904117062ee6148e62e5ebfeb6c4a69acfe93d48eeaa9fc235819b33a12ccbd6c8a4ef8909237a2375ec4681c58dc74b859a52c6360c05858baa5641d8f63c3570f6907dbb2fa6af765b4ee8fe20a335d6f598013b366a12996c9f30b4efbb4c3740af073261017802ea04897cdb6d3d4cfa7ee91a1bb291e9cc0ee3ed095d1b9a8e47dda0adb8df7d04d3188586eae4d49230a686e0ddcabb8e3537af859e2bbd7460c39417c19b108a6b40bff5aa74ffb2bdc4bfd299368bc1c0d6b474d58ea4f6b9422addfa92aa841503a09ce1d12c5dbf8fdc41a28aadc63214e983082f4364bd972b9f1fdcd3352f753c762bcee51c2740b62ae09e685bb78e84ad5dc0cbd202ec471f3568eb0e016c53ee14c25b52d0e50d3afdf64685d2013e5e3e8ab6751fbeaed9eb4cf7bd6fa89fe41062187e5359906bde1e4b90689ce0c3a20673786e159a470f7b2f9d0d80621b78683ff4d186fe05e7de137e98ca3b31514d0b89c16db1c4eaac89b8fd239c10a0afdb6ad339af9c1800d3fee55877d21a4497d99a8e21f5cd82bf775cd8b15e6204aeb4aca9710019c07c6334d4731ec9f8b99b5c36f202b6f91bc0a81de4ede0ae87139e046ff5162893f33e1e356ca39ee3e2885372234866ea6eec57a356b90db5120e995572c57b89f24c057872e1498998fa6325fea49ed159191673b92ce5bc57fbeb1584b756c6234b397e8e8205f4e23e88c2bb54099aafdc093b818b52bcc97198885adea6553737a7070827e15d92313141e7cd1a61365745590f8c07742a9d6b5960ecde065edede5a277e60ccbdc54d9ef5d5990e0eeded0e7726bac726fd7e561ca5faf79c5b946306025509940d7564129bcb91ba96524fc36f1d307989f1f38ec77a30a151605f7aafe4882c13bdd845f682f607d39459ec7b3f6035401169e843684b6876f609d7852f8df7a7c259953a6c5978ca37c0503a4696a102d47165b863b47cb42505cd283a3653dfae6680049901a392b90e6312e93a8d2540995f83b9d706729cfca9af9bbfcfdc844cfc01f6a8bab5b433195e9418f24022a11f14f7f53996929925f0e0eabf6d424c864cb87d4fdfed4cbbb6dc029f779c5cc02dd1d457fd498a31bfa8282c4a780df7772532d6938ba4444919cb5c0ee8f5d1df8ed7dd7be17f4177ad2ecf512ea859d75d46081e3845551e7b3d9e43def44569a25cca2ce40f6d10413ef44cbfe511392b87b9c06613590453b49678a331971267bfb5311f40124824170e514d7996f1f479f7350132a744a025ced752c740de6de5c14cd394e4a7df160d59e38dc397127362751b08d9ca04b1c835495d1cbdd5fe74d4833c89adf3360ab8047c955a1377e9c9feddb957ef1eb1ee171c2f574da427efa9b4db2e7b98209c6a1d23bb39a5c172d6d6de1a25907420b72bb522cc86f4835d9194c054ecd6266d3ec79e8529ceff69bac9f1e7ca345fff974d4472634a3a998ea39ed9fe641289c36f3bb5a2510c8f72555cd33b6349894d5a34102079e1063faac0dd55da5d6e5a3724b4821c48191e9e9f034d443e45fbbfe1664c430bea547c4032758abb5c3751e24a31e6a91ec779fed78ced0ccf2cf6c2432ea4a99dbd3305ea1c9484da775cfbb1ec8fcada95ae0300f7a7688ffa2b342d99776603a29dfd180e1d8ef86648cb6ae9b7d29fad00f7291819b4b811516c9f9fa031cb6bd8b2c5bae0faf6c86bdbe57bb5183ea64cb1acd83f6c391eb5eb9f4e6732c7f92a8ba3b51d94b89299594f73f9ade66497821a8ea0a0db844e209c0baa41292341c515151e6870441c10dafa1b78beb10b974f3679010fd6287900fa906231a647e551784974449309b10e32fd4ca5222539ce0bc182356f6453e898e4754e1971a7ad596f61b3bab5b98e22ca0c4d8c4247edfaeac3082dad12d175afa6e0c0803122720c23e0a5a008e0c1ca7da2a575364bc0d96c9e65fc41e8703185bbf5885edf1313838bbf4be0b12909a9d7bd15796e1e34400da69fba5b65a27772c47bc8a81ddd2eb056e1def33817466457048e5c73164d846797ed3c7d8658318cc6fc63d64291bef5606ffe7af44261b45cc6d44180fa6c75f378227520237494e53cbcb34abca0a7b1361038d2d97502da7fb8901546557a99157f06f38c9505dce39b9a41acaedf51d627f2078765d0d46859010f281f2be433f413972d1466fa70d6008102e3523bbc0cff30099278e824b8d56157dab7ddf5d1ac3fde09e6943358f9e839a569146c1a00407c64d85ccfba118f193943968031b67d2ddaa5ea9d4cd59c8277889dbdccc714a18bde732547a9016c5c00198c8e7ec9d2c7bdaa4e5997fe18280c18a4d2bda2343862af74ea171b72743eb92be729c42f750f9fb9dc21bc4a3723d359a787b7c2c2eba0c89cc834c906cd162219ee80cf0aa498ea5c2b96e3c1e50176d62fb0eba86684128d781b11ccacb774c1d352364a2f46e431f525ed77100d67a052a11ba10ee0c4d2740e8b8180e8d7b073958c8e152064e11bc700e965153c7f97824b7c67e74a0a34348eba829c68956bbc13c74ed158f6f709117204ef6348e9858826b43bb7f6779d9b02e4a6b7c885eaf71feb099987635c8241a2c88552028c07278e39bbf82ccae2523a08dbb64545ee2b29528c5b866f6354a0c42553758d36fdc4a064e897d2ea01835360876767474bc04d78591317f3d473a62ecebf45b525756f75dcd1d7eb71ac4ae9d7b8984901972a74178dd6099565610c0b375a8221781a2a60d6c7d46264df7f95fa87dd2f3e0d5f2c68df1975aee4750ec99890c596c4ecfb945d59bced69f775498336ef1054b10143fc2d572c5ce07b12731bdd87290fc9c2fe464adf1080b23e6d24d3dc8ebea336154dc35d742fb206eda09c485b9183e0f30ffe39fdd53fb6e2f87454aef6cedb8b7f0a8a4d8faf3dda5109f05227bbd64db6659c13fc54de319219b89f61cb4677c221d2fae30aa2c7beed473472fe398dcb17a0b7425132aedb4e7128403effe4c0324ccf5aa6facf6d5db6f1437029f29317a6f0b11d0813dd024a2b6bc9aa9c3b6ceef1b55b41101b8f22957a362d570ff4ff28378d355821bd3e72e6506b06e3342a9671977b6837ef517d1c4ca1878b5feb1ff78bc3d86879e772edcc6b6ad51391a6907ce4de86068b38ab6e955d5f92b5d74265533543e15e1e4e1bd90ae713311c901201b9d21389398da8867bb38fb6a15afe37ebe2e36271a1a3dba0a7cce0b46aa7ce4eb14bf0d8f8da993e5495836fb4a7b0506ccabc97920b90cb530fc20812a87f94d8a662abae90f914ef00a6d9a9186cd9adc5ea9e01ed97c93f0e3b1bf600f124cb8dedaade83306a604fbfa0b1686e55ab256519627c7309ceaaedfd20ac520e7b8277b7fcc8580586f55aa13f7da3ee907bbc2c9deea5eefee4853c5d6c80fc5cf385576d8c97ad1044bfd8a0fd3887d8800889d5bcf782f835fc12a4d6a351a53fdbdf10774f7ef15df1a30516de4450c0afd5aed16734ad9d9de80eb72092ede00a5003799827d12eba77ea7b1721c2f62793189b7caabe297d186192c271321ba3b1671b43cb04fd5918124c38635f40fc0a91275a3777b6c0976c38766e66281e5bdb9dd8310a35b7ac25d6916d9f22ede703882a8c5a91e75bf163989ef330b9632f0767473feabfa3eb4344f0dccb97d550c6398ebf42d220f37bbd5b0049fc71626c987e131ea63c3275de87c4fe5992061055bc96c9462713d8a9240e69fb1aaa5bdb147c313bc5eb157395f1bce83fd9818d1da08e9e847ae41b11b4fa38e8fdf55c65939e24372e5451e5166fa7d604819d8a7c7fbe6f7d9b7867e72bbce6ecd5f5433b775c590ae7c680b2ebf90b9d91a5a05d3df5387b4a8b5b3df2048e5ff6a7ad6fed46ed9c1d3a11588ca81e391f0a03ce7aa01d9a4a274532554dea16fc4de3d06da62638b7153603c9ad8ab37a5ce5de8824b1e018ecd8109f8aec1561aa9da1b681b9cedfbbef05358f262c4fc21ef630c82cc8a681adb864518aa8cac0db502ff1b22033e9087ee874bae14479c8cb5db5ac116d976d7493495f7b4f75c0b0cc235078e55500ac803a56c6cb5ee7a67ef95aff6bc512e34920b04c7102ca1411f7dea172f1c45ebdde116cd7e20e6ba0ad10e5b1fd1a5cf593853a4fa5b00292a1c8ab7ddde47de7ac20246d24da768ca04ba2f39a07b115f6dde5cc9db9cc197f923ad97ca2c301aee9c83618ee9a25140b0b078274ca50b782a87a3b3c83c4c3b227441307e224cd34366d5455dad36b9f99834a7818ccbd58d578b51689e8b48a3b6905e71269da6708abd2548508f0d9587fe4210118128095c3efa08c7ee2dbd0b9e27054a0170fc92ae44f318ac87f2c21c0535b3f24f598d1f77009143c43b14fc10e18d993f2182e273837181f0e0a5035e83cb341f16b512e3b558f9085591a2fa5501d631b9e30ee70a1d10e7b7e620cdbaa5b14266b94d62812941edf2c62ad3d9cf4700199e0ae275afc95db83e3f19be9c06faf4ab8c220e3348bd7530ae563f7494a0d321f66600ecd7842d87f17e7a525ef309a4cdcbe6966e01d1697b9cc31340d89fcd8d37dcd5acaa27e5f925cbc354019a2bb6c19efa30654ba8e63d6756f941e59154b8

By default contact blocks are displayed on the Home page, however you can use them anywhere in the help center.

You can display contact blocks on the Home page using theme settings.

The following settings, found within the Contact blocks setting group, are available in the to use in every theme when customizing contact blocks:

Setting Description
Contact blocks style The style of contact blocks to display.
Contact blocks color The color palette used for contact blocks.
Contact blocks heading The heading to display above the contact blocks.
Contact blocks number The maximum number of contact blocks to display.
Contact blocks columns The maximum number of columns to display per row.
Contact blocks image height The height (in px) for contact block images.

Select a style from the Contact blocks style setting to have the contact blocks appear.

To display contact blocks on any page in the help center other than the Home page:

  1. Select the “Custom template” option from the Contact blocks style setting in the Contact blocks setting group to ensure that there’s not a conflict with an existing micro-template.

  2. Copy the HTML hook below into the position where you’d like the contact blocks to appear.

     <div class="contact-blocks" id="contact-blocks">
       <script type="text/javascript">
         ready(function() {
           Util.renderTemplate(document.getElementById('contact-blocks'), 'contact-blocks', Theme.contactBlocks);
         })
       </script>
     </div>
    
  3. Copy-and-paste your selected pattern micro-template into the bottom of the footer.hbs template.

The title, description, URL and image of each block is configurable through theme settings.

Custom actions

Using custom JavaScript on the page, it’s possible to have certain URLs (like those starting with a hash tag) trigger actions.

For example, if you wanted the Web Widget to be hidden by default and then revealed when a user clicks on the Chat with us block, you could configure the block’s URL to be #show-widget and then add something like the following custom JavaScript code to the Home page template (home_page.hbs):

<script type="text/javascript">

  // Shows the Zendesk Web Widget
  function showWebWidget(e) {
    zE('webWidget', 'show');
    e.preventDefault();
  }

  document.addEventListener("DOMContentLoaded", function() {
  
    // Hide the Zendesk Web Widget on page load
    zE('webWidget', 'hide');

    // Add the required event listeners
    var links = Array.prototype.slice.call(document.querySelectorAll('a[href="#show-widget"]'));
    links.forEach(function(a) {
      a.addEventListener('click', showWebWidget, false);
    });
  });
</script>

Related patterns

Article lists

Article lists

4 patterns

Content blocks

Content blocks

5 patterns

Custom blocks

Custom blocks

3 patterns