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.
Company social links 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 View preview Copy 5aea086e425f1840930d22812e166d3db769f95540256e6ac1c7898544c29b2392969ec715fb38d0caa10a05b3513b0b9cdf2061b58d60287e3da32ddf3b7a699c517e6e7c7810cd68532ad787ec0a7cac30d98d17c0f952899ef82ab3e5496e7d9185a4a06e87e30b3848a4d3eee17d525ada4547e047b00880baa1b919c310733d79ce781a03e34ef51bbe78d307d5e7964ccc490cdf083fbfe10ac088c8d06d72214a7fdcda9d3928b4940fa4fc2361107a7ae56bde0d81aefa177babd196d9aea55fdcb4a57a96cbd0887d8d0f45c07803ab1275cb20598082af79f7fdf2a256c48e936cc3d012aabd5dd5a57ce9b93a5155b41ca1ee2b76320c519936d13bee2fb65f96307ac3659bfb99e02b7cf73cfab4d0a06ec16ccd94fc01c3171f8b1eaf1eb73dd6d7a2b2dd49c2ea2a4efb6afb6d72e35df81b923bfeb829a43f13eeddc8ee06da4f0f963c1d1a582dd63cf840e8f9147d57ab213b84014ab23e3e4c91bb23e3598bb64a768f9fc30ec176503d0811fc4c971a12647905c27e9bece0c909df1081eb43c39aeee3b2239fde139dd960b98646cc52890dd2c32e7a6772d4368657aabeef78fb2a8376371356d9d6cb18f9a110b93773c247ad78d3521b838065e8a6e8ebdb9b23cad46f81f3558fa2b410d4c0cb25fab8a7888d81c0c69b386b89531963dac23443a333d7622134d0cb5836605f1ba5bf46f8e5cebf94e0dd2bd6fde1cf8cf11a523c0d7888cc3ec925fda6c55cf302556548f432ef939267eddeb014c1107c1878d7bb6da38e9bcd8ae5dc4e4e3f1451475edc8309ba5c10397baae59a9d77a2cd053b4f9efa20691e9255e21289a39f549b64c6a9a021161ea7c4cefe8969b57e7c6eb4728f56a1c62db18f7736e0cdf84c8d13808c60b0fc6c5f9edd55f0ab914858ba166fe1bcf62904bc77ba8a18b37a41e3664875c34d2de48f773d9ba13a137de578d3ed43507ab1bd832998ab82af54ea09b96af2a850840b4f51137e4a22469535acab612d313781df967029fb714d518b68ec4044cd7623017fe4b37e87abda4ff7711f67bedfdf26cfa8892f9f080ee6daf0f02585a62dfdffe0c3b20c4be0da8cb1e6fc5d1bf64b9c84bf5eeafc94cece66c09f11ed7050ad8b9f8fd625beb80088d8a978d27c038005b4ab050f5ed022c9bfe8ca344e43d640f9bba960852d79d0f9ea5ada6e553c37d9a78453e9314758f87f817e48f1af60c283c4eb0e43428392e46791f82866d1f592a088dd85e0ed114df826aaffa6be4b47a7311a5d62fad47d914b5b1b6f650829b31c808eb4de853b25f4c9820a595fef2e31f8ea7d856d2ff11257d19ef513ee0cd02c14664a4b5ecf649270997dd65fba7a2e6b79dd13a55cbb9b28ad593462a6967365c3bbd2018081923d7ed63af8753d31a0c37bf803386bd63e28c563bfde1f2511615c31611ed20c88b63e8c8e312e281ba35592df2068eb27367369b5943599b05f5145eea095ec095910d4d078fa63e786b363fb485a5d488c87bf331fbb2cc1bffb50860664f8bf7b988c4dd835324180363d966902a5ddae5440ce1ebe5ad1b62b61a7aeeccc090831640c4dcb65cdbf2f56a8215dba7c3ef16b66aeac445dc02f65d51ed3c5122138b1c8cd8ff32534fd26f2ceaf45cf3a1ee895392f9b4022a1a0c080266a1d6f2659019ffe28555a5ba61577d506abb22ff57c85323c06f2546cc7c2b670b9e19cde4efb7415d01b44e81e1b2584cb4972f11115bfc2f49af6224581f279677d535b8b086423c8d4d099c60a3e5e1a781e670e5686d4675bdd9fe4b8e5d2a7ff39f40faa261c4921fb97f23c614b03b057ae74fb24127d97308e3c8b52ac6b7e3edf280fe644f2054843943aaf91b00c4ab4d52874b2614942b769d4faa2b74a3c0218cd92b04864e390f6033c1ed28381f39af0d33abaa1e1fc6bf8b10c31030c941e43045dbb7618a00b077a2c239be76200784c977460af7350a6e9881bdaec706d2abdb153d4b4d8e84a94d76dc84a8e1fbc8142c08b4a1c043cd48b670cd0f0268e84c83d26ea0f8a983edb76fd3b0c0431b302cac8e17e5bf51a9f20ac80b71444feae48778221e29ccbe95663f9bcede46e7508f7268ec0caf479d04bd1e930f8a9233ea945ff8680227a3ed3663f79c3bc259378a957d0e99c836a3bd678ead766d920e28c03f5e1bf2a49c643f31fe179fb664c643ce2cd08293cea6c9b688645e8985d7a5f9052a51e16b1a1366cac4a8b98c1b6985be524f28d73f1698a5de71e371bf9e51e0c994c7b57f484be11ef38b586798cf025630fdf97a7a7fa981a680bf6c3efc59cb5531a1f59933edfe66024cd7b7faa2d0c8ab60c863ff15d2f4bbe18fa9f0cc68edab6eee57b2632c0c1efa2af1dd300eb0cd031e0d3c268ff2527b586dbcdd22b41fdc250f44e123cef18ada364afa71c7a9dbe8e34e23bfb8beb7ad4f4bb86109883ae9f291528ce00601e2afaaac819eb656d31722eac727ad5c746d9f21562c8d6212511cb29bc4ad50eecb26763c356feb2ee14dcb8eeef769617f5ba21ea022c66f2151e9dd3b8d9a44e0a6ad2751c2a8207e6bbbda08ea9a7bf268c235b3dbd580c78591109a91dc6ed2611003367bc935826b7ffe17b278359bf767c22a212eff9340ed679159ad6de4e4f170cabc965c57fb2c42f5d28536342ca9cd5b3cda7686a4a1d923d145062e4d8d1ccac64c23aa9383d37e4a76d84db7820a3a7ef137be4d764c1ce778ed5b7393197e35b548ed04030619d234d09571723b60f846e1eb0cfdd0c5da90f105fd705f9bce51cb970c7cc6e227e32afda081e08b51104aed66009357d4102aff2cb13a110973955cfc8d2e76df429fe38461ae70aa753c6db33eb56cd715ec8276bfe8a1acc0486e3153bad2cccb4a15a0879c8f602c76a861b025ffcb4480099793b843d8319287cd082d7d5dd6ec6e384f0777023dc2d46dc98855725b9e5d941188e55e7c7a2ef83ea808984cba0036674bdf2a254adb870bed72022ece4e0e329da63d0e06d510aa55b04d79ed2cab58cf798cbdf842419bf31f0d19ab4ef45cd82a1cc67f37fed92372d24ddd8c23483ff389d4eb7a2127eb1f84d1d0561473c68bdf809955a302aebfbbe7d23803b0ac992b136e6e6f442249bfc3b3bf8469c44c426f7a4e11343801c23b8b36d8e1e41a28ff7e370bb949168fa23757b7b2271093a67104c500b5cf0cceb6f8dfd2623dab5755edea38c8d0984b3d5b86e0c79ee3911c22a00282d46b41cbd6eb44a8792c857c3db4a1386ae185f3b9667250e4a7fb536fa0a9f9fc865ce17178a0acae8efd763b4de22f6cfc96aa2d451e1f59a030c67b154d7c41da0fe3ba6aa0c6ad23e5632bc4ec98a4e6a89ec6369f4a35ea9cbe21c03e9f0e50c485dd17dfb9196f55cdcb8812239331e448d18d8109e2d22c716a492c3321f2f248b1ccf1804502e18973c38ab977f4ad53ccd9862f4cb25ae0fa54346d1722e5f254fd98f74279a80683f1f304cb3635ccc1e3a5b459ac44357bf468db7bdcff3e24644ec64c2d602137048f57d6bc16be82dc6bf81e352ada384be8589873d67fac6236ec332fc0c0a848cb24503c0dc4966b25f759af9f8cc78c1ed90995ad7bff5e42116e0153093fd1be9d3a1d73caf4527b88ba5bf152dacaef9cd28e50bcc2cd7f7fd5d2478907eac98b6ea28ea269f8ab5cd6de9a76467ee5aa651c68dbbfc153dce34acaa0e57044879fd183aa9a4d0688d243329645c6909ac49b7fe9ca526eb4ec7000f3a9ee56582ac6d40fb383f4681f5ce48193377cd2ff30b3b706e7d6c247d9c5ee1aa75b94f1f9838acb3763c97d978505529d680d1bfccaee62831b842fc3cb826a5b621d15fe94b9847868dd6c1a0856607b4e764a8e05addf658750d354af68e2b926a3a00074f6656ae22b385a3361eb68e1d73739d2732e979b89436b12da0eb50cdba36cc344ea658439eb4045fd6fd1b29e0e3be5ad6e441d83e363ce2959f87ed52ab7bb0c285375f00e2ec451ab3ae101088487916fda8b93b3ff62813f6b78496d2c7c3107d75006370e45e33f6221dca2f63db39e225df19ef0b6d5488e9b37b279b5908f7374d5da250d39c6331836db0be4b9d8f465e746803bd155a15e8dddc906af419a412755ccee26c523769dc4ee3cfdf1233c5a29c610fe5028980f35997e71a6d467e3044bcf3ef126fd766b1300a01e8901a37810e9dfdc7099065beace3fca3cb8c07b374b488330991f89ee385756c4fe7d0bce478febaaca8591514a04e821e94c744f74713834fefd09dc173f96d4b59ced704d73e5c08fd2383065e87ef6fcd5f06089e66a9d97eb75216cf31bb8f98814e29665864d5e16b30d42b233da77f54db7f65a94c6f3e1ab4b2b5654612a987bb82ad5083909bb8bae4a5d980d03dfceff751e08fb5e524297fb21a9de07cfb2da588062b407eed3c5c247b603540a2dedebf08d15b0455634d1c1b362f5adf6332ed8c4364c39e1b8582de37bfc86b38394c72cc1b0b64ee7c099addc1b7289eea30d45d88be246b58315469b11f7d10fc9346f659393cc1f276456df5a78d3aa767b49b8a357482e0621b07aa71dcc27cf5c2e2ab755688ff6e52f073a99811b4eeabe7672f15f51808c1cdac93d98c5443b6d1d58a1a9f19aa4cc0e4e47e91770c1dc57185ce46faa58355f579713f41189a14afeee48f21fdade95447bf9d9fbd1deb63b273baf23ee5a31d537baef1287a8fe74da6663e6f51c78a3e8ed3277c3292db6eff316c5b1ebe019d3f0731597f1491faaf42957c0be137383c5328bdc2fcd5e78e799cba48ff8f49788ffc3aeee56ac2a485ed004ff4a7198bd18257f5405d1f1b3ef44b646666ea35876c1a9f24bf32bb82299ca17aaf837edd75f7a4a652355f23dfd0acee53ab6147eeb0fd88af7a46ca60c21d5e86dc5ed895495cf370c9a88804f7bb2a66ad40a325c828f986f74e2e38c4a4d0fd433b6eae167df9023636fdc2fac04a78c3d30c3be1a8b78660fe57442ab8de86808c9cb7c1788ab59de267ff75cc4eef5ac099d76b1d647e2aacfe12c79e6612cc993abf2528c23b65810e13778fc674c7ace1efb872b9b44481dfdb8f82231368b1323a06b9a9374cbc289b0ce489ba23ae5ca0f6329414fedd2f893907ee25f6e6d8b7dfb22bde098ce14e2934947b095709676b9889b15c5ccaf940be506239594ec3ee5a8e537648d8f8b822f69367d35db8abd66237550dd21622f509b0b889a995f3247f30f5d1c33eed487cb1f272f72573a7dba694c5c36d0349c472e7b6c17562c4a100e8c5ff346f4c476209b8f21fce7a03b3f8b039a1248181519ef9c988b539e1bd3d1573cad8118263fff637c775d1f2ee5740ff082059586e7fdf2ff76d800a92d2c0433d8c4ffdc64e924bf0e33cd6c8fb713b4de9f0ce7b45cc4b77bf1fc8ba7b923d2b7a914878b9bb9cccba4c8d6777b9a402d83d27e6b0bce41e1a4ae9f52ff88ae45d7a401685be55fac5a56fda72557bf2d21dfdbd1dc4da2ada870bc20a99565f71ce345a02f8e53250a259ae5f3876c006db0cca5df03650a7f51af4550a4dd4d246ea818a642a79d62e4bdcadb9ac204f8dce38372e3b1d6078fccf6bb8becd060db18df13548848f82fb0c1b436e281f10a9b5f6b5034d8289f5fa4739662b709d3269c579c78481d407fe379de4446ed5925f0a29854237ef980a6ac0f9f8c457a9af15735db3f30bf499dd2948b93fc92a2acf168b30226f0403bd40cc6343ca41b33707b09a83acf0d81710ffe75b4fb88d5cebb70ca777f03769f460c50b75fbe9c79b443b96292331f335b8df07693069acbaa7874c13de0ef271bb9f7cf4196901f8019dad4ea96fa3ab41c27c5e60317e0bb80cda6160e2b705ce51ef4a0be1b3fb57d22b235745e209ca85f1fb517e331ee6fee3414c7865a9213c3bf79bdfdda004da27a503133735eb59b6f4941930e1cadc79e14098a7950d6697837cf35023bbd3edbd06ab5bbb51e8dde28fd941e500d5c7842a36384792d80e072fa8da27b9af99c88e2f9346b46cea6ad98e574df68778b496eeb56945e51f26e5d4452060b1d387a96b3da6529eb68be9f1af79c04389a2d63dbd79e447bd5a2e8ce80cedb87948b787f0b8aa8e15e542ace641a8f477cd44fad9d604af1c2abe29600f21784bc029a81b41f9216a6218a0248607a10e53fc62bc73e32e2f080c04d3c9568d30cf69666aaf86e9b8cf27bf6142586101b2f22126309b4e103ebf0b8d127cd135bdd4bde04f9df47123608243e8e40efecee419b0fd68ee9049ba30bc96a90e2e572b7994a97f246162a528573b219895eeba26e69b566be0466032f85fe590848a8160e8664569be1a29848d19922ec8afafafc766669f7705496fc6aeb50b5730b06bc141271dadff59382da5df702a06dc37f21233dadff92e24b415080a79c81397138e2ce6984cae7129f76eaad4831eb36ac676b11118d731f5abedcdaa2fc58a0482d6c0b7905a994132db8406ecc95cefc4ad77aa71a1f6814cc12e6092ad62cbd070aba069f6c67c81587eed68664370f6a2beddb9355a47762067d205d75a2508ffc2097abfd2da21da6b46b52592c029fa31eb16efe03300b6ff7730fe1244bcbcd34b95cefb4730f8e40354d6fdd2f5aae2c8a71bf2383149e75d8285c5d06b42ae315cb9d0961b236e436a6071e8c01b264e5d88316a9e9473ecac02317f28db71706fec74ac0094256f4d5009c6ef639347e0c1e5a00032e6fe20771b3dd675807b91b254fa7ae9073eecc315cdac9b42bc1bf05a39b0ee4dcb668b4a44804cfd596dc0b76d7357fe86599845a2e7dfd07316fd43669b240ffc472b758b7d7e07e445519beb70d41bda1a6345b22a0153f42db097cf96a52df2f5674a00f69ec1be986c3eb933e90ab428eaa5833f010862cda8fd7e483201df5ab2716bb6688daaa1de01ed6b2f93a1c1e35dbb0734297f421ffc3d232c761ffc5bf273704f10496afb6ccb93edb9990070da5d6dd406d82fef4f160fc3a3d49e73c5ade682b8827c73009e550d5499873af03e4cb6c601e3fc961f528440a6bbec999bb97a4ac362a4e67edcd0d53b8c04506f6dc46d67365b28616a856a1a731b4a1dd4110108280ec82258059a77c852740c5100fa6497ff20f0db79199b68bdc0893f44eaa07906ac16ed17acc8a93822c28199b998931a07f19506fc126e592844f7d42f75fbbb94f8580d3c3ac512db5116e45b8bb01b5a12e8d57a4ab06f0afe7c902a96c8e3e93d49541debb115192decfc0129f943dcddf006a1747efd47cac5ebf69225f06bde07c8f3db12c9ca70c256322a3215a26c5c6862e2850c59614095259aaa50127a374812732c9586c5168fc94b97d6100ac1f66b61370625f1f1f4f9c0199e8563d706f585ca5215edf89815014b98198a30d0187e8440d27483531c364c89025709551e3b568417b84cbb58a84ff2ec65e3259581f1ac39181814b40b27b6d0088a8a9a7c7ebdb1460ab951f68aeeb884a86457b0c09475f5b98b0b2f5e9f8ce7535808c050c20ca9e4bed3b48ee2cf326b48c3005efac5731b4ab6258170d331e0aea6919c3c4003c1dc17d2d340585e662ed3208f7902fb2c4a9a2faba06134d87357033de2422bc8add5fd922f9f0d403770bcfd922eb47e0bcbf38e2e2129156c71f3c12c6f4731a7acb708584d8796e1fd2bad5b363e1a400aac2a99db1ac2b257a43711c35a7200647aa34b1b1546b0cb01b9555d182f96fbb4c0867b392cff808621fcf1ea9f997e848905e540abefa00750ddcec3b175292c4b5268490f4a1ba40730a160476e82cf31351b712cc23dd801505472c2a2c4e310fdfcc3b6c88ec02b2154c5a8ccb6a73953dc3b0b1ed7411aad4db8a0e667f033c9ae20398e831b90b203df7110b8811dea469f568bf98b7eb5da26e11ee0f758bb69af4174a59c586533d904f78b3928f7073c0ab1fa0b0c183502bf86d737443c896972be4320d8a1e8c44f9d308182eeb12e0b448f3fcb1c430e2057285853bdad80eb8d03d7f1f52e93c473ddd9825b97fe3fa64265a385911e1e7799bb0ea929467fc14476484bf40fd5f64a5419810de8e99e9db0bfd2fc5ab6da40ad30d6b4e17bdc93c810b0049bfd5f34d42dce8aff035ec403290596d7dcec10f5c348dabad6ed679b49c9d6295cc100c058b3ab22184caadd5ed92a5607cae8e2e93e9c95f2ae5ba58913185c360e0bbc970cae54b1be9977eece7c9eefd68299b7a55e9ff1431e532c94ee910ab9e068f4ab8704ffb2ef5e61296e3cc7e3ac3d6e760aa1abde500b7c8223249651ba99fd6170b66b71cad218cac33e64c02353ac7ca23c7a61ed2b16b2d1746964c7921a27db4dfb9dee65a0012db774d070ef468bbb119ee58f12ce915478f70b412f612100021032b675dfce4a8553b4fd0a5eb441c1b748a504d96f3a8bbfe43f968388810bfc7e2e6ce78dccc850bdb139396f87d093f0340ba292ea394e0c91a7f6c320160ae7dec568c17fc4c38924c0245d1e9450a916760c367f0c2d6003d83fbf9d491e4f93af84ec33ed528155d4b73f5b40baa3630c2ef8e9d6e0b9d41b68bfe4367188da46cb0d1a447997ac0a96840f8aef4f4d1aaa9019ee472655eed91f24d0d0da8ead9d919f048f44207b49cab48876f0d24831ae67777d86ba9dce49bf337393bc28bb35378ac44eac397017c12748ad9ace5cfffe71e423a1f54d9ab7eadfce8f6989db4565e704a674c21d2948d23bf97ea01810eb1848ae18ebdb19eeeeb8b0d7b916d15a41b9560312d786899e8cb701bfe56a3f3e72b1206118068e41cb93a7def925e6963c4f2bee1c42068a34f1e972786a9dfba81fb2de026eaad688107e2e7e832d4a0169dd9b65625bde48779ec117e210453eeef11e545ad917c9d2ca10ff7164952e276422d9a8abc87ced05b5b6598dc4c3b0acc0f9d19dd0aec2404bca5d95aae6ed5259a8c7945a6b44ee52a9981730d829129e040ebdeec124e456076eef46e7b1bcc2d3179acb2c2315ba8c38b18746351cfb54a22dafe43234d1f223c34fcfa567af5bbd7934fdb1015bf6a51fae3e2ce87dcb0f278329f1ad9d59da5fe66592e774bf1a625366865437b8f08371cdedef62071b0918d91a49a154d6f4db817bed171a61bb1978ba30fe401876aee6bbed5485cac25e9ba56e9684ba6a5da28726e7bb421ac71ab4020a607e150e9a5eee07358d47b0b4727ac821d3ac9fc01820f5a3c376ed2e17b0846905d7cc0f6ed57d04aac5a2611474c830e496e970a50a3bdf737de2f156a629d04b840358e14657f4e3fcee064e6653b788e69a481547bf92cffa20840e040ef8cc3077e64a1fe59c6947990d43daad4ec3c2b220e7666cf996f8b850beca66aebe9b45142d77736a2477a707f0c150d09ab53e067ad2de84a90a7fa818f9069e5b098bc9f60551b19f23226e04a0172b7084025e4647b8596dceae28fe1c24c5f5cd8496a570414b148a138b74981cfd244b3dc88705221659a08d0a658d911860c55345eeeec695f3d35c052506c48132b92bf7ed91290b3092bf47a6a31761067e2d8395b25858e28d23fae0a546a293a7287e5dee81c01b59ee321ad515e7130e3a12
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 :
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:
Copy <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