{"id":32803,"date":"2023-01-04T14:33:08","date_gmt":"2023-01-04T14:33:08","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&#038;p=32803"},"modified":"2024-09-18T14:25:45","modified_gmt":"2024-09-18T14:25:45","slug":"how-to-create-nested-listings","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/","title":{"rendered":"How to Create Nested Listings"},"content":{"rendered":"\n<p>A nested listing is simply a <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-what-is-a-listing-template\/\" target=\"_blank\" rel=\"noreferrer noopener\">listing<\/a> of listings or any list with another list as an element (a sublist).&nbsp;<\/p>\n\n\n\n<p>With <em>JetEngine<\/em>, you can build it in several steps. Here is a step-by-step tutorial on how to show related info to the current item.<\/p>\n\n\n\n<p>You can use nested listings for different cases, but let&#8217;s imagine that you need to show a <strong>Category content <\/strong>of the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-how-to-create-relationships-between-posts\/\" target=\"_blank\" rel=\"noreferrer noopener\">Related Posts<\/a>. This tutorial uses images as an example, but you can also display any category content.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"add-images-to-categories\">Add Images to Categories<\/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>There are two ways to add an image to the category: the default Featured Image field or the custom <a href=\"https:\/\/bit.ly\/3WrkTph\" target=\"_blank\" rel=\"noreferrer noopener\">media meta field<\/a>.&nbsp;<\/p>\n\n\n\n<p>Head to <strong><em>WordPress Dashboard &gt; JetEngine &gt; Meta Boxes <\/em><\/strong>and create <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/how-to-group-the-custom-meta-fields-for-the-certain-post-types-into-meta-boxes\/\" target=\"_blank\" rel=\"noreferrer noopener\">Custom Meta Box<\/a> for your Custom or default <strong>Taxonomy<\/strong>. Select the \u201cMedia\u201d <strong>Field type <\/strong>and \u201cMedia ID\u201d <strong>Value format<\/strong>.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/category_media_field.png\" alt=\"category media field\">\n\n\n\n<p>Navigate to <strong><em>WordPress Dashboard &gt; JetEngine &gt; Taxonomies.<\/em><\/strong><\/p>\n\n\n\n<p>If you work with Custom Taxonomy, edit it and create a new media meta field.<\/p>\n\n\n\n<p>Or, if you deal with the Default Taxonomy or created via another plugin, you can enable the<em> <\/em><strong>Built-in<\/strong><em> <\/em>toggle in the top right corner to find the needed taxonomy. Then press the \u201c<strong>Edit<\/strong>\u201d button and add the field.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/built_in_toggle.png\" alt=\"built-in toggle\">\n\n\n\n<p>Now you are ready to upload media. Find the taxonomy and edit categories where you need images. Upload images to the image field and save changes.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/media_field_upload.png\" alt=\"media field upload\">\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"create-terms-listing\">Create Terms Listing<\/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>Navigate to <strong><em>JetEngine &gt; Listings &gt; Add new<\/em><\/strong> and <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/creating-a-listing-template-for-the-terms-from-custom-taxonomy-with-jetengine\/\" target=\"_blank\" rel=\"noreferrer noopener\">create Terms listing<\/a>.&nbsp;<\/p>\n\n\n\n<p>Add a <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-dynamic-image-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\">Dynamic Image<\/a> widget and select your media field in the <strong>Source <\/strong>dropdown field.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/widget_for_image.png\" alt=\"dynamic image widget settings\">\n\n\n\n<p>If it&#8217;s a featured image, find the <strong>Custom meta field\/repeater key<\/strong> field and paste the \u201c<em>thumbnail_id\u201d value<\/em>, it&#8217;s a featured image field key.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/widget_for_thumbnail.png\" alt=\"thumbnail id custom meta field for dynamic image\">\n\n\n\n<p>Check other widgets settings and adjust some if needed. You can enable the <strong>Linked image<\/strong> option, change the alignment and use the Style tab to customize your terms listing.<br>You can add the content you want besides the media with the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-dynamic-field-widget-overview-how-to-use-filter-field-output\/\" target=\"_blank\" rel=\"noreferrer noopener\">Dynamic Field<\/a>, <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-dynamic-link-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\">Dynamic link<\/a>, or other widgets. Save changes by pushing the \u201c<strong>Publish\/Update<\/strong>\u201d button.<\/p>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"create-terms-query\">Create Terms Query<\/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\"><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\">If we add the Terms listing to the Posts listing as it is, it will show all the categories in each post. So let`s prepare the query first.<\/p><\/div><\/div>\n\n\n\n<p>Head to <strong><em>WordPress Dashboard &gt; JetEngine &gt; Query Builder <\/em><\/strong>and press the \u201c<strong>Add New<\/strong>\u201d button. Name the query and select the \u201cTerms Query\u201d <strong>Query Type<\/strong>.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/terms_query.png\" alt=\"terms query taxonomy in general settings\">\n\n\n\n<p>In the General tab, choose your <strong>Taxonomy <\/strong>name and move to the <strong>Object\/Post IDs <\/strong>field. Click the <strong>Dynamic Tag<\/strong> icon and select the \u201cCurrent ID\u201d option from the appeared list.&nbsp;<\/p>\n\n\n\n<p>Thus we specify post IDs to get the categories. In our case, current post ID. Save changes and close the query.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/query_for_current_post_category.png\" alt=\"current id macro in the object post ids field\">\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"insert-nested-listing\">Insert Nested Listing<\/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 <strong><em>JetEngine &gt; Listings <\/em><\/strong>directory, and create or edit the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-listing-functionality-how-to-create-a-new-listing-to-apply-for-the-certain-post-type\/\" target=\"_blank\" rel=\"noreferrer noopener\">Posts listing<\/a>. Find the <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-listing-grid-widget-overview\/\" target=\"_blank\" rel=\"noreferrer noopener\">Listing Grid widget<\/a> in the Elementor editor area.&nbsp;<\/p>\n\n\n\n<p>In the <strong>Listing <\/strong>field of the General tab<strong><em>,<\/em><\/strong> start typing your Terms listing name and select it.<\/p>\n\n\n\n<p>Head to the<strong><em> <\/em><\/strong>Custom Query tab, activate the <strong>Use Custom Query <\/strong>switcher<strong><em> <\/em><\/strong>and choose your Terms query in the <strong>Custom Query <\/strong>field. Change the number of columns if you wish so. Adjust the <strong>Listing Grid<\/strong> widget settings if you need and save the result.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/custom_query_tab.png\" alt=\"custom query settings in listing grid widget\">\n\n\n\n<p>Remember that you can add other query conditions, such as showing only parent or child categories, using the \u201cCurrent ID\u201d dynamic macro in the Parent\/Child tab. You can also add order conditions. You can even query to show categories with specific meta field value.<\/p>\n<\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"check-result\">Check 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>The last step is to add your Posts listing widget to the needed page.<\/p>\n\n\n\n<img decoding=\"async\" src=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/nested_listing.png\" alt=\"result on front end\n\">\n\n\n\n<p>In the described case, it&#8217;s a <a href=\"https:\/\/crocoblock.com\/knowledge-base\/articles\/jetengine-macros-for-wordpress-relations\/\" target=\"_blank\" rel=\"noreferrer noopener\">related post listing<\/a>, so a related query is added. Feel free to pass this step if you have another setup.&nbsp;<\/p>\n<\/div><\/div>\n\n\n\n<p>Remember that the workflow is the same for other listing types. Now you know how to use nested listings and show the category&#8217;s content in the Posts listing.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>This detailed guide reveals step-by-step instructions on creating posts listing with nested terms listing.<\/p>\n","protected":false},"author":9,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[394,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 Nested Listings \u2014 JetEngine | Crocoblock<\/title>\n<meta name=\"description\" content=\"Learn how to use JetEngine nested listings to display related post\u2019s category image on your WordPress website.\" \/>\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-nested-listings\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Create Nested Listings \u2014 JetEngine | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Learn how to use JetEngine nested listings to display related post\u2019s category image on your WordPress website.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-18T14:25:45+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/category_media_field.png\" \/>\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=\"5 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-nested-listings\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/\",\"name\":\"How to Create Nested Listings \u2014 JetEngine | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2023-01-04T14:33:08+00:00\",\"dateModified\":\"2024-09-18T14:25:45+00:00\",\"description\":\"Learn how to use JetEngine nested listings to display related post\u2019s category image on your WordPress website.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/#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 Nested Listings\"}]},{\"@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 Nested Listings \u2014 JetEngine | Crocoblock","description":"Learn how to use JetEngine nested listings to display related post\u2019s category image on your WordPress website.","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-nested-listings\/","og_locale":"en_US","og_type":"article","og_title":"How to Create Nested Listings \u2014 JetEngine | Crocoblock","og_description":"Learn how to use JetEngine nested listings to display related post\u2019s category image on your WordPress website.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/","og_site_name":"Help Center","article_modified_time":"2024-09-18T14:25:45+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/category_media_field.png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/","name":"How to Create Nested Listings \u2014 JetEngine | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2023-01-04T14:33:08+00:00","dateModified":"2024-09-18T14:25:45+00:00","description":"Learn how to use JetEngine nested listings to display related post\u2019s category image on your WordPress website.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-nested-listings\/#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 Nested Listings"}]},{"@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\/32803"}],"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\/9"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=32803"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=32803"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=32803"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}