{"id":30144,"date":"2022-11-04T21:15:52","date_gmt":"2022-11-04T21:15:52","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/articles\/how-to-create-a-listing-template-for-post-types\/"},"modified":"2024-08-13T08:13:03","modified_gmt":"2024-08-13T08:13:03","slug":"how-to-create-a-listing-template-for-post-types","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/","title":{"rendered":"How to Create a Listing Template for Post Types in Elementor"},"content":{"rendered":"\n<p>With the <em>JetEngine<\/em> plugin, you can dynamically pull the content from the backend to the Elementor page builder to display it on the front end. This tutorial uncovers how to create a listing template to display the content in the <a href=\"https:\/\/crocoblock.com\/widgets\/listing-grid\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Listing Grid<\/strong> widget<\/a>.\u00a0<\/p>\n\n\n\n<p>A listing template can be created for the WordPress default posts, but you can build a <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/custom-post-type-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>custom post type (CPT)<\/strong><\/a> as well. For example, we will use the \u201cCountry\u201d <strong>CPT <\/strong>for this tutorial.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"listing-creation\">Listing Creation<\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<h3 class=\"wp-block-heading\" id=\"add-a-new-listing-item\">Add a new listing item<\/h3>\n\n\n\n<p>Proceed to the <strong><em>WordPress Dashboard > JetEngine > Listings<\/em><\/strong> tab and press the \u201c<strong>Add New<\/strong>\u201d button.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list.webp\" alt=\"listing items list\" class=\"wp-image-44124\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"set-up-listing-item\">Set up listing item<\/h3>\n\n\n\n<p>Once the <strong>Setup Listing Item<\/strong> window has opened, these fields should be set:<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type.webp\" alt=\"setup listing template for the post type\" class=\"wp-image-44125\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/setup-listing-template-for-the-post-type-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Listing source<\/strong> \u2014 we are now talking about the listing template for the posts, so choose the \u201cPosts\u201d option in this drop-down menu;<\/li>\n\n\n\n<li><strong>From post type<\/strong> \u2014 here, you should select the post type from which the content will be pulled. For example, it can be named \u201cCountry.\u201d Take into consideration that you can create a listing template for the default WordPress post types as well;<\/li>\n\n\n\n<li><strong>Listing Item Name<\/strong> \u2014 type the name for the listing here;<\/li>\n\n\n\n<li><strong>Listing View<\/strong> \u2014 in this drop-down menu, you can choose to create the listing using Elementor, Gutenberg, or Bricks. For now, we select the \u201cElementor\u201d option.<\/li>\n<\/ul>\n\n\n\n<p>Afterward, click the \u201c<strong>Create Listing Item<\/strong>\u201d button.<\/p>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"fill-listing-with-content\">Fill Listing with Content<\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<h3 class=\"wp-block-heading\" id=\"adjust-listing-item-settings\">Adjust listing item settings<\/h3>\n\n\n\n<p>First, you can click the \u201c<strong>gear<\/strong>\u201d icon in the bottom left corner to open the <strong>Listing Item Settings<\/strong> and unfold the <strong>Listing Settings <\/strong>tab. There are such options:<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings.webp\" alt=\"listing item settings\" class=\"wp-image-44123\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-item-settings-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<ul>\n<li><strong>Listing source<\/strong> and <strong>From post type<\/strong> \u2014 check if the source is set correctly. If you want to set other options for these fields \u2014 reload the page afterward to be able to reach the appropriate meta field options for dynamic widgets;<\/li>\n\n\n\n<li><strong>Preview width<\/strong> \u2014 here, you can set the width of the listing card by moving the slider indicator or typing the needed number of pixels. For example, we set \u201c400\u201d width;<\/li>\n\n\n\n<li><strong>Make listing item clickable <\/strong>\u2014 if enabled, users can proceed to another page with the post details after clicking. Learn more from the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/listing-template-in-elementor-overview\/#link-source\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Listing Template Overview<\/strong><\/a>.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"display-content-with-dynamic-widgets\">Display content with Dynamic Widgets<\/h3>\n\n\n\n<p>The listing item can be customized with any widgets you find handy. For this tutorial, we will display dynamic post data with <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/dynamic-widgets-and-blocks\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Dynamic Widgets<\/strong><\/a> found in the <strong>Listing Elements <\/strong>tab of the Elementor Editor panel.<\/p>\n\n\n\n<figure class=\"wp-block-image text-center size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"358\" height=\"939\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-elements-tab.webp\" alt=\"listing elements tab\" class=\"wp-image-44122\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-elements-tab.webp 358w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-elements-tab-114x300.webp 114w\" sizes=\"(max-width: 358px) 100vw, 358px\" \/><\/figure>\n\n\n\n<p>First, we placed the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/jetengine-dynamic-image-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Dynamic Image<\/strong><\/a> widget to show the post featured image. The \u201cPost thumbnail\u201d option is set by default in the <strong>Source<\/strong> field.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail.webp\" alt=\"dynamic image widget displays post thumbnail\" class=\"wp-image-44120\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-image-widget-displays-post-thumbnail-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>Then, we dragged and dropped the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/dynamic-field-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Dynamic Field<\/strong><\/a> widget to present the post title. We kept the default settings: \u201cPost\/Term\/User\/Object Data\u201d <strong>Source <\/strong>and \u201cTitle\u201d <strong>Object Field<\/strong>.<\/p>\n\n\n\n<p>We also set the <strong>HTML tag <\/strong>to \u201cH2.\u201d<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title.webp\" alt=\"dynamic field widget displays post title\" class=\"wp-image-44119\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-field-widget-displays-post-title-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>Afterward, we added the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/jetengine-dynamic-meta-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Dynamic Meta<\/strong><\/a> widget, which displays the post date, author, and comments.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget.webp\" alt=\"dynamic meta widget\" class=\"wp-image-44121\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-meta-widget-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>If some tab is unnecessary, it can be deleted (e.g., \u201ccomments\u201d).&nbsp;<\/p>\n\n\n\n<p>The unfolding tab opens its settings, where an icon, prefix, and suffix can be modified.<\/p>\n\n\n\n<p>For instance, we set the<strong> Icon<\/strong> for the \u201cdate\u201d tab.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta.webp\" alt=\"icon for dynamic meta date\" class=\"wp-image-44132\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/icon-for-dynamic-meta-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>For the \u201cauthor\u201d tab, we set the <strong>Prefix<\/strong>.\u00a0<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta.webp\" alt=\"prefix for dynamic meta\" class=\"wp-image-44136\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/prefix-for-dynamic-meta-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>More settings are presented in the <strong>Date Settings<\/strong>, <strong>Author Settings<\/strong>, and <strong>Comments Settings<\/strong> of the <strong>Content<\/strong> widget section.<\/p>\n\n\n\n<p>For example, the <strong>Format <\/strong>can be altered in the <strong>Date Settings<\/strong> tab.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget.webp\" alt=\"format date option in the dynamic meta widget\" class=\"wp-image-44131\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/format-date-option-in-the-dynamic-meta-widget-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>To show the post excerpt, we inputted the <strong>Dynamic Field<\/strong> widget again, kept the \u201cPost\/Term\/User\/Object Data\u201d <strong>Source<\/strong>, and picked the \u201cExcerpt\u201d <strong>Object Field<\/strong>.<\/p>\n\n\n\n<p>We enabled the <strong>Automatically generated excerpt <\/strong>toggle and set the <strong>Custom length <\/strong>to \u201c20.\u201d\u00a0<\/p>\n\n\n<div class=\"note-banner d-flex border-bold border-jetsmartfilters rounded overflow-hidden p-20\"><div class=\"mr-12\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M1 21H23L12 2L1 21ZM13 18H11V16H13V18ZM13 14H11V10H13V14Z\" fill=\"#FA5450\"\/><\/svg><\/div><div class=\"d-flex flex-column\"><div class=\"text-900 mb-12\">Warning<\/div><p class=\"m-0\">Be aware that the excerpt text length will be cut to the adjusted number of words only on the front end; on the backend changes won\u2019t be applied.<\/p><\/div><\/div>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget.webp\" alt=\"custom length of the post excerpt in the dynamic field widget\" class=\"wp-image-44127\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-length-of-the-post-excerpt-in-the-dynamic-field-widget-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>Eventually, we placed the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/jetengine-dynamic-link-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Dynamic Link<\/strong><\/a> widget with the \u201cPermalink\u201d <strong>Source<\/strong>. If this option is set, users can proceed to the post single page after clicking the link.<\/p>\n\n\n<div class=\"note-banner d-flex border-bold border-jetsmartfilters rounded overflow-hidden p-20\"><div class=\"mr-12\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M1 21H23L12 2L1 21ZM13 18H11V16H13V18ZM13 14H11V10H13V14Z\" fill=\"#FA5450\"\/><\/svg><\/div><div class=\"d-flex flex-column\"><div class=\"text-900 mb-12\">Warning<\/div><p class=\"m-0\">It is not recommended to use multiple linking methods simultaneously inside a listing item. This includes using the <strong>Dynamic Link<\/strong> widget and enabling the <strong>Make listing item clickable<\/strong> option described in the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/#adjust-listing-item-settings\"><strong>Adjust listing item settings<\/strong><\/a> chapter. To ensure a clear and consistent user experience, it is better to choose one linking method for the listing item.<\/p><\/div><\/div>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget.webp\" alt=\"dynamic link widget\" class=\"wp-image-44129\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/dynamic-link-widget-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"customize-style-settings\">Customize style settings<\/h3>\n\n\n\n<p>Style settings can be configured for widgets in the Elementor Editor. For example, we set the background and text color, padding, and border radius for the <strong>Dynamic Link<\/strong> widget.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor.webp\" alt=\"style settings in elementor\" class=\"wp-image-44137\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/style-settings-in-elementor-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>The <strong>Advanced <\/strong>settings can also be tuned. For example, you can set gaps between widgets by adjusting the <strong>Padding<\/strong>.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings.webp\" alt=\"padding in the advanced widget settings\" class=\"wp-image-44135\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/padding-in-the-advanced-widget-settings-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>As the final touch, we set the background color in the <strong>Style <\/strong>settings tab for the <strong>Section<\/strong>.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor.webp\" alt=\"background color for the section in elementor editor\" class=\"wp-image-44126\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/background-color-for-the-section-in-elementor-editor-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>The listing template design created here will be applied to the entire <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/listing-grid-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Listing Grid<\/strong><\/a> on the page. To learn how to combine different listing designs, such as creating different item background colors in a grid, refer to the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-use-alternative-listing-template-injections-in-listing-grid\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>How to Use Alternative Listing Template Injections in Listing Grid Widget<\/strong><\/a> tutorial.<\/p>\n\n\n\n<p>To save changes, we hit the \u201c<strong>Update<\/strong>\u201d button.<\/p>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"place-the-listing-grid-widget-on-a-page\">Place the Listing Grid Widget on a Page<\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>Listing items can be displayed with the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/listing-grid-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>Listing Grid <\/strong>widget<\/a> placed on a page, post, or template. We headed to the <strong><em>WordPress Dashboard > Pages > Add New Page <\/em><\/strong>tab, entered the new page title, and hit the \u201c<strong>Edit with Elementor<\/strong>\u201d button.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor.webp\" alt=\"edit page with elementor\" class=\"wp-image-44130\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/edit-page-with-elementor-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>In Elementor Editor, we drag-n-dropped the <strong>Listing Grid <\/strong>widget and chose the recently created <strong>Listing<\/strong>. We also enabled the <strong>Equal columns height<\/strong> toggle to make listing item height equal in the grid.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget.webp\" alt=\"listing grid widget\" class=\"wp-image-44133\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-widget-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n<div class=\"note-banner d-flex border-bold border-jetthemecore rounded overflow-hidden p-20\"><div class=\"mr-12\"><svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M9 21C9 21.5 9.4 22 10 22H14C14.6 22 15 21.5 15 21V20H9V21ZM12 2C8.1 2 5 5.1 5 9C5 11.4 6.2 13.5 8 14.7V17C8 17.5 8.4 18 9 18H15C15.6 18 16 17.5 16 17V14.7C17.8 13.4 19 11.3 19 9C19 5.1 15.9 2 12 2Z\" fill=\"#F2D23C\"\/><\/svg><\/div><div class=\"d-flex flex-column\"><div class=\"text-900 mb-12\">Things to know<\/div><p class=\"m-0\">The Listing Grid widget allows applying a <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/listing-grid-widget-overview\/#posts-query\" target=\"_blank\" rel=\"noopener\"><strong>Post Query<\/strong><\/a> to retrieve specific posts, but this is a legacy option. Therefore, we recommend creating a <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/query-builder-posts-query-type\/\" target=\"_blank\" rel=\"noopener\"><strong>custom post query<\/strong><\/a> using the <em>JetEngine<\/em> <a href=\"https:\/\/crocoblock.com\/knowledge-base\/features\/query-builder-overview\/\" target=\"_blank\" rel=\"noopener\"><strong>Query Builder<\/strong><\/a> feature and applying it in the Custom Query tab of the widget.<\/p><\/div><\/div>\n\n\n\n<figure class=\"wp-block-image text-center size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"360\" height=\"600\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-query-option-for-the-listing-grid-widget.webp\" alt=\"custom query option for the listing grid widget\" class=\"wp-image-44128\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-query-option-for-the-listing-grid-widget.webp 360w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/custom-query-option-for-the-listing-grid-widget-180x300.webp 180w\" sizes=\"(max-width: 360px) 100vw, 360px\" \/><\/figure>\n\n\n\n<p>After modifying the content and style settings, we pressed the \u201c<strong>Publish\/Update<\/strong>\u201d button.<\/p>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"check-the-result\">Check the Result<\/h2>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-group__inner-container\">\n<p>Open the page on the front end and check the results.\u00a0<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end.webp\" alt=\"listing grid with posts on the front end\" class=\"wp-image-44134\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-grid-with-posts-on-the-front-end-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n\n\n\n<p>After clicking the \u201c<strong>Read More<\/strong>\u201d button, we were redirected to the post single page. Learn how to craft a custom single page from the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/jetthemecore\/how-to-add-a-single-post-page-template-with-elementor\/\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>How to Create a WordPress Single Post Page Template<\/strong><\/a> tutorial.<\/p>\n\n\n\n<div class=\"wp-block-image size-large\"><a href=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"1824\" height=\"1100\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page.webp\" alt=\"post single page\" class=\"wp-image-44138\" srcset=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page.webp 1824w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page-300x181.webp 300w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page-1024x618.webp 1024w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page-768x463.webp 768w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page-1536x926.webp 1536w, https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/post-single-page-600x362.webp 600w\" sizes=\"(max-width: 1824px) 100vw, 1824px\" \/><\/a><\/div>\n<\/div><\/div>\n\n\n\n<p>That\u2019s all. Now you know how to create listing templates for posts, pulling dynamic content for your WordPress website with the <em>JetEngine<\/em> plugin.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Learn how to use the Listing functionality from the JetEngine plugin to create listing templates for dynamic content.<\/p>\n","protected":false},"author":1,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[257,388],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v20.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to Create Listing Template for Post Types in Elementor \u2014 JetEngine | Crocoblock<\/title>\n<meta name=\"description\" content=\"Explore the listing functionality for the JetEngine WordPress plugin. Create custom listing templates and apply them to specific post types in Elementor.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Create Listing Template for Post Types in Elementor \u2014 JetEngine | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Explore the listing functionality for the JetEngine WordPress plugin. Create custom listing templates and apply them to specific post types in Elementor.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2024-08-13T08:13:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list.webp\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"9 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/\",\"name\":\"How to Create Listing Template for Post Types in Elementor \u2014 JetEngine | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2022-11-04T21:15:52+00:00\",\"dateModified\":\"2024-08-13T08:13:03+00:00\",\"description\":\"Explore the listing functionality for the JetEngine WordPress plugin. Create custom listing templates and apply them to specific post types in Elementor.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Articles\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/articles\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to Create a Listing Template for Post Types in Elementor\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"name\":\"Help Center\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\",\"name\":\"Help Center\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"contentUrl\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"caption\":\"Help Center\"},\"image\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Create Listing Template for Post Types in Elementor \u2014 JetEngine | Crocoblock","description":"Explore the listing functionality for the JetEngine WordPress plugin. Create custom listing templates and apply them to specific post types in Elementor.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/","og_locale":"en_US","og_type":"article","og_title":"How to Create Listing Template for Post Types in Elementor \u2014 JetEngine | Crocoblock","og_description":"Explore the listing functionality for the JetEngine WordPress plugin. Create custom listing templates and apply them to specific post types in Elementor.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/","og_site_name":"Help Center","article_modified_time":"2024-08-13T08:13:03+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2022\/11\/listing-items-list.webp"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"9 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/","name":"How to Create Listing Template for Post Types in Elementor \u2014 JetEngine | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2022-11-04T21:15:52+00:00","dateModified":"2024-08-13T08:13:03+00:00","description":"Explore the listing functionality for the JetEngine WordPress plugin. Create custom listing templates and apply them to specific post types in Elementor.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-a-listing-template-for-post-types\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/crocoblock.com\/knowledge-base\/"},{"@type":"ListItem","position":2,"name":"Articles","item":"https:\/\/crocoblock.com\/knowledge-base\/articles\/"},{"@type":"ListItem","position":3,"name":"How to Create a Listing Template for Post Types in Elementor"}]},{"@type":"WebSite","@id":"https:\/\/crocoblock.com\/knowledge-base\/#website","url":"https:\/\/crocoblock.com\/knowledge-base\/","name":"Help Center","description":"","publisher":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization","name":"Help Center","url":"https:\/\/crocoblock.com\/knowledge-base\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/","url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","contentUrl":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","caption":"Help Center"},"image":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article\/30144"}],"collection":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/users\/1"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=30144"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=30144"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=30144"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}