Title: Jetpack Top Post Short Code Last modified: January 18, 2018 --- # Jetpack Top Post Short Code * Resolved [bebibu](https://wordpress.org/support/users/bebibu/) * (@bebibu) * [8 years, 4 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/) * hi there, * is it possible to have Jetpack Top Post Short Code? * i want to add this code to my pages (section at generatepress theme). * thank you very much. Viewing 10 replies - 1 through 10 (of 10 total) * [Dat Hoang](https://wordpress.org/support/users/htdat/) * (@htdat) * [8 years, 4 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-9876384) * Hi there, * Please use this shortcode, which is mentioned here [https://jetpack.com/support/extra-sidebar-widgets/top-posts-pages-widget/#shortcode](https://jetpack.com/support/extra-sidebar-widgets/top-posts-pages-widget/#shortcode) * [jetpack_top_posts_widget] * Thread Starter [bebibu](https://wordpress.org/support/users/bebibu/) * (@bebibu) * [8 years, 4 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-9879927) * omg , thank you dat hoang. * but how about the parameters? let say i want to change the default title or Control the number of displayed posts, etc? * Thread Starter [bebibu](https://wordpress.org/support/users/bebibu/) * (@bebibu) * [8 years, 4 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-9879986) * ok, i got it, just for “title” by the way… * `[jetpack_top_posts_widget title="Top Post"]` * my problem is, i want to make Top Post with this parameter.. * 1. Top Post only for Post, exclude Home Page, Pages etc. 2. Limit the number of displayed posts, ex 5 top post only. 3. Display date under the title top post 4. Source full of Top Post parameter for shortcode * And the last.. * 5. how to customize top post? font size, color etc * thank you… * [Dat Hoang](https://wordpress.org/support/users/htdat/) * (@htdat) * [8 years, 4 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-9880009) * Hi, * > 1. Top Post only for Post, exclude Home Page, Pages etc. > 2. Limit the number > of displayed posts, ex 5 top post only. * You can use this shortcode with two parameters: `count` and `types`. * `[jetpack_top_posts_widget title="Top Post" count="10" types="post"]` * > 3. Display date under the title top post * Please use the filter in this guide [https://jetpack.com/2016/01/12/hooks-customize-top-posts-pages-widget/](https://jetpack.com/2016/01/12/hooks-customize-top-posts-pages-widget/)– the “Add data before or after each post in the widget” section. * > 4. Source full of Top Post parameter for shortcode * You can see all parameters here [https://github.com/Automattic/jetpack/blob/5.7.1/modules/widgets/top-posts.php/#L457-L465](https://github.com/Automattic/jetpack/blob/5.7.1/modules/widgets/top-posts.php/#L457-L465) * > 5. how to customize top post? font size, color etc * As you see here [http://cld.wthms.co/umHWId](http://cld.wthms.co/umHWId), please use the CSS class “jetpack_top_posts_widget” for customizing it. * Cheers, * Thread Starter [bebibu](https://wordpress.org/support/users/bebibu/) * (@bebibu) * [8 years, 4 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-9880168) * trying to customize with this tutorial [Ordered List CSS Styles](http://codeitdown.com/ordered-list-css-styles/) * with this code css at my generatepress.. * ``` .jetpack_top_posts_widget li { list-style: none; margin: 0; margin-left: 3em; padding: 0; counter-reset: li-counter; position: relative; margin-bottom: 20px; padding-left: 0.5em; min-height: 3em; border-left: 2px solid #CCCCCC; } .jetpack_top_posts_widget > li:before { position: absolute; top: 0; left: -1em; width: 0.8em; font-size: 3em; line-height: 1; font-weight: bold; text-align: right; color: #464646; content: counter(li-counter); counter-increment: li-counter; } .jetpack_top_posts_widget a { color: #444444; font-size: 18px; line-height: 1.4em; font-weight: 300; } .jetpack_top_posts_widget a:hover { color: #efb93f; } ``` * but the result is: the big number list disapear, * screenshot: [https://prnt.sc/i2idqn](https://prnt.sc/i2idqn) ex weblog: Qarier dot com - This reply was modified 8 years, 4 months ago by [bebibu](https://wordpress.org/support/users/bebibu/). * [Dat Hoang](https://wordpress.org/support/users/htdat/) * (@htdat) * [8 years, 4 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-9880442) * Hi there, * Thank you for getting back to us. * We do not support this kind of styling issue. * Please ask for the help on this page [http://codeitdown.com/ordered-list-css-styles/](http://codeitdown.com/ordered-list-css-styles/) 🙂 * [theurbanbrain](https://wordpress.org/support/users/theurbanbrain/) * (@theurbanbrain) * [7 years, 11 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-10437501) * Hi, when using the shortcode is there a way to display the image list instead of a regular list? * Thanks - This reply was modified 7 years, 11 months ago by [theurbanbrain](https://wordpress.org/support/users/theurbanbrain/). * [Dat Hoang](https://wordpress.org/support/users/htdat/) * (@htdat) * [7 years, 11 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-10442721) * Hi, * For displaying this shortcode, there are 3 options for the “display” parameter: grid, list, text. * You can test them out: * grid: [jetpack_top_posts_widget title=”Top Post” count=”10″ types=”post” display =”grid”] * list: [jetpack_top_posts_widget title=”Top Post” count=”10″ types=”post” display =”list”] * text: [jetpack_top_posts_widget title=”Top Post” count=”10″ types=”post” display =”text”] * Cheers, Dat * —- * Code reference: [https://github.com/Automattic/jetpack/blob/6.2.1/modules/widgets/top-posts.php/#L83](https://github.com/Automattic/jetpack/blob/6.2.1/modules/widgets/top-posts.php/#L83) * `if ( isset( $instance['display'] ) && in_array( $instance['display'], array(' grid', 'list', 'text' ) ) ) {` * [zontir](https://wordpress.org/support/users/zontir/) * (@zontir) * [7 years, 11 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-10459470) * Hi, there, I am here simply because I would like to have two Top Posts widgets on my website and I want everyone to have a different range of days. Is it possible to do this? * I see documentation of this, but the code affects all the widgets on the website and not just one. * [pmciano](https://wordpress.org/support/users/pmciano/) * (@pmciano) * [7 years, 11 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-10461732) * [@zontir](https://wordpress.org/support/users/zontir/) * Could you please start your own thread, as per the [Forum Welcome](https://make.wordpress.org/support/handbook/forum-welcome/#post-in-the-best-place)? * [https://wordpress.org/support/plugin/jetpack#new-post](https://wordpress.org/support/plugin/jetpack#new-post) * Thank you! Viewing 10 replies - 1 through 10 (of 10 total) The topic ‘Jetpack Top Post Short Code’ is closed to new replies. * ![](https://ps.w.org/jetpack/assets/icon.svg?rev=2819237) * [Jetpack - WP Security, Backup, Speed, & Growth](https://wordpress.org/plugins/jetpack/) * [Frequently Asked Questions](https://wordpress.org/plugins/jetpack/#faq) * [Support Threads](https://wordpress.org/support/plugin/jetpack/) * [Active Topics](https://wordpress.org/support/plugin/jetpack/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/jetpack/unresolved/) * [Reviews](https://wordpress.org/support/plugin/jetpack/reviews/) * 10 replies * 5 participants * Last reply from: [pmciano](https://wordpress.org/support/users/pmciano/) * Last activity: [7 years, 11 months ago](https://wordpress.org/support/topic/jetpack-top-post-short-code/#post-10461732) * Status: resolved