Provide your visitors with access to the latest information by displaying a list of the most recently updated articles in your help center.
Most recent articles
View code 570a40315fa9a601561bd6fcd3d3a4a3dd637c91733fc2a18ae275be5af6ea210fc43f9d3d9e7c8d0e54ff155fc7ed2d4d32d0428b9acdd4ba7d93abd8a75c08e57f62a4039fe079b6a50dfc85e4ccabe6c5dce8671ceb13a9f0410c631d373489d780ecc74426c2480dfcac70d4ef950df0073e3a1cd3b6fd2651f1ffca3b7d7c47676c6910bf8b39d1287898a2cb476d3dc629045b5adc6b127a11c8c34c98b6c5464581fba027c2f0202da4180b3804a274bed38a886ab97fbfe2d35c0e67fd9ad40bacb9ee449fde243aa739684ac4500e1f48b0c6e50efb0aacdc6af2ca526f9845c769e083ddab89937312336258b118c2d7818b9cf8ed3ef3d19f6b7e07845fa825a391c130f42bcd709bb8ac3aae8dc91a490a278a07c70ce9dd3bbf9c547a31b930cde0c06e3ad277d7dd83a9fa7c1ca6a8c6271a2cee4c4a88477cf449ea443b8c600df2aebd6e7489624fd5c1e12d741398828218d20f181befdd386feb01db86b4b94b05f8058fb70d46900768f1187a680b2a38650bc8393a4883589e477c2c80d39e88bb7f4eca13a11eaed678eae7314fd132ed5ea7ff2bf0ed44b50a24ce41a1825b3f54f76a2356feb83f22d59a98d6777bd111ab14b2af1615316cc965c58dbea44ed07ec3bf5e2236d601737d4c9f01bd0a68ae6e1103bb764c921a709cdfe2c3f6f612d1c5ea0f9e464ec6e36d297e3d4abfb05967a2dc6b30b3aa59e209dd4e1ead64f1bf79de5615984c244d55328d3188ef9d728c2d843d64afdc5e3cbd9546dc28685353fc149c4a6ed772f3ad6064f7f865840136277b7314aaf4ef06c556f60f1306be6b9553e19d2fa272d2481056c16c9d8c36b591d7dabb4f0dffde25df14723d79dddaa43bf43a86ce7ba61180359b135f450af20277ca98b4358f9b77adc7dcdeb48551ef480241149d69b2ea9e2954cd69e634676589212eabe5aa7e3297673b904df55cd7a528fdd8cb5dcdd286972d254f0fb5bc632c39fe44f9f36791fcee46ca3b8a9f21cacfc9dfbfbabb15cb35a274f6a04aec9942a444afe7dd882af4f5b9f636c9e9b39e6f3c4df9ee82b66aa0fe9f79e81bebb52d226cde28a72865570beabeb7b05785171c9bf721a2d037e51e849814dcfe0ce000cd8f67ffc8353d76caf309c1173809fbe211b707d77219cbae7ce9eea85b6a9ede30449cab7dc0e46895cfca2cbcc78259651369454a4071c94afdc7a6f22018743ad456f90658b99a61c7deb8ca19d6112ccff3f6f71ae991e0c9436ad15ae2f4457f8ca6247a5f1426f87bce809caffe19a71a8c0d794532d049d85e5384bd9171197ae5f96e7c91d7aaecd01c7d6205980e17381ec7a20b32be1af8b6041c49f528a6df8c1a56c737ab7f566d97bb8b80dea66042b587addd5d97a8a6ef4d25357e2cd6d1a6cc01bd816938b3dbb34e11eb61af1faae1d2d3fe052553d11a9cc915494211474327044c778b520cfdcb8defb8fa69e1c702d1d616cdcb05e6fc1f86638e5e3aea898fad0cb182b2f91bc0faca0ec9a9400939236b84d1f47b35e7ce5dec3cae18414ae035ca9a326997afab6ce2a6b2d1a86e2e1825de89c3bd15b3083b6903f9efd95f19097a9f5cefe57b5ec729f7b13718bf9b8243dd71f4319b69c4edd61f2bf17d27e90da9fb9794fc2919285817814c80eae05d5739e81b57e7f4df709ca6041d1272c0a2f5c2bf5ff51fd7cb66d1c0d5c89377da522b0c52007f60de6996fe5a123237c75e5f798e269eb2c542ed89f81daec967587155e52d4dbf89332dc062da0f3c5f6405f88af5283574277f2d13182e91549316c0c0784482fbf5a365cfeb91ed31175b971f7b9bd3c6c2f7c690aa122dd4af9c4da48e0708d797361b91a1c236e5e6bf41ecb1a2e0cdeff1d305f693db93d69068a92cc522156ef13fe366e394de90fdb44b76f2e849d552fa5c165cafeb8cecd75860570a5840f277cfd988ead2ba76561745e600f35a62055007c5c355b7a38a3cf9023e6b519178556af09c776fedc36dbb9a26ec5c09b65a53c241883d69bde9a751be6c7d381a545d09f6f23a0e00cd2eab086f0d4fe4b96f891bd7f587cebf794114ad5ad223578329b842e614026641fb94b490702742f9ddf35c4ec020df5f4ebb9b99515a8f9c10b419d4807489800b4ee14317ecd821d07b596477c29c03b030dc44a29865c2a0a3e69c673798c2f59f110794b73890074101bb4c3a40d0c205126b2cea33d76744cf98f478c5a1156514b7f9ee2a6621894e87d5678c1554ace33ac096c97cae696890ad4530af084837a6d3fcdf112dccfd75efeac033a8c59d3aa0c03d7e6b715220b9cc7cc7ea83f672388a6d79480a50ae04467273e8367ae13bdf5442f74b0da5446d9ef24a563b6de55d08a892fe96f2f44437cdeb780b46098ac5508ba9d616cf29cb7c27473aea87c4e12a6f294a564a12dee2f0938839e956c95089ab86a1c8e0416ddf17b5fcb76b6a5f9458b07025642c3a3845199dc43705c04bf12887b23c98756b1f85f7cad27d28d0b99907e1ec2afd7c7492c71a49accdf7566ffbd2268586b2a63f21fe27105563e93179d140865504fe9ae2456b14c0243ed918beec4ed0b50c3dba6e1ff89c9f92ab237319f39d1461bad270a5963a27a5ba74c4be861067147ca0a340f63d56a926795dea4598f39ab6aabbfd0db0ad9ba017bf459f1ddaefd3ae3b18d536a96c50387b33ce231776106947eb7c21b4feda37bb122278e03224a58a04265a302f30cf25ec2bafdfcb5635b9c06ac883ef8771cec1cb295912b64c52aa41f7d9eff72788fbdf0350f64173e9e583504fb6a9e4a669757d4d6935df77cc9778d4195a4642d700334d1b5958c64ac6ed41dc8c2913bd757124c2dac577a42c756564fec7ffe82788ad752c627445b446ffd349d4e854126efb66a4011c22dfe29c0014dc9cdf90f66d6025e37911af3f04c7e7a19b40ccaadb6b5ffb14957771481d6cb4e6b32cdf18c270ad6163c16296f0a1b2c8307652d67907732289824115da9b7269433453b568069ec2d9495b1dc59535dcb6f3a065917e9a9f6b80cff494b04829a7f6d2142f79c0e9588fa475ce09f28fa3b07c59238ea7203db8caed2ac93c0f62ba010ba123674feb3426ad48621572455f61233fc575d90ec372b94563cfa92ef73f01780153745d947c84b45c567ddb21a0104ea2cd784fb2ee8a97a9a79492a43060119d605f655ddc736d62660d2b66e339a1cff7c2f0ba5440dffd5082f6b5db064b2ef170f440fa6c4a62205fe99d9433bc7f98149e5f26fdfb18a109ece956b18b16439f5fbc38c89853841806883f44a27fff49b199db40e55e7fff8acc3d833d80645f61d95a7d9257d9c49d6130ff07cb7194146764d2fbd9cd1740f3d8d287a85340094ad4b5f06bbda87021163e8cceb7a4d4081b64dab54aebe0426b1f39f2ba33d5233edfa66036870647f289036e8a2563c8a5d7d5f5fec0f50738327f762fc396977d8788079653f548c845adae6990582f8bec40b1c5caf6dea7ff2df773d2aeef12181408f5d13ab95fac83457720e972560a11b33f61b1d4162f03ae17a1c22a8e62d37bfe5ebcc06941ce295ac56dffff826276f624fe1267614389fbbf0a7840dad75bbdd036e11accd4c90b36faf19b367e8eed050fb096c00be64067f9eee3895003b797d508ee848ae33f7d7be49579ffb55f1c67bea8c9e98ef86a0a363201670dbf8bdb94d391a9ecfec6ed416aaf0a3bc9ac12ba1f4ca9e8c0b9119b4fe0a61763f09fe58780223972edaf4542d256ba0b5dce56fec61a03e41559bd12fa107c4295fc0025da8a9589ea38c047ca883b4426f89e58e906b59ceecf4b4e0f13cb5ac408bf4b5984f0db174e17c002391ac3db60be23a52503a1a0b873e85e3be3fc185a492fb7d9973c415dcce63e2298d6a48b8d38a0f054c430aa074159ebab7454014bd1efd8333c9514342333de73fbe3ac699ccbe664c37132d013430ea933ad360d3332aa7580ef71e0d5d70483bf9a980d34c0c9ef60f688244967d3616541447d2e9f04ec95e0c8ef5254d03d55ab5d4206286e1008931fca02ff4df65697983ad9d9728430769f22fb3919e1c5c197e302e1d80f4705ca66cf259fb0e8f0ac3016d537730f8f8a8f78375249da52afb8110a3263f3417cd546b6bb014f8de3628633f01874d60a130959a5e8c318135e771ad2712bb88e56c03ab63d55728c41857a6687bbbe28615dd56bab61834fec64c99affcadb5eccdc6c71538b8245dc7c93d3e46f205dc89e932b587f645f105b696d5b76c445f40fc5bb5b5b1cce8952df467ec3f0dde205203ca820b51d36004e72f7573c3beb82eba109d69267742dcd4e63061a14326deef6c2b3c83719d3298ce27540ec13576c0c3836f65505f223cdaf2e4e8d3c970bc78bc29497a6eaf267667925b1faf195006365e0fb00fb88ff2eac39b575118f556ae74df6c014d7a68461b8efc90efd42c1a3169fa7da33887d190c1ac906d4faf949934f4d85dd6a4cbcfd1cbbbb1d2a4de635a3fa072ace7332f059ddfbd9f5dccf701c8e5bc7e09958a8eb57eddc84c4841fa560658b902a745839940ce30f77461b360fc1fcf11fa0e01967e4de9b68c074e8fe1726f9329c7facd9c824169de2371304f3f41b53b1a42f9ac57e1cc09d494f834a0f7818b952f3f1876f2106069469867983da6de607fbf90ecacf2a718544c36242e5c98d838889cb01fd0765bcd9810106a85a77fdadd638594b70a85f281250bce5024364c71115fd544042539ffb7d6afe1e132abbe03a3c77440f036613424b7f670a6c13e82d6153c51e35571e161c6f650982edb858d71a45987a591731bffe9d69df63c8cdb6eb95610d57aec7fd8de8f0bee1b119b4fffbd854875e438e4397ad7b8d36e8c6ca28417ecaea83f5cd928c006e229d344bc36e2a5c9ea9a5b9923a95aff6bd0c4861c99f26403849100387173e68fafdb8887f1b516703330ecfbcf78ce78da04f7f2b2363ea5c2a7e6ad84704b02b25ca716ed6a937bc6e074875f869ee333ddf5084368b93d4ef9b5a455d2227e48a0a768739af60504af5ae546d3e1ba8599c238f8f5c58fc07e37a9172dc2fb8af3e41f65615a99cf32901fb2b3ea986bdd1c4dfa44aaa46e3a3766cb21b2ae9cb6f11e36410fba88c492d9574a3ba049592fac82e49a8972b69748f13197f846618ab3fb216bf8cf9ecf06756b1e8ec2646551e9f6790d389402a61d5d010ccf5d93a78d8e8e7221ca2d95da0c996fa7ddfd90c90a504a0f2d029aec4d2b9c7c522056c19d7b1b3e45c535e713736e9177c57f1bc235374362f72dd1b4f7833b363c6ae0f5049461697bde850df8315a17dac3909a19e6c71a5ffcceab1de18f521e4211eddb8c33662a161cdbeeb8dd4f9b73cab4281f10cc545cefc83bbd42a2efbafb967d29ab8e8feb4e31d00975ce773a900f3ffc558b00f73118a477bb025fb42cb08612c253a6e6b2da303632b80dbc305c208ee55987e2160bb61a44a2c6d6de3c2706eac218a1c160991e2defc5599496a4a7fd4c4b28d181ddb6b52c41b9fb24b1435ec8540018e73c6e1e66d9dfa180843249cbed7d6b5f4ffccd1a6a3d74d2dd3104fe0fa563b61fb5d59be461e988bb496a5aff5caa75abf855035d68e3f7970625b10c2d0f95942c0e9776cc5d5bdffff3c6bf7bbb196e7c26bb8dfcfa5f765befc48fde0a3eecf238a57d65908a5a7f49d8e3ac12d6b087dea2cb6800ac3bfc4c013b5d77c83e925e220708edf3f3313a5e11b435351810cb5eafd7a0cf508e28220cd55bee723e25b8848d7d871a221a60141c0f6476553dac6fe6c34152b932be086044d714e0370158603dff72b95f7bcc0aa54ff4fb217fce332da79862bc475809beebbacc0e07813d553fcb337d4ca144b017a99148afa6a72b5424c7363993f66db4b43d00d0d04de92ba0f25d93a2339884b2c8d91bac33ef6fe44aa00f32445f8be92d58251f15dda2f17d90d539b1a3447f5a23e9ff1763c485cf162ddb02a698c54f52154c521f1ed7e7e4ac6b4f8018547fa19025d1f04f22ed248e5862ea053f5f40de41fac8bdd56f933c93bab84920ded562002b99af6867a14fee9efee8ebb6a035bcd38c4ae1e6681271c07fecf647c314c0e9b030643d2ed5b77de5ae39eeab623454017b4534c5d075c2a0ef78767aab5a4e95d9b7c4057d50243a31c334be4bfccf30dbbd825dda772ffcbccb17ad29fc94f3a7fcccc964d115b61fe2542010c262b8eaa07b1adb25c4a34a540a0a99f5c49f3e0a66748577b73462953c57ac49060a534c03293b56e1169969b065b00e733a5d7e7a9a32d48b02e57558d9539b0ffadeb2c67d0bba5db2bd9791d475d8367af354661902cab74d82568bfbf60d9d7a8cd4f1b25ad273c2095efda33bc7dcfc1ae577f81df8ee704879139971de606213a882a6a9bc1e42d0e31f5c2072f151f792d8ddb05feed2bc0dcda0f590b9a93c9e20514c3fb02763721f251bc7acc001e08817ba0fb5aac0932de1515e36693d5b307f32e
Lists of recently updated articles can be added anywhere in your help center.
The articles can be filtered and sorted in any way you like, for example by label or on the basis of how many votes they’ve received.
By making updates to the micro-template you can change the look-and-feel of the list or add new functionality. For different article list styles that you can use with this extension, check out our article list patterns.
The recent article list is displayed using our built-in Navigation extension. You can use the options described on that extension’s page to make additional design or functional changes, regardless of whether you create the article list using attributes or JavaScript.
The example provided uses the data-element="navigation" attribute to create a list of recent articles.
<div data-element="navigation" data-template="recent-articles" data-properties="..." data-template-data="..."></div>
To make design or functional changes you can either edit the default micro-template or replace it with one from our Pattern Library, updating the template ID if necessary.
If data attributes are used within article content you will need to ensure that the allow unsafe HTML setting is enabled within the Zendesk Guide settings.
You can create the list of recent articles using JavaScript:
<div id="recent-articles"></div>
<template id="tmpl-recent-articles">
...
</template>
<script type="text/javascript">
ready(function() {
new Navigation(document.getElementById('recent-articles'), {
properties: [
"id",
"name",
"title",
"body",
"html_url",
"position",
"promoted",
"draft",
"section_id",
"category_id",
"created_at",
"updated_at"
],
template: "recent-articles",
templateData: {
heading: "Recent articles",
maxArticles: 6,
excerptLength: 120
}
// Additional options go here
});
});
</script>
The example above supplies the same option values to the plugin as the data-attribute example. This may be desirable if you need to fetch additional data to pass through as templateData before rendering the list.
