Adding social icons to your theme

In this post we explore how to insert and customize social icons anywhere in your theme.

We’ll focus on social links in the header, footer and Article page, but the same process can be applied on any template in your Zendesk theme.

Links to your company pages on social media are typically contained with the page header or footer. For example, if you wanted to create a simple footer with links to your Facebook, Twitter, LinkedIn, Instagram and other social media account, you could use the simple centered footer layout from our Footer patterns:

Simple centered footer
View code
511f1a7a05528f9b044f1505fb152ab2dcad2c5ecf7ab4bd11a55f9956fb23a18aefd130e310f0cb5f25da77d546ffb7d30716feb99e7a9d563958dc476d0e8e9da3b2a442ed115ce7d797f8e8eada24ee065d3364ca9470adaa91ca78faa818667e63a233e212efd8fee5dabaa0dab1c10386c3c3181ce9cd2ff29b1aabad431a4036af4c823596f9552cacb3b1fbc9351dd3fddcf1b37297d6e0f1b7abcd8b39134ed5b7efed8f47ea6fcfdd626647a214c26a3dcc73f061e281bacba796fe9e5b587c577f9b6cb764d57f5ed726b20ed1dc52f604918f0c33b8beb693878ab83470df536c2d5dd2c91b26a1f65acfc299e5d6b563a463f2c9edcf6f84b0b619073f5937f2d2d94f4616a8c2cc6f21fcb6b190c3cbd9861569cdb21c4e8adbd7693690d638d591ceae7590ed080a3d05ec9b8f72735ed95b6166d459bc1eb1897e34f90534c0fa01ab50b19153de5acb82782d94478c6310c2a99a670084896bd4ba392526d148c42cabae3d277dcdfbbdce4376bcdbf66bfd3ae08d301a0f26bdfc5da46e127bb397898dcb4e9d521373b4f50338209da851f80cca07e7dbdc3636caff81e3694a94de52a3683592bd718c43a4ae17a03a80f4ec980823e4d16faf74db8edef861fb88c99aa75d7a57931eb0eb3dcce7e9e308a01b6ff10e0f6a36f673a968064d1216430973276921a1ca36540a435054f5e62a10206faebaf7d10e9980977ce0f3060c4da49bcc52d918b81b3296f2e810747f404f739383bda4aabf21c0e6bfef1dbb5c99613252bc0eb3a5ac3a51f1af4dcc1f864914e59537a470446e29bcd8018cb3d287f0dcae4d3f7380085d1899c257144185e55c087766326f7c4dd1d07a40ad4a8b96fcbbf7a6789bd13f47075cca2bda1618c84fc5b9f4cf80dd0eacf0c15378c369bd01248ee68af576e137406732136959bdad357a7dee788518e00c739861bb8d63b5c5bfb3ab5a58401f31f338fd16b61be9ffcd84ae672619c9e4b4eb3b871b2ec0ee764c0f4639cddd4da7e967a17ebe0a12fbf1d1a5104779e2d10ade41805d0aa3a9d01631e6ed1106f1463b5b8d25b5927e357d8b8d19f1b3e7ffe998ebbcc31eb8e0ad2f753ad8798415cdc8ea58c3fa0324acabd81a1f3d61646cf26731e5d4c0b393dff125ad5167e12964b4e2fbece0ff2825858c52e3c1a2fe415175040bbb80eb8f9c068fef844e4ec947d5f6931be015f9b4262b62e19d7ee03dea09f9082f8b96957ad0d650acf5c82e86edc3bb5bf837516be4516a32bf14237c77f0c381ed805ccae21fa11469186b2bbdbc7bb250a8274e4e14e6365ff142549a95651a5fd00e3c2f4459a4c613e6c3b59aa6c0567f677bef7cb7fefd15d6520bcb4f617dc86e59c43bf29fe3d19adbee26f999846caf1385a23af30a888943edfda64ec146fe5c86ddd66cdb5403d4a6783f2f0ed62d3a42d18beba63d34b2ce958e6f5a79903433ac111ef825cff6b34ed49248c73d73d82f4872491890273e1a0d30f2f86dcd427a00f15839c64f37c6b8bd5dc5f0647c53c4dc7ddedc410564bf006284f06f29d2acba0feb24c294f8897de3e9bd6e541c601394f107c8bcaefef0cab9601e78cf4cadbcb47c7c667e24c71bce2892fd9bfba20cb08a9bac87024f320721c8131a3ff314b936db406a307363fe8a8c919d3fbb986621c27c6a9fd4170c6e76bd76a724fbeeef61506319a0b2d9c2619e288d06f7e36b7237807e705263ac5b4f89a525b417b1b48316bda2c58c3c8df4dcb3d0f48193ea3a7d6190ff42ac05c03f22c3540c8e1c83e476b166f6e60d275abdf498a3bafcb2110b45b7f32c45ce784d12f4c970d91f419aee328774e1aeb95aeb165400ee11e1e6821a8d4eab87d1bf2506b364411ed130b47cb33a25dc2f7312385826b4b7598b22dbde299758e0443efd017eacad5dde59e9253f7f4bd9e1afb68b0f0de231eb098b09bc5a7d7f347fd3bbcd234706aba3e2af4b167f8d3e401ecc31edb885e9113c2c161e079b515c1f3b35d589fa2e3356775d1899f2fba19663e92d4326cc377a36cd24f10a9bd1c131fd13c058e380c6cc81090d10a46ec16c9022231f23e47a7efa958b46cb628805a4a7f67f1f0d480c78627bce122907c9f1e16888e90031156291ae18b1f06653ddbafbf25368386ddeeee48a410eb25766d2a6c9582b75b1cb79792c56bfdbeef2fdba7e8058acd83fe6169d9b8eefd16b0f61e6f118c39c1a59e8ceae8a21e3ede332511fe90f98ab9fc3ed2f5ee7788a819081ffcabd5da4e5928798bdafc54bf98d7c4d241184a2e3defca4016b10d1cfbe6dfab662d53b5624f588d24d5fdf537ffd56019f0c1b8b4f5e5ed9f826c1d36b6de136960cabf95b5fbdad47e53371f7420a6c68301f026de12f6c1d8750421c760d9714250ffee97ede5d4cff4c75c3621e56e0ac0afcd8cda0eb438a7e341d6785fc7fbb6cb5c56b478e0ddfd96bfe188bc953676828ed0075568761ff980d3356a72c842b943033a43c94e3d0d261f7a0f7bc37309fe414a0eef63ee55da6252d293afd9b40cf4cd65c49f42f3687e8f08a2e0951f8c1728954b301e8d9db574ecbc85350134a77bbde1ce0775f1b1f60500eb6c5cff0fd46de628f6fb4f17d152fc7de71df251050bed499a58a1ded16851293b96c6e9feb26aa7d7d9341ced55490b2d092e9ff704d9556c45f0a801ab4ca774b8b1826c9789e9e80867e86ac0af29734f9e9334226834f48844ab69d0f0cfd8564d352c93d3e76417817e5f80199236dc7ff1bbf3ae769f769c2e50ebe4f344ea9ee2a01ebb8a55156b1e1f13ce752b774eb11c900c287425b1e8d0210b33262a9f4fc9d4bc5182c61e8e7b99df462727699c1663d00021abcb1d2368a9a4a09664ef6f4868e3e5a60e72ba144db3976d91ac7bce9ae7905efce20e1aef6a2f8db0c642563fe4bc3216aa0ad56a1020a43ddb4bb2a2d16434830c3c383aa65c35111e96b3fcfcec3fc28f0054e2de704502d6635d14030a05b9777f2768b7c9806ccf71eed7ae51639cbe328010d18dde82e12800ee22ae5d321e621dd8dbc39b0e7b6a63d95af2b7377a9ec36aaea90f0bea4d91058c25c9df80c756f577bbc7afd46dc7a6e0e9a3f54a806d8f18b8f87d83332219fa47f8508fc2a07cd41ec2c3b7666fd400b44dbf876fd0fddb88e6d6ff8e750188102a16ba4fad8c899df84a2391852001c364d85bc5c588ae7846064f07bb17d02692c8731b149b5afb545816b83d58dd8ce73d8a7b20caa327eb745e8f265c134fc07ff8e9d479169e1f2ce5c9bca1b26fc1f0e965243d11428b0add9bc49ec3b670f5765e82c2c46ba8ef077a117e8fbf821ed8b7e617aff5d004d967d2332db4c9090538bb7a79bc1112af0e2d59cd74a517ab0fb0ed8104f0b0f81c7b8c5c6f18a1b2cbcedd8b5ab9eefd2a388c908456ad1a2c7af4a1e533a5169189af228305e6fa1c91e7f2a313012aaf6f0dce1a33688efd5f31c344de05a4d5086fb35387bed60a5d2afeb19b1eaad18e472e47d87e71ce1aeab68c88a97e5f370d049f9bfce28b9d1784a824e6c970209487fa582755ad2dad391a5faf5ec065cb08805487142537a94500c2e32a790b617e2292dc803d99832ea2ba57e21654fb92ebf276a33acf938d31dce02eca4b662f13d2e0e30b0ff8a0def215b0835ca81152432de05c7b0277637915bbc0b9549be52bb5edf9dc92578aa96e98de7785fea5035623d26b2b1f1cf814ae5e67bea3cb081c405368d96da6bb5972dc9e256ede5de713f30afb5296e4bd958a994e0fa6cd3a9ebdd6a7641d3a64ed8d3d3a7eb61317851cdd90f286da1c8de59c60acb154721ca267fd915b01d945ad7f392deb0b6efab321136af7522c902e8568d9f94e4896d0d874a7c2cf7d85b66f7171cfa9a75f0bda6bb01875c3fd1d1b665d47c4f7734a02975e82c0e363eef2b667a79ada9e5638da1dedc2e76d5bff94cc63c347f803893d9ccd75ba34610cad53c3c773af404867619914bce9ea2a7f729c4bb93c67bd5a6a6b48d402f304cd18d989465628e259b621a27928943da3a0a73627bb7a5bd4f391a1fa5d42e0e51c25a1b8c8f8608622f8fb50d0ec58b5977dc057cb8e7a7bb973ac5308c9b882155f4944859b6031d27f4cf902987021ed4e9a8482054c848a922fbe6ab52ca58362c4e31beabcd8d65d3bdade34cb77908a446fe0bc0800b8523af03d44d278c05b090b2044f59af10355e7a823d875f3fd0da9e833825fdbe7aea3d1f4811444d949df206bc2102d954b79e4768703f16961124d1881706596e297f49de308ff64145e9e68b2ea5b96a6c46f6ba2815afd518320d957fb7fff74b82c30e0b578f0f01207d86ecf123ee7991f56274bdd1ac236ce98b2f8b4faa0eb86c721bb29ede543d406a960b45eb7a05cd2fbe55e744f4c134d238cd1e03d66b9d06ba7f3586a0a759dfbb354cdc1681e28ea98b40cb9c0c179f94cc863bd71e8ed83da1a76c6d8dac2e990c08f48f19d9e1edcee97e40fc7aaf3f460012465ef41376341961f98ea00cc55e1241052e77597062b92385a0600240740fe70edab198893cde4d4014f8c9d4af23d9db5b8fff3cef97fc97febafac6be2fefb89c84e460230dbe7e8a76d35b7f59152d342346eaf56e0d4552aeee2c482407a09b4a9cb9c11f42bc7d0a117c6bc7bca5961ab0b547f4a3040e2dd34cc192678e49d2819402c72c82c8419df97f11a9a74a258498bf95eeda4c5cced9483345e1a35519d1b515658826af569fb5f8af180a0e5b23e1f5a699d3ebb466d73a82bc3c80c5e823a60c735438fbba45e3e8548aa367497cbdf2ff653277559b8136c78abcfc32db79d5c8a296733e3f7a348b119b04a9dec280500b0a30c1d82bc29cbe0f8624ffeefb5aa62c414f95a6a2e3f76292807c23e69f69f6f63a9e991169123418c59988a98c6bcb04fe51c1ac689d890314bf93cd0f25c1a6d855cb448a9732d6242d8733d9a28f81f46b35c5d33b5991d2278c57d10161eba385753032ca904e2b0d44faa8efa6fdfdfc644fd2479f22be024a442f9281e637b544e8c08cfe504fe81fe3ae1f08aa6ff5c05403c5e0ba2a532429c7f613b056bc6d772397ee85877757af990a97b9d3939ef0f97e37cf6fa417c99667119dc0e86161b4bc557dc1c5738c417ca4eddf7e10ce1b9acb19f13206e9af130a7791b6ab148a79dde02de8701fa7f2c5c424024e01df01e6edd66d63472ae7205d3725c570a5eea066eb5940e08f3563c53c6f81cb044fb51d023cb306f0a9911ac3e72a9a8fc694c7ab6320d782639d4cd3b39ca1f9aadb5cf482682fa418b09031bafdf9c6c576b3d84fbd6b40e7d4006e1315accd7cbf47562f9f04fa2dd61a25fba41a2cbef49a0193d5b4c8cfc03b9a690e16c8bbfbed573643444226093d9a7a4b85a0844738b75fdccfbd1f53fce09f569ff8991bc22457b3624d8ee2d4af2a90bf91cd0fa038fdba5b0849f6f9738864ea7bf137a5e45e89d972664a54468119232b0b611841394917a363f911752b376ad657cadbc845683b4678ec13d8346d809cbf703ec5cbc4e70489c6f390ca8d039ead3269d94b11378d89bd010f60ac9de6800ae64741187bfa37ca137335780777bd6e15e91d28a56f7d9abdb18ed685c73465f5a3c00ab04315be330173e74f0de61e3077c59fcd64313eaea73126f8529ad18a4ef3e9268066b2d12bd0ad9cf9e71285724b4001ae443fefb492a7e627e7952aafcc3eb16165d867715e53c135515fb82751e5033439b53008dee979cbad00f95132fa411fc8f07e3e97e3431ead7a9de57b894396dc18c58598c9efa81dc9f3b969397ea5fc20232d4c396c7707ac4b19361715d16d93977f15089b7aaeda701951026286933141674d12230b5730672eb91ad614c7a70686bdc3d1f6645ec9ddcedac4a4431c0db9f4a6eae1d10d7b7a2bb540560cab40d7452fa5188651079e84edc28f30a6cea7f118d6ae55ce03126e75a3cfef5e34f7992c49b5a75ac85d6c72587b70fc09e0a79a95f2df998906c88f56c9ec94d860a64065275b4bfc07c5f7706e20941dce750812f226909d6852de18b367033f6c8bbae50f6071ec776a75815f61c9f680c180ecc4fc2547ad212f2c0c3249425d2b9481fc07b9b9a0a783feb3f9a9ea2fe7e12c6606532af0f886e67bfffeec9143bb90758333a0f2c1519bc6bcf00b45d408dea34be6e2c1c233c61809b95582e7b6bea09e0e1f90c82b20c745b8146d1d3612d6fc75acab0e355c81e02f154feb42040e6cb14802b5ac159b971c490ea7ebc485e15207d56834d90e96f3b847620a651a09f481457495080446748f5a679e5c51f8ddf225fa01ee3b6ef1736e0dbf715701ba0aeeee2501c91c35e619f44d8caf4bb49bcf34a853ed868dcbfbe814fe50ed56d94a2a084eaa660385948764607af2923c2c163382af7a1879b7c70c4ffb7a5dc91fc68ef95fefae1297cf189be24439b536b8ca9bb585ee81af637f8b66902a9ac263bc71e7b0e5e74a1251ccd42715e6399570b9ca9b881e8d488971f663b2572ccfccd33eb82bd0dd059f84da2d1c242acc03fae06768e46350474df13a68b68db6dd2c1da27ad3171e7cd4175fa1dd846e9f1a7ae0f7632edceb7bb5d04c2b9302b5a56a5ee28c30027d47f4f1a3b6d0fac8f2eb188e44a6e469acb5d9baab2aa224ab2b10a7790a8796b90507d192d2722286e51fa90e1d0951196a8d34a82845ebfd9919e445d535be4392ea7a6811c0069747c6f4a95fe64356ce49fe30d2165a4439bd52def6b7ab70cc459c73ea5a35f849d3ebdfd0976202c8dae36000933797e82c62cbc7bb66cf67c6888a326c4634a422a2a1b11cca7b2d536e63f7902cb8c0b2347bf88ad36cd86e71c2d4ff8758e9be39e23e232923204628875795bc4700b96071f916f4f1e00c7a524e834118db8295257fe5cf7126e63c332d774ee6bdf333aca1f5022ff64ef18d1a7602674795a2434e3905339d973da10f49cb359da6e20070a024ec1e793f776b512bc3578c37035fc9e5906f36aee20341f63518561992dc1cc770c696ae7fff94b5472d604f846671e11b295063995b980aec63a226a7a49d9a80dfda6c982717ec470475b40264e244a2a83377942574c9c496a17d4f73e37eea0408436acb3dfc0cd41710b2ce00add66241618427c4a73757d38b910d094f35a5faf2d7e4a5bf7244c6df1a984fbc82c65d294244ab09ff2846850fd25d450d4f86ca703edf7abdb4ad291eeeba8f02d39fff35447ff0fb3abe553c8d3d9e9849c2c6e3874d9789d5f70c279f4983a5d4bb62bba784404408ee5289f6109689f437c887097a345321d8604f0da3cce8a07f12a3edb2ca83a5cfb68a52158ec69a22d876912bb99762a5c57ba153aa38a6ba1b86563d21119929d1f96954cacabb50ad7c062cf0fbe19b3a44777f4c00c5ed7bd8873e0f42e916f39723a7b35b443b7c5921995f88ccb01d808cf3a063f1f19a94a3ae8292aa39b552b91000a29b0945ecb631929e9ce5d95d7fa4b48d82e780de8254d7b5b7f5e5315e710165e489a4458625290c6d686a29043c1a0e90884132c6ec70e9c0002a0d69de8b9e9a779b5899412dcc2062fde6de9cdbc9de561a94cd202521a696249854c67e97e9cd8e9f1552edbfdbe7cf26e2d7c5d94e5bc1f80601b5103e41a41d6b60ae1fb19a79943312f3c2e739d36d4be6741946c6efe4bbcc09e8000a1d6ea2571536b9fd7211eeb47a220d6eba65d22604fa1e77d6372c28a88ca52c9b2ab8a00c2a72b0e5a3084d2d36bca55ea727b46164bc36cc6ca0cca4ad0a422de038f451eec67e3d503a212e68f10d87ec480c6fc5426bd464a214da8ddeadfcca6d52b180147d9e4fa0ce84aae236f744d8c27b1776b6e2a2738d69f80e0bb6848a540ed5588d9b062cb1f4f84e581b53e91df54433ca03eccee8b1d4da9fe65aaa55e04c5498bde022dfbcac18c9f3eb351fb7273405956e900ebd0a4afedb6f6e2d73f856aaa5a97873af746f6138367f43c1be7c42864b0cc23002b133e1c3ec04c3271b6712f0f8b41ff302f8d157ad50e8cab6ba71860a1e4170f2b1dabad728a6d4c1f1bdf8c948617943d839ecb825b14b45782265e5916b5a2b1e35b6b5e739ed73ce2d70690825ae42abfe87980aee1b3ca975ed8412fbf8006ac4f10be3e5f2af8aece35c0dd555293648790ae87929d47a9af780e32133b7b329c36f3f8e663679b44e629b07a9b63186b60dd708df04c7f9a5fa3e6141155aa788058885fecdc005eda6253f4e8e4c58f94c701d9f3f9c0c11eb118ee698303d4dc60fb993a1c6ad0dffa05777348f83ae633f0e5e402517f2d832ce7b9431a881eb8c964bb9acf44be5a933acf8efde1e7f09efe7d3cff28a7f5b8752594725e7dafb77032ac0ac9e993a08fd3cddd387410c658be3802a202a9194275e03d917503a69c18cdcc6f06131f56456acc59e7b26f51d13ff698f72f096461c291d0f22068d159d784a0c9ab98be486ab8eed14c445132c8446b4515e06ea8224dd935a64e8ddd5f478ae1125e7d5d51e0cbe3d3d5c2f81f5ccf5b7a6dbcd9f65c22dd45896e6cee1c53c6505cb3a2dbf2dd2f6f3607c6d22d6133df23213874480772a3233f657ceb8eb2d4e6fb49c434d26748e1992883200e0e7d0c79559d9826fafbd24dfec6b6c82caffca8fadb7c39e3e7c39629e6509460928bf38f287ea04616be0ef788e0f2983175a6d3b8b63ddc787e0d8f2bb3e61185918b9355ba76607895a21ded0cc09df8268bad5ba07d9d4300d1ef98fd6a641a748c068b36d71764a7e291506a2095091bed6b2f596524d9307dc63535fdd4abfd420f559df818ac6f88788718ba8f187fb2d1a623fe873bb160cff8f0bec731157c25b8f5117da9f93592c726ea292d24807c2035eb3ed3fc14a558960069556554b40951b60ef127fcf5c917d8a88488986f431425d8bcb855bec744a7220988fe988ad1f91f253a582faa472b6d08848fae4bc789c5d39657b355c5427feeb401eb9c315cd04e57c88ecfd6d98cb77031b921deac41380b973df23c895ad18aab224fb39c9fdc65b1b5926b664d9899f79872440d88b199b3eeb37e66df93f0cf5c70e4de6720cd637bc09b3880c69cd4115004d79f26c872afe5e0faabefe6d707027c49a822a0e9834e87d782d2f57bbf77efaf7ce5e3ff788160231b43c6558aa8d953aa1485db9adca29fc311c20dd3b59a6a8a7408241bdf2e594cbc62e8a38ef8d3a0dfedc4e1e3899579d5f8492a558bccdc3ac2f836c3c62c2a8827f4e867172d330a371cacd2bf67509f1b205b5f740bd1ab2bd6b5c0460af90063b9c64d9d8af51789559974f809ca35c35c224cf2d10d06dcb0ea51abcabb287553524ca206099cb18ae5204e4d973465299c0fbc007f49a1e312be74df8f247d9a136c8ed26af791a468cbcc6859e59b55c4f116cb8a460d3c64b3d95822d5923daa34c5fdce79b7dfa40e136c95218612b0e9f46c39a3252168bcb620af63f883bf43c7994fef817ee11cfb6bd3be9071d1790e2a269d717500828efcabc7785cd86774509b952e994c55461c1b880eaeee719c0e8e815bee976737ecd80b818b8

Using inline SVGs means that the icons will look great on all screens and you can easily adjust the size and color to suit.

Article share links

Zendesk provide out-of-box links for sharing articles through the {{share}} helper. This adds links to share content on Facebook, Twitter and LinkedIn:

{{share}}

The helper produces the HTML and the hyperlinks themselves, ensuring that when a visitor clicks on one your page information is loaded and ready to share.

You can wrap the helper in a <div> element and use utilities to modify the appearance of the links. For example, to have the links appear larger you could use .font-size-xl from our Font Size utilities.

Changing the icons isn’t possible using the helper directly, however you can use your own HTML instead based on the HTML that the helper produces:

<ul class="share">
  <li>
    <a href="#" class="share-facebook" aria-label="Facebook">
      <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12">
        <path fill="currentColor" d="M6 0a6 6 0 01.813 11.945V7.63h1.552l.244-1.585H6.812v-.867c0-.658.214-1.242.827-1.242h.985V2.55c-.173-.024-.538-.075-1.23-.075-1.444 0-2.29.767-2.29 2.513v1.055H3.618v1.585h1.484v4.304A6.001 6.001 0 016 0z"></path>
      </svg>
    </a>
  </li>
  <li>
    <a href="#" class="share-twitter" aria-label="Twitter">
      <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12">
        <path fill="currentColor" d="M12 2.184a4.83 4.83 0 01-1.415.397 2.52 2.52 0 001.083-1.396 4.87 4.87 0 01-1.564.612A2.428 2.428 0 008.308 1c-1.36 0-2.463 1.13-2.463 2.524 0 .198.023.39.065.576C3.863 3.994 2.05 2.99.835 1.46a2.564 2.564 0 00-.332 1.27 2.54 2.54 0 001.094 2.102 2.413 2.413 0 01-1.115-.316v.032c0 1.224.849 2.243 1.974 2.476-.363.1-.743.115-1.112.042.314 1.002 1.223 1.734 2.3 1.754A4.857 4.857 0 010 9.866 6.83 6.83 0 003.774 11c4.528 0 7.005-3.847 7.005-7.182 0-.11-.003-.22-.007-.327.482-.358.898-.8 1.228-1.308z"></path>
      </svg>
    </a>
  </li>
  <li>
    <a href="#" class="share-linkedin" aria-label="LinkedIn">
      <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" focusable="false" viewBox="0 0 12 12">
        <path fill="currentColor" d="M10.8 0A1.2 1.2 0 0112 1.2v9.6a1.2 1.2 0 01-1.2 1.2H1.2A1.2 1.2 0 010 10.8V1.2A1.2 1.2 0 011.2 0h9.6zM8.09 4.356a1.87 1.87 0 00-1.598.792l-.085.133h-.024v-.783H4.676v5.727h1.778V7.392c0-.747.142-1.47 1.068-1.47.913 0 .925.854.925 1.518v2.785h1.778V7.084l-.005-.325c-.05-1.38-.456-2.403-2.13-2.403zm-4.531.142h-1.78v5.727h1.78V4.498zm-.89-2.846a1.032 1.032 0 100 2.064 1.032 1.032 0 000-2.064z"></path>
      </svg>
    </a>
  </li>
</ul>

An alternative would be to use a service like ShareThis, which is configurable and provide a simple embeddable script that you can add to your page template.

Updated on 3 January 2022

Ready to get started?

Take your Zendesk help center to the next level with our easy-to-customize themes.

Select a theme