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
086656d315447fb3bfa1ccd4ae097a2e189e8f75e0f8c461ded2d5bef60793d9afbca543875d10b7455ab6646cf9bcdd9c2ec522df4a19645516a4dd5bed25d81f98051297269343651dbdcf6aa486ef1977ba6402bf5e5a752cadf1b8f7e7c550d26b08a380d1bf00acb8e75fa817f5fe00d124891a9cf16a9064802a84974e3ddfca121d1b80cce50a6f1d18b54b1c327922418b296902cb915c40d57272506d338cc6284e12160965526c77bd40ed6329f6f2d3110919e97c57a3ce06504e03625a39c69af2f62f2fe2eb0fe8f8f5bfda5ac62c5910d41e2e07876a18c9d31c280f8fa37c6ce1baba45f1532f2894319020d743c6649926441891943790342ed29a51a9002629e5e252d7a0a1725559c543e186ee4742ce13e60493299d3a16a5dc0002d0648a952138ca37af4284636479a8c227594068a45333b50cda7d325062f5108492b39bfce8df0df99622232c866562d7002a42d23a00860419f79ba52ffe6cf0a88b9738a4259178a031ae421a12d4de303ab305be76a10c91233f4531f8412e3d35de093adb9eb1f61ff781df0431fc35346780f9bf7b14e23b860af3497cdb187933c8868713525c2d8620a72fdb916fbc1614bd2236469784615ae8f224c95f994f90fc7a2b7e3bb3decb822139be6c13415383be6f7b4dbdd3a9d9c08c64a41a2852b0535c5420c190b0ded9cafeacdcd374a2d88073e0b4184e3e2fdb08343d1d18bd515ad93498b04c0fe8f6fa616edae871ee30ef3a9205fd0c717138542f9d1d39437dc234af73720a455618bdbb638cf040900f702344a0394ca0fde3266c5a26c81cf89483b46cb39aa9657268522a7fc1db86acfd8a04b6f797120de83b0bdc29b4f157ee046c71f9df2b0b65c89484ff28f0c58e2e6d2ed7f64b07c7db1493dfcc63619cc1ace33aa47341cdc0a12f00c3a0bc94a67b37a71cc904c66f2f4e3a34ecb72c6670053ceca532b18effa6dfe27ae6c07c2fd42f6a264db71d2930236c466690f371718927802237676fd1517bf31c09eb335c255df0325e861584885600e2e7fdbfa2759d50361aae829986f5e9e14bf01482ebd1e6d1fc705973c9a176dac0f845e91739a9de88fa413129ce71171c13da7a99e986ffd87ff010e9d11b12db05839b59cafbbc8212b954a1d76372a476f413caa0cc90945101fe8751919d32fc460ca41648258fd01f56ad652be480343372e9d810027a1cac7a823b7eaa2b07321a4222498626f421641b7a805e80ab4facc636d7980e88d028f257b8961e213901fe0e520c07c336371e503b598e6e48ba811a807c906434f242522ef6393f529e7e533bcf49fd0dfa661fa8b59f02d0431a7cf4719b41852e059631e9ebecb3511ee408d22671ddec8a1533e903519ab5d96c2796ea963fe1e1790465a0517d7a5beea6fee233bf0fcbf4ea2cca5ec66b0f598bfda029ac143d353a676a0c328aabe92c53b6871131c51b0d33fadf17023804def78cf0faa1a457dc9948a12d03d800f1a6fa632c4215905762408850d55268699a5f21c5f6cf44fad9f60b031c4ac7aafee738f6ac5da3acccb57c79ceefc15e084500c12e452afaeee1b39cf066d6bd12b3b9bfdbd6e5b7b2c1da641ebc69b8cd5f890868e35ffe86e3952e9a8ea17b87158d98ab0a100571989d03b85157b774e8b2dc86cc14c62ecf7c41d2fd041371c6d831af601f48e59c30ecaf1e7e99f267a715098c0e8332803c61d3c1af3541ddd91acb1a81213dd730f1e549cd26e22bf9ace48406292084ca10aae6e4733c498145ab99a65ad36286e5a38bfc1089ef425ef3a7ca22ddbe5030c81e98d9f77b46d2ab602655d34b9602e6890a39cb43b6dfbc74731d2636a9a6607a55cad4356fd41a20a40a4946efa7118db74124f2541e2ed0ff05816497c439d29a9bec126d549601a42e5bd16fd63903582b43edb827b2b7678ad10e56a5e9595da6eb3905ee7f731befc30af09465cc9b2d2a95bc20d61de63d4fbec5b6fa4d9092394136ab251dce8a61052004a2cfd5813e42deab85c8740305deea23e2810f1efdec4e9ad56a8a9f06b28bcee41f7330d02f4103c5baffe96d45fd6ff1fbc9b018c11913dd206cef25934492e247cf363c61b5284e34c4d2b1c8538749807e307fc006eb7fe1e9589060f8fdc7cddb8566213431bf1f030dfdb98fb5ecef146fcf856722e8938d4c40bd9f55682d84a8e53cbdde4ab0945a7a89aced63887008ac708603ee52f661c17e8077b3f8e8f5a53cdf0b18d3f9742d0027464c7607bbf4f4985a0665a107461ea43c1589a302b51dade34e87502599b2a9010d7981b5b2180946b59f438bb7d28e7ff4b547a40750aac4aaf9b8a76a87422d913ca4cd4efc1c39a7fad588fc8ac1cde491c4d921302a51f991bdf2b9d685c2535c80ef512effea3453a85a0e3662753814fbb9688954525558b6ea6a3af78bfbc50bc7da3d7cf9b150b84794c0d742994dce150ec11d528cc242780705d5eea6f3b12e581f289e00d0defd3599d32de4cf87df6ca7992e8809a1cbebbf8d84832ab23e1e529c2a86c3ee05629d12e108647e26d27ec5acd44cfdaeb2ed06873ce469a50b31f5782ce56457c10105be61e0a60e4703e309618741f082caa88c465310135edbdcee82db7d5f4404bbe7d13c13a08ef7f4307f4073c4202a50389a9737c80bf377dfc67764514c62576145bf945ceb38d553918a78f55d45990914f2f298785b0b5c8b7ce0aa7f3271f4f83f81345cdb4429b82c7360c1be5d30dcb787f274c9cee781215bfecb6cd43613b3b293c4857722acef1a52321d473c8cf3ac95926cf4d2cf37afba75da3de34b0d1c7175a4c5e2eaf1f11f7de2baaf207fa74b949105dffbf354469d3778e44d45691b8a0afe21a3cef6cf17d566d96f9da651cd78234c96d75fa0d199850810d181f9e5f924e996d168fb383caed7f8ea6d193abeb3cbfb5b26dbcfa3eb2b4d1a3bb39f1ac104d873c95b248cc02e5f04958cb2e6bd4552fd367912ebb2f94d77c6227290a6d71716ae552c4b9c58ea7991836f27b4f223f736c959d14822205f56b19ffe9ba895a3267ca2cb5acae25b0a56f1eee7e2d71a3a33975cdf28cfef8ef9ec8d7c5c8f095e94ebdf05593873c00287acfbe88ad71cdb2b667434852cde56b37932fedf33912bb6a12e27a7b806a375cf6b2884e60d12a04614258d7af438fa7157bf7564c1672972b6344c4170ebbfb0b1b314464eaf8a22f1f7465d2805bd4651ea0dee099940b46047f03527bfabffa27d09f940247a694a47b859c320484f1ced12f3ba33104b48077fc5cee55b22e2bc3ee34e0a0130614989d7fdd0076d6791760bc91e40ece6204bfc014d1b42c0622767c3e9bfcbfe6cb33d5076b8bfa5723bffc22cefb79d34806e49c484a24315837d490985f72d2e789dedd01db9e55650074d33e0f14ba58df423400e74786da054985068b770888004efcc1b37ee2002fe7a0bc3ced2280ccf7e7f745af80d30c3c75368c1e940961bf759136caf6438c27d50c45842a9858d9b33fcc63fbbc863eec04a8151b0ec1d1e3882f00175636cf74e64b2e3827e7edda39a25efd54ce3fbc9246aa381b6db73f9b8c84ccd938b4aba9b43a2a3b34da25ecaeaa3e933d125ad2462de386f15513baf7f827346c85e8bb44d8817b56db2a0410121e433ab3a735896954ec39ba7e41905bfe4f922c9c9a86a2019d7d9a18bc38e3a377157ef2c39dfb1da7cebb898c966d09a15bd15f6af95b0c41244e43de74c1549725ca5978fff544b8788d2ed9b62c2c775286cd5ecdf1ddb109477a3f14db8dcd486dc1cf021c741882f4b55babf8efe019a0bd29198cdf156a12c49df631a9f4a500c940fb8d2249488ab66d4a35687ac29f29ea14b4722126a1b4d889b87c1c1e43b054b390c2bae329ee4426d91548e373cabf425daaccb333be4251b1903efa815e3d938f294e8d076dddc2072b3132f8b5b3a92b0f32d8663c4103c6020b208e757ae0f297f6d75ea225c85cac64774a2614463deb9d761878076694c39dc980081f32119779a1a8d8cb3ae60259780d524441bc562c278ad6a56b319a63a784301dea6e019df8333257a637a33440e347bc44bf0178fc3a63683b56b2e2cfc803ee3e2368880558dffa5746f55cdccdd2e5ee9b27f266cb245f6b393df1178116220a8ad6acf6fc782c38d436d1bd67353486b543d17fbb6b00be7645fe84e2cd03c2d1fcccd217739c8b474a5691cf8963f72729b0b1826392e33aedcfd69f5d281665e56c97e3b5d0cd1db76308e192460de2fbb9fafd875a578a988d134e10c106613ab1c5e13050197688bb97718f7a7dab295562d257c1076e8a1048795be6d311a2ec4cf29978961f279c35daa23cb52dc951111e596ae4c878bcfa9d350324cd13843ef4ed1a0605d376b7b4ba2358499bf940a6c66b853d0ffef9bbfe5b7e82f26c117c243041383dbce33bf0b7873631efa6a4a17f17acc4b4756b11f6e98cc8826553401fd62d938a5381e253ff359d0813b809f217bd1b1946a59e3b3f5e8ebcd0f250612fcac317ec4e488e55467f52d2e34359c16a07cdc5441167c3e63d433d1a56a259ba00ec1d696374d30c350055679c132c2bd8508e887ceb5ef1f94243967622d31a1c46ff7623d4a8b7fa56dfaf241cb0b1fa51b33c455cda3e2fd54978beac38180895e1e2869b88a657b6c382e3485c395a95457f50bde18b8314dffae3d460f4dc50c066577b60e52ddb90f4f4531659fa23b00adfcc63af3060ba88d738b157077e0e8b299ff8e3ae3ae1998a60d2e91b56731b13ce3bdea8fa302a72967739e94db5416984ce422f90d09c7f93dbcea8d388bcd363fa1f7dbd5da8bd606839c79be4b4e9b0df9faba532f2861bc4b79f82819b299c15618800ab688ed4ae4d13bc982566d1c3dac75f855c6d1ff8209646743c2c6a5f0e4a21a3153aa5234a73100084ff85393319742b953339314682bba433b7a506fc620eb66fbe985f92deea76730845a484e263896630134475591708a5a554c60dcba8d925c374aa15ead0807b0c6e6b23d42c71308fc418288b48e88327177c3524d9c290cbeb330125edea6fee19c5ce96e93f9bd94d03d19328224e75454f8e2ca51f08b27ebbc76a33ccd488cda926bd7a90283769bf85a9ba8f70eefdae4b6e86191b2089c70f3d63109d510e707d9aee3de7c22f92c884c885c28c25eddde2b353d8ba6f244c74356711cea933e3207022c81b9c92c04c92f856cba32d5b88341987a65c9f2e6a502c85d7b0a1dbb3e23f173a362c408bbaf8e157cba9cfd298b978098608135e0d4626eefdf2a1e084262dc81f4ba9c4bcdb072e0b8a5d3a51fbdbc5f1f45e5440c283472db16186bad89a0ec10fd03428c229e5c230ad8c7fe01292380f5fb6fd9c9581e1c760d0ace6d9743498bb0f8bda56b00d27780b6b78905c80d80175e7d5f7fa40b2ea181a75f96c553d430b3150e7cd83dfa2457ddc63b6198a380ae18abe2abbad52c498d65bf9a9ad26b9aa991d83d9a4677d1d73ed6b1dba6ca4a86e0ea189691d8b6b82d60cbed3e4d3fcc6e883ab7a95fd67de76924a2fe3b3a36d4c3eb08941cc168b2d0c99d03bf6cffe034812592ba904a03d8f76e6d82b5c658514ed9881674d1e1ee281caa30c818d3e71dba255d11fd6b3049d5571a2352bf93afc099ca85eb7d73212878276a78d361a52eefdb313f67974d5b4c2f07eaa3de5cfe59cc9ef2f7f128d23436868b8c4302264fa10d0cae639af4a5345e327da4eec50f42ee253844956930a9bb9caa0154b8b7
Centered contact blocks
View code
1b704142a147b88527fb92d065f50e635868da39c947698688fac28d110834ab6ba4e53db13f54dbfb8134af48f850277093e7864cacecd6a8a524abebfdaba2e805a693e06be14fe66735b0b1d26cac923b30812d3f7ba8674d7e2001e4fc5d3f925701fd64b0f6e9e77bc6b9f53fe110e01d9e8c3b817287846571f6f06e008aa52adf83f19524857677c707bda1342e7f02d94034d8315301cf1feed85f6d4d9ac2beea113bb19ac3523f93d987818e36c3d8d883a3fe7dac609a9b4566aabb61891b2bc8c8921db0e5942fbd90499082ae89ccf68df3ce5618aadd9aba61980d387a3cf081177e2b8e3710de5f738dd2c30fbd34c09313d49661740481e0e9e04030fbdc7fcc380d85593a9e8accc70191abdf6353fadcf695cd9b40b52b878fb04ab90f34ff226a1ab1cfd7f46938ee6e421c6294a1a582e7fc1805870c9cfb2999181ab1564b03478698254e81f31a3ed4552be774bb5bd3b37eb036bd571e1cc0ed5ee2be5a4d7e0cb215bab0d50cb13b762ad51fffe26f4d8b518cd0f5e203e1ac98efad992a02953803e6886c259ae8aede2aa767ded40bf4021b0906bc214c49048e8c6d6f0d27579608e190d498e8e2d10a60214a5eaf6df4bef3a345aa6d5503b756d5af5a0a5704ea7f019285bc9bb3a8197cc139d8e8920de5df8b444793ed521d33fb9fae2429fab8cde0688514099c824510d3ff261498d5502f81238ebbba74443f91559df92f56bc0af30a60a4b6b36d9fc0d988cc1fc8d24468d818d8daa78da5763aec575b0912ad9f720ee12eba252e526ec88027451c116313fe345608f8c466c18d9bc0c6cc4582c39df5429865cc985ed860cff5b45303aa20feeb81e7e25c626b8d7fed875ee28a9ed68acd0f0171b3715b00fb8396d745b6b875e3472a9de1ce50d52270207006ccbc86f5824c67f2728572fd8a39dcac104fa39e50b694b46c85eac0397d1cccd7f894490713b986e9284e4e98671332af453eb2f4b1eee83ddb33f50bc1f2662098656215215a9391a9fb74e3dfe89f35dfeca16977d6301f168ccfbe7ef5b50751bb81cd0c63de3ee985aaa74269911d66cc7e81929986aabb62f72bd701e2f58eee7cedb07514d3462084a26da8ef82d77c76d7567952454a8bf0773ca79bd41a5e219746965fb48b3d5fca4dbf25b9ff0f7b1ec973f12c32a30fb94a1726e6d87c7cb4645a247c5fcd9b3a3c49da79ac06b2deebf966d10d22fb7935db8f215b75d898830a1f0e65795b552f3197fa459dfb71272a7498f57f2388a1fe7bf9940361434907f817172e45c57d260acad1e6c7353b1ef61e17403ed42ad17df40f3a962a86c3e35713a26f5c415516aa20d7224026c1436f7c355576fc54fede6a73c0f1263d2a8c691cbddb17a0425cefc08956a662e0abab8c5d11da12f98a1c326eed56cccfd085493f318182d3ecbef740603f74259f510d2e5226a61d9621b1748bd85768994b6b8afe333a6f150da41771d80bd15e02de24596f7683286273296f8061b2048fca48998062a3174e9e99e55df871def1d9e97b3195244c72be88328e23becc725fa79636be313524b2c1535e94dceecec7f2b6d4a2f314748af97e523376bd230b9e6c2d83e97db2803d594f20397f69d7897d595a03c05c8e66c1cc11b61fe67e9bfb3a4ab228576238464667d6e9b08da0b036147686e3d2f524abff14fd73e483edb8ef9fd8086102e5a08543bd7165dd679fdbc797d28ee05130eaab4587f76adfe1d85290204f45c939c3c806a3ebf9a69675f7882a4d4348203c8cba577abe69514b94053ae29e9ce5d3103f4a66d4e8feae41c0e2cb10546aa44b9ff3e81cfb8fc9d9fea84aae9a0e9e9c25eccf909e052e6c273175880072399eaac7ff38f935a485c1d00e1d0615065541b787439df7558003098a5446c03f169ff7350dcd2c166e5705697fb78b5180ddce9b82753fcbdd472211dd8a982c3f06d52bca6fbb75ebf17b31eea8a2aa49bbd2d9f2e429a77547cfbf220ad479d6b00e05ad88bd9966b84da5fe5624033b0e7f9e544cb4c9c79bbf70f5a2683c095348b4c71ed85684f4cdab630a9e109bd04a3510633fd1533bc8d502b77431a51c16cc74f1d724e4c82f90e96b150fd1f918c57a61985044228cf145fe4a9a6e7e0d0b8bd0aa2fc8c013bd0663a68c92e07b66320e6f7e9cf0075afa8e28441feb4c46da6644e9fd32540ec89586e0d4a664896a57b9aa242cec408a88689789c6dc44c2b61c234afa99027b6539ac48407f61fe0b8fccf4360a98360a805b7ca2b9dc3d1015f8c1a70afe4fff5891de04767abdbc031db7cc7d3df16812195e812febe6e8c36f45544053b9886c7a497431c52e11656d05e753c163451a8b872f01dcb72c08af4985a597e38b3631aeb7210e9b62612cefd149279b158fbc8c67a9646253882d08a7916014ea6a0bc9d83d2aaa4b32d92cb4332bd35871bbb0da1d07ef395ccf5d5cbf173cb2ef9e15b2912479a26f93e20aa8f573631d6da078b0284ea7189f199061d48f7e1cacac50646e7ceb2a7c866c2e9d1f61537a4fa33ae4ede7e0b1ca80b88cb8c0c0fc7e8fe9c2a4dc4935a69f9c74b52054664d3f4947b19e75d04cc85d0a4251647d954b24547950c50fb9c70269ecae5375e6d079d19392ba218b12b184cc0349828da64d7fffe295eb49e429e31b97d96689a949e81d3886914c701100a05f080833acf30aadac7c72d2e3dbb266a15948c53035b5f0a556cbc9d91b2e18740f9b926a41b77389f0e5922cfda2d2e2dde28c8eae3212f507cc5a919c2243b67e2b9635035504aa52c3f5fd61e8bce7a062273c4a4b663bca6b28555990309b2a44b9d9c58ac3b6d4723d1c83b239dbea0dfb5818bc7f44bc69c90aacbf430fca90eee44c7e04766c4ec6a5621be17ec853b70405e9eaea7fc6126d4e84d3b2785d58d65c1c0ac7387e58a92821fcf6a88774b47ade5a17316a701b0f7d5570a2a86944d042211028fa45677e369bf6d222c0f8da1d5aec2bcc117c54b24dcdfd8313fa7e9a68bf9042cf74e3a52a19f2ba8975f0eb709ba88062a3a71ec2c7c4282b5eeff2aac5bb669cb60ceff179f8a1a6afbab41541643f3d8e04dec7da0abf290cf739cda2710a04a810df37201c03687ae5fcaf8e4cc507a94f3958bf73815f83e777b66a66bffb899e587cee40087b888c609c5ba192699e1280770bc415188f82fcf17683856498c2034fe5489350f4a39dcbc48f4e4af3f35e941261b92cabbc051ceb665ad9d1240ead89d0510696a3e90edd87252219c1a2af0c41b639413d12b9e0e55ff897aa936a1c266e5c42cac0621a915304fc25e37d67b87e957f6a5df7c3f09be9f99a3c1e6bfa68569884e255e873f5256d981513cccfebb4258588d90209d653fc7feebd11a31050bac709d847f03ddc2e4c4543296b06339b87421f08a09a3c91009076d307f6f8e2caa544e919470090877f3d3079f679c7b6ceea161858b9381d059166edebaf200ddde04baa86667b6a0801aa457c7db2e7fb464b870164cf355b542a8d8ba72908a4a9e70334e5534de048a861a6339635c8826c0c074d440907ec4a7f78bdc819ad7ea5ac9f908d1eca9e1c4bdfd64f269dd884b2a25d368e1cc37b74101b49a3545fa094e46a4a889d1d408dcb31b45f11ae6faec48c8b81b5d5aee29e53358749a1508fe83e538155f8869362fbca866a77f0ff301edbf1818a2009897ea61a0bea27435711ca9aa1885ebbe5f3ecd8504f10c66729fafc8170aa7cf233649b4451872304f76d258df4172acfff51149665241e0d2d0514e80c2985acb81d1e889e360f690fdfcd4694888117812634971e9ef32b22cd6489b217567aa18185e136c03420f92c3a3e4f1b522cd6201b25c8fa76a12aabb9210dd079c2e8c45fcd31b6ecfd994df76800f34de88f58353076fe4120053b6e7952c0f730e1083d3e3d80d12f6c053e8f72b43623d4d590dd68d3515b0d974758edfb3510346d52bc97e213e181e43428ac5122aca5ecac68fcb75ebd9dfa375dda1b9c64c3d65e804622c77c64ed646f0bdaadc0f51fbad2b2773a0f382b5487da672be154fcd17a21a7ac0342570166d30c1b7c7b0bd8d3b66941275935c2130b24100c185b460b7fe36988605c824f1563b9c2b7df6509ddf7f38cf81e326948049f481c6c28a301d8019ce2a91529fe95d82692555868ce83cd9b1934de44d5b1019c653d36d0395ef7b3928d50e8ce30f1595170dce72e9f6288181f7b122bc35e0bed4be70aef912f175afaca6856b5d8a4cc2172c7f4b43de637172d8e06637c22462baf75063bdd499d6742a7ba737d824a0a471d8daebcbef4718d89d03f688a0e789f05d6a882282c3fb4b3b8942c31d0bd836782ac1be4ccbc12e252e0ea91d122741be84bebda2f5e774c47c180592b9b8bbd50667980646560294cdf05ce1ebf5212d1fa1bdabce5217e6ae07ae3280ef477c1fbc9755c064d51324483b5ae28164da036ff9ec5e7efdee6c582e21f87d7806a9788f88e178ab08b3f7194265f06279629531ae43eec0c97b0a480702d1e2942813980a947184c21073aa8cf8181b326101ba0c95f88a6ad6789bcdfad15adcbf285b98d1539d010b7a7fa28c7b19eec9ceb07ce8793e1534e536d0981aae0685ebbc488d299d3aff9c4dcd85d12e1685220c70632dc7bd7858b618d7b26688ad74eb9296bbd6d956b06a239fa2bc13f2d1d9f7633facd3bbd29892d290960b76ba6fd21d9e62792456040dbb2fa25ac5cbc8d40234b1d2faada7d9470b4f4f5866cce37d3808c2d7e7bc5feb3745b99d3c55e7f89c67a344df72375ba5229a0ab2ea8eec9378d033f044bc2b78f3cad5a071ff202887287489c470c9cbc562972387410056f0790fac9781d4e29a2917ee3c8e678c5c6b76c21e8526c814966c6ec97ce81673c26b559f3b70a9887ed2df757adc6228af2e9daebb2fe4a1a56f26d32751c61162d04966d00ee241b290f71b2578781b88edd6ab7c061329c22c2f923578a71f05427993df40b8e5b7214d39241f76dbc54fed1b52361b32d2525481b578721c57f561f01a7379d6c3c17b484e389869348d1e19c6749e7a31e3f5e0001c20a1d830fd3a3958f7a585a9d0492a6bf1ea1d0f3593f34a43aabb02b5ea044011d52b9f2477547850e2e8016494c0ec56982a1a60a51a80791b6318ab56301f6910d1641054cf8a147bfae21d21930752b148795621c126f353481f94d9b10b7f75d2926860bc094f7794bbd45f2e8654ca09f1f47a01c88ddf4889bd5ebce2e5d3145ea2f916f5fb661d1696abc7f6124310fc2744519e42fb18b21837a40734dbbad368d6d4395f659eb17bf9ff841f472362050ecce86fc1145dc4454589d20fbb4cf477ecb08d70e156a72ae2ddead3e711ea8974bbdc64c36c4c1828712a533a61713d2f3566514a11033e884d095d789a8a7177f387b79a906b613648f839bb70043478457b95fef52624b47a49772ce5b862672aa2313dfad6d136077e99abd0369940a365ad86ea025183a56b2d6f5b1b9aacb5c8c0198df13f827e3fb9ab8d0ee492b8d086fcd7cd63cb0a481f1097e84f4b6223339312140ecfca28edd4fd40d7b6bf37649b25bdece00687e635fd0b0e490c3e425d4d99ad859cca2fd5c77d5b253055ca7709ae624a3ca7332a8498b4bcbef7f7832acce162c2125c4153767478af89aa90d9e889b2a798aa45f4b661a9e086cd1b13aba95e6af6e6f77ece59983de772c3d77344c6f18ddd63705b4bdfed7c40da25dda5925054529b2c081a95ea2850d02
Blocks in bordered columns
View code
cc7f87bbb927bda972168f035e927ad5d382ee287dd311bfd68c8a28f89688dea2538915239caa469b1837cc860338ea5e05752411de4ff6c9f5a5e5d7bcf97425533ec3380ead82e514716a13446cb35d68175de76a71f3bcb56bab5a534423791830eeb2950a9c2d30119208b693b589a83b18101d973fe8aef94a9ffa463fac209ff36bad55cbf848217daead3f5bedc392b32e131aad4f33fe339f96d4e49b54a63ed5b1a714e0cd0b24d3b708a1f3bb24f6626732e11c84d8d7a7a1892868e51a555fb597480c4d81e00a30ac4157dfeda4f3206958ea9b55f0df32aa253b42cc41e904a7c67bb8e36aa87fa67ae782743566a33fe3ebfa878cc3ad94186b402e875049e497197012adb600ff0c9f2dd387b080a7a763321c16ad77657c840f0a3c306051966363d69131234478e46be4e53326fde5ac509c15385fa983b2b2a3c5874607e7fdc5319e1deed12ff9d64a61ea31516151a1c76ad5239a320cbb0ac885ed10953ed5b8598cb78831da1f452c313b422fa392bd6a8e3efa9c4ca3eed2e4c968faec8e87a7030ce4c6a3b1a623c4758bf3e2e2a37edaa9c2820c362dd156164e6723cebf8ed2410f42d7f81c3f4af8772c79d5724a4bd082bbb06f83129605b6ab91c1d8b6572831d31f4515cc8401dfc5c3444c8a7ec5d1fcdd67e1d9a510d61e35dde0faae8bafbbdfd8b7067dc9ba6c469068cac4d26f81a6089aacc68c785236fd38a406420dc44118a66e2857224e1f0d3f285597fda8ff29a70bef4dd9d5bee3daf22aa788aa125d4e643e2cfe22dbe82ed2192a6e0adcf8345d61ed6558b3a859356a07532a2bcb812871e3b1617e9ad8f3bd70792e65b0b7401144cbd0496a3ff198cc8653d13848236c18848e2d2e90254112c4aecccc22464ac42bd8d4a382d0962c36bbc677cc801c6e74a085b3c6f3facdb6d335665fee8fd5a1bc2000d70d9bc014ac7c31772fdd0a7cc8eb2a5dad3c582b74e58860c9ac1e22ed1a08ba4350f5e8b90d1ab2604f036592f9efdbaf13678970465527e558b1959a5ebca3aaba5fa960c756217f8068e39d00eee8dcaee8ee9e0c7383be3547e5eaa47c623ac734ede9bee095020312c9b9947a43550a1052531b55b2b4457cdb0a86fc2251cbb845170cd36a76c220d9bb4af8a7cc007f8686a6a9c7845eeaafb0e3ad858d632d04c9645b7ed5320d81c0f9dc23000df4f74df0a54cef108d8e72a56eca0f175fbd6095b85808b0b6e129065eceea598f609e54ba73c1bd79b073484cd222a5518b3b84e3be9ccf61b4abfd2ffa75cb73161743aa96f22b74f5721f7a8bb4a6e5b024f861489ee37e98d9645d3d08c8d524f4a96900033c0bb9d439c1654e0becaf23d524e048ffa150134ef6b869981d40ff67f894e96d092a8e8a85d46327fcfa42adcba80b3d86805ddc92befe8dbb4c18055057522b3b9875cdf1c61b0a68487b3b2a6ce893e6d993025fce2aec2d6fcc51684cc30d9bf083749bbcf4a6194e5e577fd956748e9ab380dca12aec0d28cca5b84c58d5ed0801939686023fa135ff512b08adc5ea39a05a7cc74e086fd293684b407be3ee333ef3be9f520806a547869b2d7c1295dec281af7191017da6c78f6c260f50ba32fe642cb79846b77f5d0f72f93b14390c938d82b5e207b7792514447a0a2bf991c0fa1e6194729615a1b692771d4a40aa23f8373ea6f8b819fb347469ba0399022c236da68152f85f738229378a7e740f7cefacd2cc907c9a0e23f45d4cf99ae00283347fad67ed0b8f63c7b973fee871d76439b536f25fb7e368ae1ec31c406e9ab68b3e7c759791e2a63faf0f835787dc99364fdb00678c08a9826a78dc61f26132967f136fb7006aad233e8786bbce37cc92d4e40b029de1495ed3fa8326f942283c3949efa2c80b79cdd69f48f384ae21d81da187fa6bde1b7f384a960c8550678b4e568385d71b42cd3abd92062c5e5a49f0868e1e9483f6f8b6ac84630a9312eadc2d1ffb3b2b62e0a703280422b82f06c1f71b9fda6c0b54a22354ee2f8af6ac28a8238eb1098c666eea0973c6ed9d160a97cbadca2bf920e6eb39c3e358b3b054758aa1fb42e2fbb9c9f03b54f548bb6df021859d4c0730762e3dfb742a057cdc211b6d18b04ccb40ac3a87efa2f54c8af0c2a5da54230ecda174b49d720b35d6c31660aa7b8a7c5d0902dfa1685ca4fb4f9d7144b16e8502cde09a108a3266af6b1fb92fa047e58ad9ef30964f694b1a9333a1f8854e9ea40b38f807e3e49b2cb5852ed1e62229057d065aed66550325987516d001abf51136de8ea90144023331e1f31f781e02ef9b4a9a9ad9a37b403839c1079c55d81fbe5ca43e6b6d29f81c465ab299bbd98b446260fa53d36e337ddec8ce5bf3c6f8dbf58b7c2f39c2d90ed1a52d4582bd812eefe823898a106a5ce2e190e1cd017cc0688778102462a88a5f7743270c12fbb3b1c3b8e3a37041130e07dff2cb6e80e62acacacf6d48a40ed976c032c731935fffe0dfecab6d94c34865d63b82b88d96d3d7e1dbc94803d5ae0055b49a975633e52bb8be5f771c0444f57b7ee2d3d1d84b6f93f85c7511c252c83b442f2666079d9f4bffced3fde697365ce7125151224c2f85588e963ac78ae388388f36c69b36bc42240f7567e1048ed0e99f20f759d687387143c891ddaf0e098c7af76c5eee3853972479c5906d0800013860e721eda8990bbd32a96d25785a08deb9f2275c4a534cc79649ee1d653027b2a8bf3d2ff5f38b5302151d988f22a1fe1861eb9b1b07331af951aba57c3c46de4a45a8fae236461206a78671ac5a284b0b4e6554a8febe53850bafac96ff2f6a277a4af20b20e1087a9af37e51046d701febb1f0b27338554c224d5438b4af2a1c4c5865d7500f74fffe4171ea877292ddd1022ca297ea7c2b400df229a39d7237b6da159e565c422a1e6ee78c3cafee6322ceb910d2ee75eca3b020acc28ef321adbdf5f4286bc8e68bb2b7f1d5d24dfe9ad45ee2b1cef64872bb55f302ae7ead3b3d8fc9bdee2ddc1cec0b0b9f2ef72c9e7ad31106f44c390a13759ede3b7d73eab6b3be92adfb17ea3224d09196e4f7a42a62a337db91026382f850c64b40bd27f15cfa65f1836e06f9112c90396c52e7fa99ceafab73bb550e0d4740bc526d6943bf7206f032042580c5ef1bc06bfe366a4e821e775ecb3cb2c0fa2f80636ed1304d9b750a7465ff1feac212038a3786d626817339e237c384e1d2dc658f11a2d24db382521cc4472f4cee102d786c0a627b6bcabb99ca2823396c8b67cc337ac6270afd3f1d253f09ed283d02576335d409ee36b7b291d7f6a380a90cb678847a55268b708e9a3853e991b5bb753ffaec7c794566db9d9a6b0d35dbabf05c68526c518cf47d65170254be001e0cdc623eeb2be21b4149f3c7c89fd067a574e77c9edfd7c58a275a3f6a44a36974e28c8f9e542f97440fa4d18fb099d54413c835d91b31341e8fe7cfdea41f225ebccdbc77a62b7129d53cc01f16c90e21a723706a7441e4a6d3d8455401abf6ed33138c9159da06e12308e66f76a4d778614c3ee4370c449deb30979a8304bf98d968123beb11ce131fa81fdfde237e338afb1f59e413b13b1987354cfc0037435a71c55ad5ec7f050ae7626d7d036d9bde0f9e253c6d369e744cf8c56abb5477fe141b273bf17cca12b7fe77bac4ea8709be06e92c08d27846a55c90d3923e46e4ac5732a93b587bf3d2421d86fec7ccaea2a0704ddd457f78a686a86c64cae925bba7206944902262d5800403f62b574d360074378af8c50ef8c2661325facd32e417aa89f0d9c72a8fe35b91115516af2534019e3be2b66e5d4a09833a1be0803591bcbe54c6e259e0177785325f5f8a79b834dfdf331c699cee1f43a8d931243aa1ceb86ae7b93ee84b5f2567430e23304f9fa8acfd69866495f1ba122eef0e5719e5d99180a3b49aae4a8e3e576d89fcbeda6b53a48482e85486160c4504ce48f22f54045b3b327b4c80fc2be9b21115d52f8b27b9efacaa0d2ffce29119a159db7efc763b1e182b02d9ce0baf3bd5c0119127f019745a4a2f6fcf0f6bc6f7dcb0765078cd4b459b973e4501d15b5329b500e8bf3381676350e7f424f2535481327f91e8f958ca21a8ee5e3def3da390f00f189d37ad260e7007125c21c40d449c38d7365868332046fe2a95dcbe58f923e1747802c6f0e83d628e6468a8480d0ef40ae8879d0abbfcf1ffc5f9fba154493e390196dedf9c5ae4b6c2c6b28a182aa6864c206dfe645e1e8fc231e8df7d74e0de975c761b7ef53b6c0973c56657e5670496adb971a7a833c123b576073a6287a822e05f8196b8fee6ca257d85cbf8e224a0874791655bb71ec276a75842c746ee807fbcb8aab88fbc6f2b2dacc970223472418c5d61c3a132077a4e382de09472f91414b3ab63cb978b52a737d90ea020111c10d7934c345144566945e5a0c0d5f9410b289013de419811ce19a42899a44fbb994d6476f2db2bcc421f28e4fa09e1eacacf6c5d9bda9399adcdab6561ffec97e0bc423535b3c4f5e720ab9f70216d33d88d0ffcc7bee4a12f994342aa17fafc6745b113dfb5ec441ba78c161952e99991a5d11c16c03e5cf62fc5e45341ad3369bc098053b85c6c4609a93fdb983c7d45d4ebcd7b0e36b9f8215b442fb48d5059ae1fdf0ea50998b93e5d56a33241b303c6d072f13d0968969f8e2b8fbcbc812650bd1b78449fcf2f18eea748eabc85c05426d0003d999391bde34a37930f21b3f21768dfdb9ad307ad77780dd28a697b01e91b807b8569c00b844c341f5a7ce1b8f39f40d403a0ee483ca77c044e414fb7f853cf1fa9df8708418a9696787a024539161baa2cbbabe632cc0eb1da379b608394d55f5bbed16eff56d5529f737b00c39393caf5aad884b5dda4670fcb354077db0303e82705178d266fcc42b0e38a130706f83555d320efb7e13e2ffe4c669569cb84a660fecccdc8ab0d7ae20b7f8515fa6721f957c25f43f48efe1bb6221b0a021431f288e93c7eaddb75ffb1d9ff7df50560d71c05648b6491a6c7072e7ffe9f335661e92db3956c19a4ad17e72b74d9d2ff9491fd0f236422cf6c377b6191b587454ff064c488b8a2d57003b604df65ea6ccbf6369db5b90d5250c308eeed0805935e70bf95b6ca160456179e27544cb6f7b8ea417bf48d97378ec13c50311dd063c7db34be6dea7a2e99010a39a63927bcee0bb95e94d75210b12c75448a28ce7ff057e411987ae2872e616d2043335be87b925e90c15faf7ae3163c1b8441b03783d4d2f4a3acfeb6803139d4d24cbb11bc218e8a6904de548586213f66e8f88f3ae74954169b8c7bf0b41e7aac25c53bd59f7a9b12286efc21770b44c238b3726f9419d1d892b5e6b33557dfbb8d227a3321e3c1ccd7886a6aa35bdb3ebbb09dae8f539fe0a40507dced8135ac80fc6bec446155a29ac807688cfe20c02cbb71796559da0a4c1053072efda1784107519b82a150786538fa607c5481825b9c651628ab9d7c995719a077f59f966e7c9a9cc90d99652b89e28c0c77865427aa0dbb61b864bccc7c31a9f3c7df0dcfda1abe579735c009ef9ce8a680afb4bc9c078114df8fe6ac5890a588ae525321a4c38d4ca27286d55eb540bc80131e0ebdfcd350c5c244126fae989813ad96c3f075cc

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