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 a8a9ecce8b868e2c4f215194a097d0aaed25d76cb6f98e5dd29e40f179471151d4deab4f268c930c6997e0030414fca83d6f547c003eab23e3fc6434f6635d20f10f5ee28f5991d2bea62531ec07735699f4bf03669e046af881d11bcbd0d2b6a52354f2fa6d0626470418fcd3e29c61d2a915fd32e21ed98bf63cc1ca46625e8295c411acb5e30ecc85ac09234c436bae76280add08e98530302b69feb4c9468d4e7d6d7206a2bd049c4bed170f150f135dba8393cf743fa7d3be6c954aa9820ca76891a92b07dda46acbe1ca3044639d4ac2d9cbeace2e83439172afba32e667e148947956874ee035794e1a050af4e7bc03ba8bf6b7c424287f8fa741b68dee08e841a6a1297f4ca8d56eed814bdb52b719b17fb6fe284dc366c29424cb8bc37573b374e687e188fd81448bdafee717ed3bbd03057b0120339920c75c86194b072d0854b0236aaa3b1945f31d57e99aaed6b5b9d7a0c37e71a64fd266e80ad18c7f533d75c06b22707db6a13559cb79cc18146835ecacf9729e31924dcb0b4032411979198e8324941a1814adcda2f0ce59e73420d1904bc47a585602654d0dbe8045f5549a532434f72a179228fb3e783ca4ecd9f287f049c711fcee8a6c5c2ca318bad1592a5196c83ff715f6b500e97518d9d17b48cbb7d011a81cec46be06cff09169f2c3cf1a347e8cd1d634613e035bc134c22da2c570171e23b52c3b9c7ef0f711329783f57ad750738ffb0ade084e6b43b61fe05c81b9fb7a0d463c5f700e97e30558ce2aea330e9308a8b4dc79d2c907216bbe6a2666fea2d97435bb782b077ceff17b757a6ce8a7b634014b0c036a29e63340a3868c12d73fad068e26171cba1593f1eb5f9c82ecaf84c6b076f1964a72a787df5f0a3bd33e6a85da467d01711233d3a40f79198713059282a92076378bb3e593b7275707b4af08550d929a4ceb93c0b0bea800262be1ce7da03a81dc3558d29ccbce44b2640ce464e3ba442dd3742c209f3e023f47e501bb83f48112ac073e95878d030e85502c79a924d382976e5d786ee876a45d3b29dafb54641f3942a645fe5bc5193fb51d06e2e2e3bae9c223a77cf3fa1eb3dc63cbed48d4b4778519bc39235d280de5cd22b57e50407a564769fbfbdbaf6b111424aad35b8999a166f846d02935b50578abf377be526e83128c97fd5d686b69f151aee4653a19715ce2f9dce67378348cd4e68e492123ce4e5a72fe169d6b73984ef7853a4d22a2c832e7097360673a2db478cee4fe26840d23d5d566953f0a124e5ace989768e0bcb99cde131b2c62ebc977bc77960b0805dfe51e77db25be051e77ff0ef6ce915d8eaf40837a9525aa8271ac795761a98bac1ff3c992d47efdde9c95880abce3969e95c653da834ddbd262be937d8c6d5638983229bcf920bf1c0ff9b40805dc60b2b526b062f6173d74ce849496ea5d2e501e02bb95f5aa2ae36b529f1b24dca6235c00002a851597b3c0c3abb860e3328296fa4292f95557eb0cc53fcdaa3ffb65eae00bfe7c6f701931a82d9fe8a5d672fb0868d16ddd7843f6cb849f60859c95686663d5b21fe1250fce6881f848617653fae461c02a55e09b99d031cc856998306b82834d2ab85a66a71e9231d96de1cdd2304b10f7dae471fce4752853234be45358caa31b5294f7105490257c7e4e838249443fee08cab11f5364424d775f9443c7a368a26e54a1d1c717939c5d0db2664be76066f83b2f86173c5a0a49085e82ac1ad801300f88a5aae273ec818bf28cd0550ffcb3facfe2690ee6635883d22a852b445bacf9a24e0b3119290a31987b2347f7b1f7398c7d4e233fa345722f034c6696108ced478be2b117d42b8bf4a8c8f4cb9bf7895621c03a325040249a99523c78d232d70159a6dccea874633a118c27ae2623702d7ccbaaa1b58b293ad9d5d30030f1491128dd56940241cf17f28dc437c5cd71d0d17698c7764a5ee1f72b6cc9c2304a756ee83bb7b9e2dc9da49caeda400b48acaa29a6715bf5a7f19f3b207cfca2039669e55f0bf974407b3dc7a919565be76c66859fd846d3f16f298bb3e59b4602fccece9877cd8346d3a5e282d12d7fa9a8b9024633516ed6fcd2137dbb7fa812fbcfa260bf9972393df2b9008decfd7e889a1f5b62a7ee8744b0abe35071ff312c93e34bc529dc3d7caac7c334ebe7b61513466035d8420ea65bc9f51deb5eb87c6dcdd498939b3953747b0463fecf78f5d2ce3f01c06a2453fb67b6f587cfb6258eba3ba4aa3df0fde1be68f373a28a655030808056108b54de75290367d7672e6e94558ac294d139c7ddc069f602bf1169dc3944c4d6682fe6e0f1f4c55880e2fe4eafd6762ba31e0522a25748a693e2b62303b86fcaebec7e90c22950c7913ef2ccbe357277e50bdb37dbdb1f0e020fde9504060b0851764adb0e7ef97ecabc3f0270f9c5b92d30375216a4f96966065286ef999a16142f6a40fded7cdfde0a66ebcd3210b5f7d3b92fa5517abce524f6e3541f15f35935ad4e5b94b2ddffd39a4f3b2c60489a9cbc88f876ac7fdde6ac9c5f29df79ce64b77c0b890b118b1995c84eac211fc29b3092b817d145baf1543f2aa487980d585d479a03f5fdeabf7a20d76f1dbf44ca61c66b378098346748491430c95139f844da1f6abf1ac7bb76712edb0cfd2d39325de7aa93fc8a5467194e98617b85f478649d620e94e89c14722ef6d45d3d0d6b6d336fcdfb7eedb5d2593126b63b7d04e8f0eaa8b04662a67aad512dfb4eaa6ae0768af0e17f3a002ffdcf0602ca8a71df57fe6a79c8369067d8f79f30e715e5becbee0d653dc51dbcb7637434bf91cf46784c8ff70be293c98bb992bc504ce4c2fc83817a68ce0f02772aafb9ace11cd78d80ce6240feb451e53c240c11e4f61167dccd88704514b2d6af3a3efcc954747e95a99604091771dc9333c0bdc7e3f4507c778f52e1bb081562cca888035330481933bd306a1a39a6682300a05aeb8431db6092ff5ba52fafa1af2e54c5e4bc779fc8634971e6cd6d760b179ec3306de956c8a19c34213257c326303d28a52edbd09894dbb18ebd66c2a9045aa0bd7bf1098bc20e032995d3f828d51b136c7cc8f88e1178ae1f24593b16b524a5d8ffa5e00b338ddbf09acac1d8a8a4b99908b718c12dde99bf18150e9eb0bcd23455a79bc35c65690b67ffa5293ec94163d27b2dd23261f46b9de3dfd8d82f46965eb398aa2553cac5b51e8f42c594e94781782cb303fcbca5a6d774d4d3de5d2c590a1f99c16826d308b7972b322c14b95243c3b59c6c12227c6da3fbcfe5620b03039ec5fef9ee9383c0a4473f0b63ead24386492adb04af3a52a609f079d19306cb5770dfdd4c761a17bb8bebc4a09c5eba61d1a95ae82e06b3d46f94bb07a3e96a54453787a94987d4d917b4d059cbe4c06bdea6ff7e358484afd05a3bf9a3b6aad116f5fb64d24b5b762b7b4a137ddbb8dd1b2eaaa0937fa5defcd05cd51bf3a89c3d19607c8d6036324d5c78131b2bab764bc630c9b8b47360075c192f9771e47df93bed44fbbcdcd08d48b7822134e8654921affef43af110f21deec84232d2e5bcb81222d496a2fa5f9dc68b9f2be4c2c1d87cd7fde58510f857a7b8444255efb6c16d922b8e3a6bf9a33d1a949f178d83c2b604da3ee1054183cff4530394bfa03b19404028d6f4b1b84e23566ba5ab34a875e0fc2959864ee21b0a6d4b5b91935fb79564c07758f6f2b1d33b5e822b00f1b0f345cca1f463393c3a10e1b680deb1754a5ce6b7fb1c17c1bc9ae239d96206a31b3d93064a3c4eb7553428f4c89d0c3dacaf6b0f8e61fc44a7acd2f17ded4556aa119d0bf0a70edd26cf1529f279e626fd23760e1a1efcafb67e62af43dda219b986cb3abe1866b308387d89f13efd8263adaeee2c68b55fcbc55828f8e90c00807ad75a700dfc4d5b638bb37ea7ef917357891578cfb9e09848023271e161ab372201a5d1dff8b0dc174090e43c34ec4dfd5cab427c4dfa39c6f57f7745b99b66885b382268b87be49d82ec675bd6d845b91b52e7c5f08e95f290bf79f7c5e75b2f79c0bdb08fe9d6089b6447e96a2309ab742e56dc13d4132b0964d161eab9bbb7195643825abc2fd9bed0ff0df049be3e897dff50410c9a26dd6c2055b7e5f05947493e360240cf890eb9604eac56a6e87d5c5dc2f6a6b0046ac172b9d4b8666311fffd9c47a2d4fd636ef258515af86211e34831bbb5808b342ef121dd959392a06f65c821e1352c7309b0a13e7b1e5c3ae96f633e41fa88a9ca841e35a123f7d4b9ceb97f47fbcab0ea369caa7a9b8ed0edfc5e76e200a48f917e7eeb3a3be148da96058c319d428d9da0eedce11558e93a099f523c1e70169c5262689805c581707d5d15e2634667a985c69c022ae2d38723991b53b050f927901b3f572d9f54fa76f1e6db54c38e680210c62f88731630926fd542559102b35b5a4109ac643224eeeaf6c6e216e018fe4d851ce62a1f743640307f4a1ed02b25dbbdb35de6169dc1a0ce812bd5310861c297a7265b618ba266a98e9c2e617790fecd7735bc9e9539810e51522b58c43a1287d1575a4ea03dafc39bab65861b8514ead4078b2e5120de61e295f52a97faf452046d6015c68e5de263f7328d718758e187d8bcdf1997b2abafc6bb63f7da8b71177feaeb86c2b55a3b360fe17445df7b009c7ad3a6a05261b07ae8c26267b832f4ee673d057ded650ef70d46f6b797f91149f1293e41ce878ed847afcc7d234cc46a9f4a805059f47c318997c4afe9c91cd6d7020ba135546140e12bdb6155c87ba3f151880c9f693959118578b133d2db4df41f89334ca110b69e2018e9bd5c76753ed695c9a1e819fa6f396d187f0f8f33a38f165181ea06bd28b4ec4cf8ba06ba063e453dbc6fb41e233558df90f6e40b6d5910c9823b3aea2f0f4d9c8ebb4228774fa4b5fe6382c7ee56569a349f1c1d7bbf33594c03b07a97a4e60847a9c179fdef159d53a5a19507493eb74fd56b4aeece355a75ac681e19dee84674d49d97864568f6f2535e92680cb49215358e6d5e065cfe9d5dbb518dd463592067b3a97c6442ff9b365e75e65f727d3bbd255c92b4a5765a89de657cba2bc3dc9b4a35c23bf27c2a28f5ea9ffca20cc9737cef021a74fe75471baaee6eeb98a32faecc0685af4550d23cede575bdb3690f12ee570912abe341c2ce5667b1d3d6ea2c91f3259166d26bfa4a22ac1702c1124fb5cdb77b8f8ebf1ec68e2e556696d431d1ecc8d9020c48407ade79e14a09a8a5bc199f82ac890e0499b66fcc1be42ea427a3dcf7823f47ccda9c3c9b973ff1ee487541f2b982fe35282ec6484760483788a5394082f7d04732de2d2ae01b6cf8a5514f029cfa4913f13bd2a64bf29ff0194c1646dc3e794b82e0b694b021fd0fb028d3a7e6e38b593c0c7e4716b5124d85b0b0bb9381863d55cd8913414b36b9de491f3bb4dee4996cda2e9c94baae22a3a7fc23cce863f92b974f32b2ac12b00017f725854ea5c484ee8e57d07ea7a21bd8b24f41fd5d4e77e867c936ca42b36af5f46c4fd3f7ff4307d30b5db6ed93cbacd484f3694d180768b0ff8ac235dc04ba52e395762cd1f9a0a985faafc79a4eeb194cacc7a4385c52c9c7460228d205458eaa06a658f0a9a19686bbd35825c16f1eed13898a3147dc6fd73759e0cd2676f7b6cf1201e5c7e858daff47befd57e9fc55d05933b4eaf318effa5acaf402cc42ede8288e02fdb78eed7e3f7a49aa8dd31ace3bb92b711ccf43689efc5f01ab9d0831dcd7547e95c50e7ee3f3024fbf4b306b1cfb8556fb16d80fcf
Centered contact blocks
View code aee9c055193f1fab42fc99379e0225d60e57c1caca52493fc0238535e0db2391b3c9d590061e3a1c35f71407dbedce5a8aadb2fe3776d51f31d264f92b7525a12fc5200e2a93bda9fb011846bc361c891495f76c163e3b54f60a03c52ee5879c4883b7edb5dba0db4ed1a3231135b2a0956c30cc336dc67853be5cfcfe99efe7520c3a31859553330009ef845110ac7ec225252655079f03b15162de85f4c9291372114ccac3028f2790f979d53418c856245194fb33b4550756fffe742e47285ccd9bcd704dd4010131884a8174d75b8247e1ce76961d2ccf542d234acc50c5052b28fc809e65caa0e5c4dc4dfdcf8d48f0238a3e5a3b09050ad304cf2cda333dad83afffa9df2926b8ef496740958ad3e9f46c62ee3448ad52d66c834ffe4b3084b36ea3ad7bea12a0acb565d59c393b114ab66b3e2b6a5116f92aca9a8616ebc55b7e01bd27e3d913f1cd1b206baf9d2da62250bfa09e7db445aa3ce19272a9168fc74b55116ad92b5e967e07d532dc21a9f0cf15f4f83d42057a4d865aad040ce0dcd52eb9257163e3d08761260469b1b69dd3cafcd5987d1adc5aed2290ffc2589b3e17baa8716fad220aa35261743b8d2b31aa2a0ea7c314aab60a8e3f748d219df4001ee5420a7418df81e75cc477ad3686fb325f227d35285704d340eed7d26485504ad37850d8f3f6fa5959098a787d6d016e052036151877d0fcc44fffd95ed3c1da0fd3e40f100841d441457b5485d01d40f2e96383c27d5ac415ac8d916efc4fd8000076cd2586e75a4d174669c3f11c0c97f6f596aadd074cbd2d5b20fd74390b253dc3f87433834fdc7a9a2ab6648e89a5fbd490bf41a7a7809343d3fb027a2dd790f4ae9d547ff580daa1537795064f7f40ae1474e9464d77db6143c67a78efd600a6c981c5590d6b9e65c43d0b56153c87c267d66d2052a624f080ce3ee4ecc476c2a3116d51837d2ca07d8a385f53e3d04d1888a6187e4008a2df5a98a37e46580161f397eb3423e5c1d14adf17e1d77f2703f1e18a85355165d0b185bc4d8ada05a701b5cb6701ed7137c05a3b08560580f9a88bc19afe29bc98601ddbff5c665ce5fbdf82003109b9c4576736ea2688bee3a74cfe8c6c8dec8c1300e13943a70d6d6e7debdb0aac5ef31bb66cdcd00129b751ae001029d74934139ffc586577cc15926122ef84a7cf6fcebde68c9c45e267927b5281462fee4f1f59811efd5c0237ee686ff934a0f23d7e02a814855bca8d8fa8ec76957e73e350820291b9877c03483aab1acd7a1ce2b74c7a6ef9ff9c60925a8e43a8683c2d15d2493aa6d1de411326ba56118ad8d6a760f49968429693d10778809c3e7bec39b38bc9e18ca8bccbd7f75e4b5a2123fc70e7bb78b7806599e0baf7132e9d681912c4cd57dcb7fd7248fe2104376a81042e7092e29e19a22cd56a260caaf5cdd40e2578ff51fe81ed9b85c975a61dba1a0b1f59fc96081f782feadf3221465506040fb12a88f3294600b1c45a03ffcec6018795e670d92cde22b7a26280eaa79fb38010099e3853dbe6e03962a19014c1c64c455078c4b3bd1077d25e960191d31bf82e009ff0d606842cc4467bb53e47e8f654f1d8a98be41c9126304f15082f873d4d6ce24e84c599a46ef0d8c2267214e954df72e2f5d4c44882ddc42f81fcd371896f893ba9a6709972315c4330d82a3d7c2fc569a76f076af91cc72ec003bd8b8ef1ab5a74f8858873429b63647c9caaf001f5e136c45db50db009c28bc38e0243273a04330e527773043934bc298c129ff256121fd5ded4c05b0e5478177504550aef6569e05f9fbdb9aae468212d2a77f183ded7dbe0b3dc247d0747e4af3d5983499243ea93f4517f9dd2816cd1cb77bda8f71012c4bc50059a331cd165880f9ce01377e679e3e4e2c3c9d9e0156392711a8ec45a0855f6757e8986eb597083824cf6bb8958bf8b5454e7a167d0974ac687f1d51c0ca70998b3b969bfe020c0038fce08e33ee8c459e70b34ea2a6079685fdc6fabd9c85ab0fc61704aa65369880d7e0b06a76ee7540def34f806f8de344c80c38602626134c754a210d42625d61cc4ee1ed2a68c8037c5b16a6da915110b0bfad12d00f2862125e1cd5bb749a285baa1318593749599944efe583e5ed4ab66496cc26dd7bd7556ffe5bf2d034dc879f3f064fa57bd078e8140a114b7c009f66fb38bdbf41e7a61baa91b45c686238192969c190c36548aaea50dafff596bbe5089e1d105a8197ac71d726b8ced976c8852c6fc9a58ffcd12fe069479c4b8c199b6c51bb29bafd42570fcc27744e7c73030c4153bdc42208e58164e241ccee27235876fb16e96b4c6af1aecdb5806045e620abff7626f79fd74943a84ea4c88868acc0faf75fb821b55c43ae06b8e8947c7a1581da842b745ebfcc760e13f2a1c6bb072dd18ecb12d45bdf9c73f44638abb12fd47015c26fc45b8037aeeb8ae66cd23774c199a44d6d6e8e3a1167f7a0bec3c2486af0cc9317f8f70fa32baf75aceec32106252b637681e0b27618ae3996d20f685e9ce98e2bcf647cbbb9552aabbe0d4b1e6dbf1fde1486089ace7e6f35198157b7882b3df8a5400d9b584cc5177c3a3679e72468703de4d43d1d3febed90a59d624dfed041de3e519113ef216809700d92190ff5a2f94941ed4cb5207f93d545cdec681becdfea95a34c62adbdd5e0cdec6bdba8cb6f911aec6d2e75574e46913b6125463cf3fbc75915d7d84af1758776fe410a61c83246a46e097a784ab67330d650e4534593f8ee6980e512ca693fd486ce81b48df1ac52f33c72b765bba6cbaa0dee1a55692dce6daa8b2d8b8fce1c2d198139481edef503aa94433d3e2b06efdf480e066534b8ff1f3d20b08a0f7726ef5120710e6f390ee5493557cfd97b120b25c0eb2c85019935b7d8b55282f8798382034b0d8a7d31a0b52cafd2b3bfa963a3be7d4e19681e9ac743bf245cea7ad12954685dbeeca67f9a1725459ae0c49e8266689a7ea29657c93bba03842e35a33c26f933919ec7251932e21d84402f32ffb4342cfa0514433233c99653e9efc529535f2fd11f88b12dc97dfd072f9922396729a12df9c7c4d5c724c297fc8e24063bd47eff7b44643edfaff2ae770ec4e4a07ed48c75229183f1f5789224b363b362f86d223c064e8c8fab30d2093aa1fcaef503214e9afc36c36f3c63abbc5301633a250386b205a9058a1ead87368b766b36cacc577db534b03cd7903bb2d7c8591617861c0c46c646a4c7f966d1445c09d435ed867883c237cb0ea56d0b23c8a1224aaf0f6313ef91df9e8e5a174a6336becd3a5b6e18789dbe135a7ef999f0c5d23792bec1b9cbe3fadcb758f97557f95ea5b8204ba4e4b7748229fc24fe1197e96960ab12c8257ea3f3ee37ce8c0cc4058c4e8b2a06dfda25a67895311818fe815c849953cfd0e96a751a99da104279df00bfdb4aca6e9eb96cd967fe1b256fff3a12d3d33feba1e6fd56ea2220844b6ded8b38ae4fd9a1d3e7fe9f75210b16cea2a234b20bab7e5658dbcb99e1f88d02c1c7b7fc5db58055629142e16dd5c6151af989ec3154ad6dbfbae25011cdd144d420f0dd992093856031769bb40807924dcbcd907d3a4117616101fff8b3a239197ba4691912bc69d2671a5585ff8a5363c53d04da85e1cb4fe2a34e5b60bc20a7c743ce8c4596e4f92d2d95392acb90a62502d7d44fee0e55111cc291b8813ae61a69d3dec7c354ab0c9fc16d82432b79e9766965e4db5863cbf707e74030461afee5506f9c85684aad73c0cd169d2904ecdeeb5fba5b4ffab9c38a4f540e83e3f98524b7517116a2ccea1afa342db12bf14bc591119107c3a5bc5f2cd89ce1ee0cd40a1153369ebbb6f5f3cd368948e4ad916e231529c22ed32e11cfc98ce168f0d2824290059173c29d29e846a87ed98a3d825f9ba000205057667fcc771facddbf7a42b8713d6ddc788c265f5dee982e7aef059b488d5de408f0bc11fd07c50cb269eafaf3cde52f68a52e268eacd91d0ccebee17f14b981be9940866c0a9ddd5a804a0f5330225959425617842fa0bfd26289ab6a578a619144ad1a838613f77b931b11dd45fbfa0a148d63eed0534dbb9496beaf8abc90e2135f4e58f7dd094df0c7979a121339de7a426d6e54d1991cd8a97c8f33f979f1c9952ae3d05be20b4fc310801dda12ca1c73f63c0a34fa23598db9eeb3056bd1253ec4b0f0e6edc72d95e3557867b398f3b4dc63c222f9d0d3f2a7f1e7cdb84b4c67386b0fefa3b66d04a52c2b67ab39b12c85bd701d34f2835a4fcac9be0000f909bb4153eee202d04183114e7c661b381adbfdec28c17a154c3b2aad5621712cfdaf987261f0a73eb695605449b1e3672dffdfe841b73cd6726b3c6bdb1d38b269693119f3f078678bb33b45ff57ed63eed72c3b68fa363644904703fbc5b96de37ead203374080086f25e4321bff1072352c3cd8daf124511f182156a8223a8571dafc415eef5f47982f7074a827ed00bbdab500b8e86d5e08e765084f8f43f5a6ff4432910d514ee5a9888736c5e47c8ec07e89a220002f2663fd5da87cbcd96783bbbe3b657760d2b163b73837e65bc60a8d2ed4b86f57840ed2922aab616e068c6148ca26122a4d129c90c61a06f30defe188b884e37668414d9b6403c5940da0d48081e6aac6f27313574cc1da8ff8c6b6f63b1196f03bff8038bd1a856b7ef77395cd3bb313e6fa0effd1c2c01c3bb07d038b1873e46cc7e9b8b3a8dbf95be7a3ad760e446a778a830a3f6652e23369a999cba2a11f52e08944fc958878e861ec8bbff1535946485ccc325b747116a67226874d09b9aba50db80dfd1bc1e3095b5257d6801c1858b89881b3ca36ced117fe401f8e34919593c63bf4d71084c14c572e57a0ed26343ae2c0766987ca6b29c29b70a911e058cf257dd428cc2f68bc09a821d4051f50ebe31222c278dd3df60265f46cdf5457eb1f410f28fa2ba6f7047fa19d2bb7b110870df37e7c9b646831c88327290b2838a91bba747181969a0a23708e2c496899eba419f44100e67b8d6943548f038cc65e026c9fa7e529d7c3f500119c1b06d92df67359e523075da1703987db5f9b5144e518b00fd29bf3d76ebfe1b5bc2b405012721e42f2864bc08875d5f04015fc80b030788e2fe5ee320c0d53b6d7abfd847697881b8017a3d6b7c8f4d1e682e3badf172ba5d2359bf055a043e670e8c4bb689de2d390e1922fe970c88b216bb63ad3b33d6976ef8341b1135658fe5e71b7e5436d0ab6e89fb91f8b8a5414bee4b6b7dd7f1af45291834f118020f807bee958e65526c1a5bdc1d9ef6047b048c87ecee68b6759886ba99d5c6572ffc3defa467380cee52b1e71e357afe3e1d252b0c1946912b62f602dd1ce5cab40a12c9b150d82aae90b8bdcd845037fc7382954f6374cd1a850063e3812e4a5015d608b82686cca4d8b97362d186a279e56899e4d9b236a1d430b020df386caa5923d407d4b258f9ba309adb09be7e3775ff619cf683caceb2c930cabe0d0d67b90241657dd0fe535b65e750fd81fcf6fde3ac5e852c16f466ac3c5b054f4cb0bd3a80143640d31c9d9072f493cd9dc6512d4b008f7fb94c6422842a15dc52963251fece827807c69f44875c8722312c119fc5a41ff2d14b9d44291b4d3eef6d6a4cf4bc5289aa301f778b5d6cb2c4bf1696cb6635cd81fb3c2a98d632b6879773e4776663eb717659f39d6e7163e57f3148f0460afaa4f01218de2463e60f666e47163bf4cbf2fb57378dc227da585bbbecce32040166cf50fcb8e65038f25969b69f1d00157
Blocks in bordered columns
View code cc5f8e42ab6dc9fa881713dea15521d59ef58431b61c10bb6f9dcb992aa3a382130025c3699f94fde0967559ffcc667039882bc7a79c80ced2615be7520d65a66e6f375828f82fedd542d0f367aa08838d3a5aae9f2442e10d97fc10ff24e1175a90e036e2461e5b94f01fc13c0426ee1ba40d6d8e7394be6b21ff8adc070c6a7ee0649957e578c4f81f84db709fa225e2d8906f1b5ebe6b2fe946b5e446fa6ea8e01baa5113e9b2bf1857e05680f46f05a0c5e53cbdda0afa2e41d803bef95e9b3ecee73dc8ca3e795e8590f9f8ac63dac246081524e92e19f86b88f1a2ac8dbc0e48ba46de9294b8562941ef573a2a7d7f4ed1885bb43f51601074ed9105456810ddb5bdddfca4fe702fa20a4d96c1af3632f26aa9ff6854e4c360623521f0092113cc472510c71ceee7fb76b30e772a2ff37fbb6abfe40ae4eb6901c91556f2386b536cc2c14772c9165f164b3d8fe8818121404d994ea120c9e32c8fb0de3d0207ff7aa9308c08c8625311fb88578d46f742cbe081b77a3485cac7bd8918ad0e63556ae47a7344f2bc5ce2285428d5558f90c969eec25830a27a235c8289b0a5f08283567f92c08abe99e0d92b9012630231760bcd1ed8d8f4cbf7135c4bd3e88709507d17c25d712725c495d9ce3c535bcdacb996ea7371478dbb181fadabaae6fe4962bbd4ae4881e0e31aab65ab11488aa19c066ee3b1b9d33be699cf76f9a9b10307a61aaa0ff7c6b89a684b87b71adbde9ee692cac5e312f713042a0fdfd7808c785da3ba4d7c28402aaacdc7b0abb580892e93933585a1fad9b3e9994f9654094f535ae6e50e1ae337e1109da30365fc750d1e6a8e528142fcdb0ca4e623c0964f7e75aaa9ee32a4c29255335402ca3be93ec88966beb60830be02fba5bccb3bbe7197eb29fe4dd50304f25060bf8eabd3fe5d2723ae288da3e7880162bf1f3b56aaca95a718fbb25f70969f8e219a1997c98b24785951f2cd9dc20ca2ee5d328ab5db96c7afd2b0aa77ff727a3a5b6417e617ccc739690aa25a5926b96ae40900066e9472e90902f02b9a8b88e4894924a7f7fb0c39d1b14b3de3e065d4a8782352274a47edef46bb65ecfe0e16c55b563a2c5106a0e9acfbc7c2385812d5bd747556dc7a24b4afc68b96d591f63e118831ec432bec2fa47e8cae84f91566e13bc00abf9eea05624a45308595f8962fd9f48eb951984a1b8ba55de074704ac1cd0ab8aee6dd7c845eae7cd965d4975101b9f8f00976122b3ed7ae55a410899bab58db41662b6c8908da1052b630a06f10c32aab0e99aad59b3f5419fc2f6f514aa6e8811f94b98cdd5160d8d829374fec43de8b18afcd70c0b0ad0b6c8ce7c933f2b3c30bf25591f01f5ef09ba26420b5f029694c38576bbd805bb9de60b20de8adae3a50c1b02526762808f3aef27a8a6b0096651550693cfea8a30d34766bfaa3866d173887d857df7a62d78730ab0fc1942c7108a87ea099f5734af3a169cf9eed1c2da6a7af8fecff7b90e3a1c21d450deaefc897d886fad4cfb3d96e96aa692adffa053132bd58364d06d4f1afdb9912d3a179ce0e20ca1fcc3eb1bb34a56ab1fdfa51bff2d5e3ed594d77b7412ae49927b436e1ca9e4dbff50a1c31350622011f8646e2ee5e4121d08a2d78c41437505688bb348f1e9181403f05f4902378f5355315d859cdfae84be737520cbf8497b6b53811c6f94d07a8742360cbde1a4f50840b762db02488db573e7bb37f97913003ede2c31ca3ac30adfdbf1c34eab27c8008530ddaa691de167c7a020324fa644c50fc34b8d036d247f1313a1019a2d098f01a8a710ad6e245a2c49e38c13b72ac60e10f77cc0e9bb7add36cb37065773c0cb85f4a76fd6ee0c1c130308a8697d3120a2803896f102a16b106ddfda5968c9b9033c146267e1bed3e9b9e6336299c9b5df1248a40522a570c99ca68c2b0079c23809005021edd26f4ae7388b2ad89c30a6e41ccccc4e9df899435ce12be840505b3f7af1f30a9e7a55699eaa07406ff916b49ebac3b43524fe5253896bdff12b37bf9f82889cf68adc49c171b94df08fc07cafc1e22e2a99cebb8f052e7097b4eb2ca7373c3925a1ec5346e3eced6ab3b005cad881ae30bf305832e8908b98e02233819c9f53ae469767b25e4e23a79be58c9273c1c3c6747e64f9d3feb398fe924c439f60959df286249125914d42bed5d648cd2c4bab7976cceb1f4f1545d5a3e50cb9fcfaed8be86a2122cba14811b0c7da273e2deb5240dd3aeca2a4be960bad9ebce36c4ba04dc2bb7d774b93f1df316b3d1334a9c7edbe26e1154a2d673c689b52d8c50f6a72f6e2ea2c65f6be9c2d5dfd474cce7654f5cb2ddf7762df8444ef424449b96f0a86e0ccb0f8fcd16ff1826a46ab9737bce27ea56be8bc6b6f90dd2ca54ff1628502ffb23b0c9d1557a7c6a105951588f1765bfe97cc11176290a8a23a7f384f25195acab9b76586a0e0c304724338e607ed677859e0beae5640cdf82b7a48fb897d6b11ac45b157b7a06cfd7b7433d9aaa21149ac5268944c62658077f7a166840f1f484458e112f7370867977745ef84b221ecde22a13773194e4e7eb21ed1822cfd620fad887cd50c8c1cc80b291c53a35558f68b25298f654e34fcf3739767fc953054368216c17903309897c2f8c3c6c64bb0dece6c962f807d4beca342653fff10d62ae1695152406d2d15ab2ef1d26f391f6795eda2c4e9aed49f41e3f39c2926527cf43b45f9a2de0b3ba610ff190259fab851f2cb04046430e6e8206e04a73664fdf5c0cd37fe13872508b5374369e2c60b384f579388a91976424674bb00b44f5599cbba446cc70b31dc44e0df8d53d8cda6b2cc3019663ef8b2f58b77700612f2735f76e723a719f693b8513fa4982d868caa63f7bdcbcdb783f796e5181748d30b1517606183c2e3c14491387b52387d7ee73c0014487670f423de7d7de208a60fc1ec097554efbfb76b22b18f5f754600ff1376667b088e3b0c5ac4718b3dc3ac790104a23608014b8f8df417326883075a618887a0a640bf5d92896529da632685889f19ad6947fff846997dc8e1013f50f6a4db70aeb417d7376a09c06fb2e292e5191a81a90dff0787a9fe9b2755dffd72bb0b92ea2a97a4b20478c11d4c5fa98733b28b88b555d748b94e6caad4b22ef1b3622e1699ff46ae839f678baa5eae00842f039b1e0f6c746f67f4fe523d6a84148ca2eb960be9c37af0eb756fd5ed3157541ecc5a193c7d6b20e4d31b6f48544175486605b5e3abedac1a8e4ae4646454414d2b7e3add90584e59d47a5990b075992fa744411c05c805b0e06fd9eec6bb698f5234ae345519b6a41713b501afc2fc678d62073eaa20960d8c09553cb6777b9b92736dbbfb3d4abf9ea527de52a2b54c465ea44c5c4f7463d4c51638b7d7046959bf8867562beb94f52524606924240a39b21c6153a48fa4d760fda4a8ac3b032c02d4bf4fc81bac382d547f8ea4c36be5a7250ef2d7e42673aa1a448ed04a734ccd41778a068dae803b2f0b1773a7aaf278004aa90650e8ea41331216683f2cfc33304505f9aebe4e9d8d50acc1e6e3db3c637fa4be52b4a4659ad82a829916ffbc0c3ffac2eef66abe8694a4919bba14ee3809bdabefc2a55b26e74558a0928de17e2a387a71b84d520c243ddf1fbbf1d641f98a3edd289c84f5047aeaa809e14a4c463db1131b2d7e87a1a0a9912fccccd413e3835eaf0843978f37242275a3b3ab9294bfa382dcda05018e2c4a1a2c49b2649666196d354b0fbe9d370a9823b8338dc56bc6b7709d5057f286561b8623b49acb1d6d89030f41bad3cdead2f4561ec2319e44a1a6fb2c6b8a516e413fbdc7f77069e910d879ed6e4b8d8bade19884546149f70d5e66614b4d56e90dfd96ebcff049260d56bb51c9b88194d6c09136e64c398b5e395631af35cbb9f9d3c51bb068bb1e1e694baad38f69808a8848fdf8ee9e41bd164d0dc36c8778a39074636e5a964eb920f6af0ca58b7009ea547206e903cce4992c1b351d0e28d01afca90239589c9a32bc2e8a0f82a6b75f44a5776302e43fd67b6135b8c87f8bd74e8c6525006a0ba67fa4e2bbe79908fb0707c436c34f93c111033e417ee56553581d390a4332f1dd78c665abdc162c0c93186ccfac3f456929dbe8e3995490f8e40f6c54cb03582b86b969e916cd0434ed3dc028f7e560fa8cab3727f57d24765b91abe0f31101fa90369f38b19e1c4f87fdbc068e6e6f0a5c4ca6bfd6babbbfa48d880749687531ae1387be712ec7ad8f9c611071936d91fb65ae3de969c5d23161475d22265aa14893885aa91a0e70e704b1656396a38c260775bb25d78acc97d62d00e41ac7323648bb8155baa9061e0e3eac4fbd4eda76ca3c0d2ee5ad073334d90cd2d79afa72dba6d73fc6997c8992859b1b431c35afb2284768b67acae964810c8ab2500f6a4871baf691b6c90afa3333713876b489d617c43e72fa0eb9ed4f6b90955c01d1a157b150eb5d352f20294330678dc089812c0ebc5b54a1736bf79f1ff74f4aecea55698b93de6ff6e2ac023cc42ed80486898aba509489c645d333afaeee657d96ffe82341c04f0ec29a8df72224471680a4470a58d56e9ee622a1b8beed74e6780a68285ff1c7196a5a5b9a992da5e4e3f90ad178db4d98460ee5c9197e7bf0b0c18255389e764fed85402b0d6b0416ba5b5141261c415b48513cbed1279a389cf8dd858e20f07118cc908a170da10fba8d59bc8329d044cf73313ea23a5f895143a8f0adebc9e1fe34811d553c3fa5080da441b58c524aa6c00e8337651ac68e289d4b5e31c8f73cd0032ee29b2a89362a8169236c84b4dfc447a3fab1e6c2b224b632f529229f8ce6f6ca6e21cf2399a86b9f020c321192a67b03df7a6b4ebbf89950326a80f1afaf7b607252a5cdf8a0e392363cb62d343e49c8b43d21ac5a29cdea325b99f624bdb2dab7c5bd9973cd0e7a2c551fd41b492edc439c489dfafeedac692aecc894968b50ca0c7bd1ca3df05ddb450b86c4166f94d79218dd1bbe4dfd8a452d684206223fd525162f147f755a46c800d9faf6aa79fd574c9e2ced079cf40373da45931d6a73e5ed04a0c752541e2884f244f4a969dc529dbfc1958e7b32b0f55097cc859a9f0963c8c582b9af24b77404f41c24e96ec95a46582495e904ed32a4297a75ed4a7833a2bd753e806c721f1aac3c8125ac3c49d3280956ac73badb5290a6ccb717e56bb05f02be73b3e4b749b3aa7f29c1f8727337a3480d63635bfe87dee71f1cd5d3b901e0902f84ca8f0b0164b91ec16ace43f00e0ef620803954884c0ce6a166821e4230535f00bdc0ee432c2a2bac16466b204a76f77812542acc995a504769494c685e5fb5edeeef29deb1ab41fb2a082bc79ee64dc180ded12645c48c64f5f62f85a2fddda5b1a17214ba1bd13b33c7d39ddc032f446fe51ca8933fb6d58dad46ad69809c8c000c1bf2884abf2146955732253f23d20ba5d7700d8f51811451ca989f2841078a47780c695faf31f659123c60e3b854d275b80d78e2491a0f05dc1a26ee36b292c06c70896fe4ed57098e9f023ba99fabd62783e74618cafa72bf8f9973b44b984e82c26346594903e53092f0fb884db51a1bac42fbea3c010b9da2f84a72b8aeb1d1e40bc01c7cd1714c596f750f4f424
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:
-
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.
-
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"> document.addEventListener('DOMContentLoaded', () => { Util.renderTemplate(document.getElementById('contact-blocks'), 'contact-blocks', Theme.contactBlocks); }) </script> </div> -
Copy-and-paste your selected pattern micro-template into the bottom of the
footer.hbstemplate.
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>
