Understanding patterns

Patterns are layouts that you can copy and paste into your theme to instantly change the look-and-feel or behavior of a page.

They’re built on our powerful micro-templating system, which means they can be copied from our Pattern Library and pasted anywhere in the help center, giving you unparallelled flexibility and control.

While page templates can only make use of the objects and helpers available on a given page, patterns can render markup based on help center data (categories, sections, articles, topics and/or posts), custom data you pass to the template or data from third-party services. Our status indicator patterns are an example of displaying third-party status information from Statuspage.

System status in a badge
View code
bb24fbf1c1d450612237ee047dd837d5eaa4652166bd05e97b9cf67a5c99bf4ff41eec3156dddaac53652278a49b0e312afa1a761393e2b818ea6996b5829ea470e6dad9ff25705c17f1b4f129e54517b6b7c3f118e69868daeb99d699e6f5a5cd37ed849226794855815d967ffcb4fcb03ef512a42e583fff0c04a7799589e63153ed36f1a13e4646337497860320f3b1816fe374bcc86a605e4535de7bd1baaccbdaf3cedf98b4d0ef062dcfdf2b4af66c56201a5a96eb0bcd910bbeb6126beb35eba91a8cf577ed52b1088678716fd598281233c6953df87dc51c899d7719370a8ba4fe2f219fa2adb5fdd3590f452ae9d09b629a0ca479d4593aba6ac89845590d09e1a5b13a1c845e9b1abfe413daff648360e51449d38584f016ae33ebc207635f0ec3b8b1adf5526c9f6c71077b584b98c8b18ded762d45ce91838d5dac21fc342c9578956491e28c0317dd74a12eb676a14febe4fc31acf0deedc36cc622c582a0689848dbac89a444283fbfc3c67ee8bee9b4cb4d8ea336edb9a521c09f38e1d2937a1697ec0f382b24d1019554bc6e63b36b527fe98b2b749ca49e48a45efac0f9622aed483b5c131ee0649c1d644ab16360a1d552d388224bc637fb10c74331fc59893071df6d6932e3d3ee88e49aea6d3596e532d03e1ed006f3782d2e422b5b0d258c4db951464ea6ac0badb38c37d26078aad92f47a55435ff86c039d18a45e3bdd44eea82ba0c45cb3f8fe1bd2987bba21db3752b85aee383e9733dea0cc7b309eab1b076f94eec3850fc297ce3b9068107f0d6f891f9168c6aaa33b34ca379bbe92d77277a50e30f02f53836b759f8fcc711c63ec7fa0867d809c05f66ff31087f4e8c48ae3ba8606cce1f7ad55f31b8ab2e2bba4741ab96ddcc676fdef3e0d0c80a87d92a20392e1615f805c933fb01630021fa00c2e938497f7117e61207d3bdd23ea75bc72abeb6ece442c7410bcfd7488dafdee8d6681b91467be14dfe39bb0f24c9a64e64c2f083f4939b53089a99083be01d5e26b1a0eef4007c3d3c6f2ef4b95cc20f7e1a0d1eae0ffcb53b0ddd1ce989ea06b08cbb4697c9a69dde39d7602d65f158b4348b7029150b17b6385f9d22d4f740471acc22beb0a6c630aff05afe32f16500d8f3ee08211491c3ec4ae9f09b160fefefbb9b16ed0fb1b06ddeac88e5f617bc4a06b65b6683803d9efaad37f7d5024cef083791a943f5c1b66881a2c9988d7ce46837103f5e1c4a979ce3c8035a3eca3757202c4694ba215d1c94e8ed7fe7088775ce16c7678067be18bb18c10e55ec6e050e5371a625c4a9dd39fb70da74d4bcb45d3ef68cab229ce89f789c81c94bf248a67b56c76598ddd55b7ff6ba4702bf45b0621017cac8a1bfc06b2fbf155b162495787b323fa34612935700d7c8172783463737f0466859f4aad1bee23dc2c4c44531d0ca4ba5dd603b3c3a0ecc440d6e142ad9e405b83a262392228defb2a5250bb9551e49c0e8dc21e4e0ca176c334b5afdd1fd8f2c37d829a6ca36f9deac18f9c4221933f2b64d4f14317c6c8452e29835723d73559bfb8714309af9130ce8a9e28941afa72948408eb0c71fb1b6f1f206013c5f2956c72623c020d41f4127543907440db745ac0a03b6dcae3c798b86fab69dee82e498401cb9c85f80d864bd0d23275393bdeb85a97ec4931ba729d4624d8136001e6747a5474c66b69228fbca3a1713b082a5d5698afcb933bcd90aaf70581f3a32d4a57a64faff9810819b3884f2ccc38ec30271830eac53d2f8f1cdd918a070a26c282e74ec75c2c5332e8b862c0bb55602b781410bfeef384443f72dc7e1dbfddb1fa9cfcd766c24828b5482b7206984ff54ad8671f5c087f0f87470fcf3c015add45712557c641463cfc30ef0da8821e07d36f6a33133c8a8cc49a3321cc0751029a2cd2718fe459ff2327416df401afc74e39f711cc8e8a6cca51f89bb2a027e7ee31566285bb8893f1561f541c2dc0eb14da7ea7de4cfa524a68e972da4638fc5410e1d8c748f4437465db19ce4039dbb89d6f213fb0a3cb655976ded1a11178166a2d9161e71d1206775ca95f6fa6d8201a2eb411a06be25f5194b4b3bc5a747b1241cc1acdba8ddb90b1d2d25f344fbe62b38476a4c8d8aae138d2207c59cade313a22e1f45bdcfef0d5a0f89aa068002a40f8cbca0f74a36bb15336903f28ccfb118f3b22e90a1ad3f50250d844212771b9935f521ec539e97b60be980712cb74521b65e0fc0e11d1fa52d0dd0d949b65c3d8ce6ac83ef4d18912d1ca9361635254a87e8d37c5db2035b0fe77b24203ff603e9354b7c60f5208ab87f32935c309af30baa149592c3b53f01fce3adc606d82d4437ce5c4de9b93c81025befb02250ddafc1c7281300a7566cea2b97408c46ecabb78e

Flexible, dynamic layouts on demand

Patterns are not limited to specific pages and you can use them to add layouts and functionality that doesn’t already exist. Our Recent Articles extension, which allows you to display a list of the most recent articles from across your help center, is an example of this.

Most recent articles
View code
9d597490d83eab174deefb09e78f220e4f24b5789496b55826567978c450c8977bd34495ceb71090b0d8d6e7ac0427b1a7294ac9e38103ab1fc0dd23e0d97761cc6dc94c1e509e7a7f150dd9714b9baf53195677fe905cac49909e24aa7fd77e5555f260c41dff19cb645d0e17691c93852c10270406f12c680aa7bc6ce40f74823395d558654a4f4a8ebb4feb88828fd5bee1e96388b2dd011f5327aee019ff0d9c8dc1b2f8da4d8e7fc071cb7a54dd858875b1013b005ecd05b82a4b9e05a04523a60c895d47d2be0a6a1c2ec40af4ed19084a0e5e777d30a2d534673bdfa9fe27095ce3ab7a1addeef97b75d3cbe04bb00c840076fb1225cfcc667d6d55fc9220a5cb4bea295dcf8fcd2f758ef35d7cf03a1415282edc5af6545d943736cbe38f5660aa98d40adbffbcc7ab855401385f2e7e214aacd33f9be8d87c2b77d3ed0dda786634287d836c0ace98a69b2ab26ad8a5eb6d30d4138903745947e5f20ce624a05315a8b82cbc64a70c9b2eb092654e4a462365c5e123802742efc717968db47ee61d51d2eac941afa57e4c8c5ab60dcf73ef771c0d13a1268fac0d0f771b2eadb123a7a8688ddcd92e38317bf71709ec820e066b1a119ff34a6d31c6849bf6060e286ae918b7907ef1bc9c7a38321a697d35d7ec280b74bce1ca7a312b65f24979d566725ddaf332cadd5d23820399a0b820fd1d98de01b6c9c50ba2355a7b78d341e61c15d3687e9e969bb1d5fc935f1d5b9bc3ea1515578be9d31d818188747f36abd86c2d761a37f7b0e7d4174707c0c3277a5cfaedd3c1322d8bfaa558e9f296fa282bd20c0e06f7e1312d1291c7297ee375ee5dfdb4520685ba6848da8a5833a961f3720e62677fef5578f05e511c42e423edf70f0118b8773c5adcb287dfd249b995f0bbc314d6f6683a52bcf6c9a09c0cfb0e27429f3a0cb4a21e226040a4415b23d42f003716aba1a0ae0e6b642cd3ae1cd422502bf11445ce58bba04e35edb728a80d90e0f714fc8726684ca8662d3ad3dc06fe6fd8fe3bba630c11146de03499f09a021ef271a1c343630ef4d4da18a79c895bfbbab7f1dd856473e4ecf7f53628bb6bd6da5cec2cd91bc87d1d17b0a6b81b0bafaa32facbb8ff0f09477aecd601a7fe8ab0e924c3e86cab4e3004e6e5fcb18d9c2881edc3223a4c97dc98e544a3cfb01b986437c958fee79ce7e92b9d53c7723a6fed727c1377ba1a1a662b3af8de4c8a32011ec5c2b8155b7cbbbc3efa40423430a314377004f5d3cc0b8ae78b7a2b2380e08e2920e1400e59dbc1ca5b21fe5f6895400e4cc900996eb8955a39b9867eb0917861c5c871c4477ed06ac37cb98cb0c26508e0076da721a836b68f71c5fa5a7d8b6cc58c268052f80a01561b7537f5342bc9473dcce8ba61f3198b7e63a362f292cb26c92077fd10385629ec9febbb32fbbc74cf0a44aa6c4d055f85af7ee836682ea772982a3cd1633ced8dd0fb02d36aedb3f346e25de068a6c32c0b0c51a390025880dde644f26a7b032fbc20510fc47c425f362b1cd33b1088705200b4b0a3cfdbdcaf6ce7efd35c0f463c7e4d80dfcac91b7e5cc6c659f2bbc216967834a735fccfb290ff0321fabf3b2ed488c3d33e971e597649bea0f2854ac647887daa005393247891acc51344e8085b9d3d065bb6816c5bf45a0df99ba6b5d4eec87ae62adcf848bf3d8689a2f5f499d1e5043b73c4ea535473f9e1018927f3f329898532a67ebbdeaa11c595c11eb3a9a4950f1df36fffc1acfddcea0afc4a27a274de4555097521205e3e7993968ebadd480db84e2696bdf889c5484a124765fc3e91720e624a712675fbcee7050f7c4db594ef2326b0be7ac729aae71c1b63147996bdd775c2a9aa61e5f56eb7ce9f5a01935a3ed35758356795adc68142a24597489d49afc730d40001bbbdc0fe560af934e9c01d3716fcf5371b6c73a7d82a229533b303480ff6c5f5416d5fa74ebdbfdf377a9f9a3b23eee891932052a8e552353b54310e3c64e035b3eda71fb146eed48d489e28681d2b89bf3513d2dd613ad9a7dcf7e4194e4b53230d5b9a664d815be78594578855fb8be259ababad41711e42fe80cd26e5dfc7c5a6b64cc3fea3edf838d734d419b80ab885815e97cc4db44a966ea0c567515ffbc8b42d2078cac253c5298281fa3e413736315c10c3df3e256433bfb3deea623542483c5073147d1d188afa1c5bbb7d5b03b05feb363cb26329740383eb6d8f5a26d39c86bf56e05751c3d95f2ccee98bc98f990c39ee76822803b24022fbe1267caa6e3f871ce5669ff2b3f7261cf35a802eb72c8840b2f9dfd779793dadf551c89c800db6e1d4bf10ca31e74dd3cf7725cf3e34644f6956f2b454f7355181845cfbd44772b593ca5053fe856b47a1f360ebee6bb8140934ef3aa2187277c1fd5e9ce891c6e193ea6e90700f21d2cba79af2fd7d4088073bf18b3c9f57cb2174880931f3cfece4ee9f82245bc693879409434be9a7a63a56bd3aa169f37273626b1363ed6da8786029d3aea4c170e2c7e33c71bb5d80f514f6ae9711d499a10216ee0ac52d3842f88a8ec77ebcd55efadf2cec1f402090e5a43ef276d66242b06c6f5269142907333856b7db576c792129a0bc71c6f3c3cfab8dda981680c61a6fc3ebacde9f6d84c98d4f2fb5156fb89b7c8b864789b65c59d58356e5619294e567d163ab8b041a0ff48a645e27a2279467e4407ceceb87f0c190d09a04d4fa99347439550c498ff7e09e2b424588d5734e20ebaf7193b0f27f370c1b2334c6bf1388cfc54f921dc59cbad15b615c74f6719dffa8825f939ef4caf021ac43029f35dfb03aae6921b3a5d216477b339e849656f011f5933d08cc503ae394922c010f41c7fd40e333372179296dc306f5a2d66bffbf4ee3b5972666d995b7a659818a0b988d1a1ebe65dfeca02249c63853bc0ca1ed6060d01b28f5a0d200f9d7f977660ae45cd8b4363d9ffd383c5bf3262dbbbf168c4292024c3e9fd601e3c259adee2295b79b171593fcda9343eb3721a9461ba68c7083f7cd4bc36a3a227995e9aa176f83c22fcb4e172168ac1bf72451f390a7a740ecf8d38f182d1b3ae8a2be6f3389bb698874d2bee32d0212d92cbe494f5aec84956ff70a0d9c0f072450e44a00968a108f0a23e359e7bdbd8b5ba8e7e431a63daaf0a7fa532f29f49253ab81568f409c3a7af0da67117bd01e9c9302ebbfde320c8578ad1070e28169e858451dc3805926ac04c025b3a0e85cf71714d04136ab988ff12a80d8ef16b61b1c8271a16e04d2bebdbf9fd5e33ecef618dd4318ffb002659f68ca2a5f52dee4e10dd9fe15db378c5d6ebe175c6fd39bea427369f3411ea4c520f868611d6ebfc0f96d5bb1fc3889e7c0b3d3fe6a1bfdfd871e561a220fa2475166d7d94fd4802f4eff56ebb981596c8f8f5ca2fbc2f371704c905b56c987f782c339b218b92d3fcf49176e4a5776cf3eacfdbd769d38bbe675056657ef3f03622e6c7cadf3b9a5cecaabe8c46ebda7b016dd5c8726e31a32f2334de1fcbd8134b9899f651e20c24413dbb9a25029c711ba1ba728a7b0ad128b6479690bbf787a842fe61120f759cbdd1eb2d2af574925e9c7898d2b658bb7c6641af1ae75f4d688a1ce457268a05b6c75efd3f0bf67682035c59443da4e79b73f8295669e109c0c17f3c26cf5dde7ffe033e27e028f4359f8030eba2ca9a3621702b8c1705afa8708eb2de5b412ef5eddf27ecff5a48a0482e043a1bcee235259098cd031462e95a4c6f29d3772520fe3df4a33bfa2a57c6c1a4aad825124db9faed95326dba82b512c84302a1c0004cb7b21c9dc976e749cb8c7bf712f64b4e7702e5219edcad280bc945d8584463d97f0ec626c180b64312784b9506f69c57c80000f9a66d14b0a58834ed68693cb2c5b9a3d53749c085cc2914a8eacd9df600be7430497325be9d973418e754c93191388b4936334afa6edc1c0a1ace0c47c919a5ea4f97fb739ecb541f02fab4cef10e8bdf5233edcc8b3d8b8678e8277f2c39d548c76b6a26d1cfd18e4709d3b647513e8068f8d36f6a4dc03951319dc84d959d08ab7acc045e0d497fb8cca3c2e343c0a3e228787bffab8b8a61307127b4dd057f924fc3a2ce264687419b376861f415cf9ee59d92de5f31c584c4af7c2d968bd334bd460da4ba8a2d68810af2bf16289f5f86ba881ad444c490a14ce3da1b62212ef3e4492d13f5e90e485937fd8d903cb7448c23002a3ef31d5f8339984dad294053f499e5bebc2772b8adeb99b9082f58756b87830a5c53e2f974b0310516fba5d865daf48ed1c2ae9b6fe1fdb108a654b6319eac3f75a6891e377feb429a17ad34cbe13e274ce6f3cb362f0d3e503cb9ade82f807cbff730bbdab82e7a397b65928b9fc9f770f18d65ddc7ccc8886b410ab633437c422f29efbce878b9d6648ff22b918e0b5119bcfbbe7bebd2d3b39cb903dd2e5c44d13042e336d26ca755d88d46fcd497a06637f76691bbc2c3951063ddfa03b2f857bea8211669e55cfdd461fa4c07b21e34c6bc22cc05a0c62da84691263edd9645f16e9445c79cdc1d3413f0a193869f5276fc0e5c9c0e41522d268d3ff13ebd60cc61b444fa9c0a030553bce212c7147aa8547929aad0ecc811a623ce11d248a5b885713cd4a26d2679721f0306a24b8ea3994522645d7bedc302f69b7a9f8ea02293d4c660a107351a075986b15dbacec28aec97001bae89114292e626eea44e64680b570444c0f2b78365c96cedd6a11362c8f63ae4f616be05e3b390961f8ebda2c7bfd32c38906c7910e6f75ea4f17f31d7511557056993eee2319992262f82a670bbba4d7cc27ad357f49c9cffa6f5423b09e8ab9e0b60129999295ad787483ee9dd97ffbb169a7e9f51ec5dff3848c936749ee3c65d4b5455706baf901395a9e34c03c0d8a5894a909d0a7306337686d33fd4e0bc9ad16d0722308aab38bc6215d6492bba26286cd839a3e5a97b87720a6395f0d5559787352972c5c818b6f62cd8acb2cd04ee25a34b2b69ae7009e26ec3c65f858097f1ad380c8b050654388da2c3e275c91ed1c29137cb26c18fd08cf4cd46fba23aaabdf40d84ca1011bb3814d106ca4e3435a8f11651f967964dbed589bbf3f3986df7336c22dbeaac8f819908644dcac5cbb90937ec9ddcef4daa76cc0f3730a5a104aa2eeb24071af75cff7ba14588518211c0d2e45a1ff0d1a46b7d3da5bc33adf33efacd9b015f0518b8765641485ef93528909e794ab2312b154f2c1a014d49c4f6dc6efe55c24206d5c7dd517117579eab89bfa5a7086a708e56859e164c4fb1786dd4f7c516a16648e9a197a622ff4047e8aa67e1614293d97c69473e828361057c1506b08dbaa7d3234c22270337e6f2e46d8ae9678dd86aa411bb0a5aa1d1a4b37cfabe4723b402d475941215c39b11b351a6b3f90d5297d1154656bffd8f9eaef40b0e82895265382756445a40fa4bf2cf3557efba97827a17c025e5446a6a9aa2c1ccd8e0f54d5549baa1999064a85dfe3ca236c72b04fc99d7882e31741e3d702aee5cdc7fb27d8bdaae16588af51173046a29bdb6a6f9cd750269da4d31dbe2ff12a9a95cdab6da14844d2d99dc688deb76b0478ee4fb687ad68319e5a9b8bef4fe1e80b1485d89e0b58691575ddc1c8a729b43fa55f5604c476306f80d47ae9ce18f41ac720d3c57c56c54ea40e0e2078bd6c2167bac5f662c77abae242b7c740776f32223ad78063d706795948e4ea65d738b72b51437888128bc48bdc2a5c9b2793efc8f7108f99947b09fdd96ef7783d468606c1d83af98a4e6c7f619f7e7cdc4a2ff75ce011b2dff9de6aa4f7d154df7da067369bfdb704bfaa1cd4cd4d050e5dc6d7dca4527477e2d712a4a049cad7741507e795f81cad99e11b89b06a396b8f327336881e69298f3daf2332802d5df403a481fcd4b587676cb31821debf164cff58dcac265ae8915bffb36a13b78431772e857d32292315d1c58879c1dba8516202644e455eed104aee5286e560fbe573f8c0ad2703782b15d247d9dbcbb536df85bad5fb7029a9622da33c44874a4a76357e6f31a5cb2709a63c2eb65da74eaa8c749b8a2ffed29452748a6b3b7eaea017a5d893ded116e575047d9f75be18aec3fdff11cbfb19d23b4f891697cce5f98e3e166958631c605b4847afe069c0c33602c7351304a12f6de9cca324468211af6f1f733b92ff226b130ab76c7e3c00ccd912835565ba2a4b0093f5760fabce23ef973d580cd6b8bba62bc9f2645bc1cc8a42cd690de0637b4c1c5927a106828c8296642b84815851cd96e10576dbc453f5474a751af0c3c6fd9ca49b7e5114197782d7fe61c5e368d8c6bce71a74cc58107430286c609ebd2104175059fe07967b6cce645cff02e33c29b6129b9be0f2e920fcf021c3cd228e8eb7822ce7d0db9b5fe8b20eea640506074c96e0ec3548a86a81b0c339cf65ebf424fb34e1f2429957e79bed5f3cd0f5a7dd2cae2e4fb924b45eeca4dbbfc46bcde530dc131c2d34e513c9aaf21c04c54b0d7c3e74c4e2c054

Our themes also come with many configurable elements, like content blocks and table of contents elements, which you can customize using patterns. The look-and-feel and even functionality of these elements can be completed changed by copying a pattern from our library into the theme as described on each pattern’s page.

Because patterns must be copied and pasted into your theme, you must have access to underlying templates. To get complete access to the theme source code you can purchase:

  1. The Developer license through the Zendesk Theme Marketplace; or

  2. A single theme or the Complete Package through our website.

Questions or feedback about this article? Let us know