{"id":33144,"date":"2023-01-12T14:34:30","date_gmt":"2023-01-12T14:34:30","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&p=33144"},"modified":"2024-11-29T08:30:35","modified_gmt":"2024-11-29T08:30:35","slug":"how-to-create-listing-items-with-bricks","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/","title":{"rendered":"How to Create Listing Items with Bricks"},"content":{"rendered":"\n

Bricks<\/em> is a WordPress theme that lets you visually build sites. With Bricks<\/em> and the JetEngine<\/em> <\/em><\/strong>plugin, you can render dynamic data on your website.<\/p>\n\n\n\n

With the Listing<\/strong> template, you can display the post, user, terms, relations<\/strong><\/a>, or Options Pages<\/strong><\/a> data. To learn more about the JetEngine Listing Item<\/strong> feature, follow the Listing Template Overview<\/strong><\/a>.<\/p>\n\n\n\n

Also, with the JetEngine<\/em> <\/em><\/strong>plugin, you can create Custom Post Types<\/strong><\/a> and custom taxonomies<\/strong><\/a>. If you want to work with native WordPress posts, users, and terms, you can add custom meta fields<\/strong><\/a> to them with the Meta Box<\/strong><\/a> <\/strong>feature.<\/p>\n\n\n\n

Before you start, proceed to the Bricks > Settings <\/em><\/strong>tab on the WordPress Dashboard. In the General <\/strong>section, you can enable the Post Types <\/strong>you want to edit with Bricks<\/em>. Now, you need to enable the Listing Items <\/strong>toggle. <\/p>\n\n\n\n

Move to the end of the settings page and hit the \u201cSave Settings\u201d<\/strong> button.<\/p>\n\n\n\n\"edit\n\n\n\n

Go to JetEngine > Listings <\/em><\/strong>and press the \u201cAdd New\u201d <\/strong>button.<\/p>\n\n\n\n

I will create the Listing Template for the custom post type for the book authors, so I picked the \u201cPosts\u201d Listing source<\/strong> and selected \u201cWriters and Book Authors\u201d in the From post type <\/strong>field. You can also create it for the Query Builder<\/strong><\/a>, Terms<\/strong><\/a>, or Users<\/strong><\/a>.<\/p>\n\n\n\n

Enter the Listing item name <\/strong>and select the \u201cBricks\u201d Listing view<\/strong>.
Push the \u201cCreate Listing Item\u201d <\/strong>button.<\/p>\n\n\n\n\"setup\n\n\n\n

After moving to the Bricks <\/strong>builder, hit the \u201cSection\u201d <\/strong>button with the \u201c+\u201d <\/strong>icon.<\/p>\n\n\n\n\"bricks\n\n\n\n

Type \u201cdynamic\u201d in the search bar on the left builder side, and you\u2019ll see the elements you can use for the Listing Item: Dynamic Field<\/strong>, Dynamic Image<\/strong>, and Dynamic Link<\/strong>.<\/p>\n\n\n\n\"jetengine\n\n\n\n

Firstly, drag-n-drop the Dynamic Field <\/strong>element onto the editing page. This element pulls the data from the specified source and displays it using the set style and content settings. More about it you can find in the Dynamic Field Overview<\/strong><\/a>.<\/p>\n\n\n\n

Open the General <\/strong>tab in the Content <\/strong>settings section. In the Source<\/strong> dropdown, you can see a list of available sources from where the data will be pulled. I selected the \u201cPost\/Term\/User\/Object Data\u201d to pull data from the default meta fields of the post and picked the \u201cTitle\u201d option in the Object field<\/strong>. Then, I duplicated the Dynamic Field <\/strong>element and chose the \u201cContent\u201d option in the Object field<\/strong>.<\/p>\n\n\n\n\"dynamic\n\n\n\n

If you add the meta fields<\/strong><\/a>, you can display their values by selecting the \u201cMeta Data\u201d Source <\/strong>and the needed Meta field<\/strong>. You can read more about the dynamic field sources and other settings in the Dynamic Field Content Section Settings<\/strong><\/a>.<\/p>\n\n\n\n

Also, be aware that some meta field<\/strong> data can be displayed correctly only by applying the Callbacks<\/strong>. To learn how to display values of different meta field types with callbacks, proceed to the Filter Field Output Overview<\/strong><\/a>.<\/p>\n\n\n\n\"dynamic\n\n\n\n

Click the \u201c+\u201d <\/strong>button to observe and add more elements to the template.<\/p>\n\n\n\n\"adding\n\n\n\n

Type the \u201cdynamic\u201d word again into the search bar and drag-n-drop the Dynamic Image<\/strong> element. With it, you can display the Featured image <\/strong>or the image from the meta fields. Learn more from the Dynamic Image Overview<\/strong><\/a>.<\/p>\n\n\n\n\"dynamic\n\n\n\n

Click the \u201c+\u201d <\/strong>button and add the Dynamic Link <\/strong>element. With this element,  you can add links that display content from the predefined source. Read more in the Dynamic Link Overview<\/strong><\/a>.<\/p>\n\n\n\n

As the Source<\/strong>, I picked the \u201cPermalink\u201d option to lead users to the book author post.<\/p>\n\n\n\n

Using three available elements, display all needed data on the Listing Item. Also, you can style every element in the Style <\/strong>settings section.<\/p>\n\n\n\n

When you finish, hit the \u201cSave\u201d <\/strong>button in the upper right corner.<\/p>\n\n\n\n\"save\n\n\n\n

That\u2019s all. Now you know how to create the Listing Item template with the JetEngine <\/em>plugin and Bricks <\/em>theme. To discover how to display the listing item on the page, proceed to the following tutorial: How to Showcase Custom Posts via Listing Grid with Bricks<\/a><\/strong>.<\/p>\n","protected":false},"excerpt":{"rendered":"

Learn how to create the Listing Item template with the JetEngine plugin and Bricks builder theme from this tutorial.<\/p>\n","protected":false},"author":8,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[528],"yoast_head":"\nHow to Create Listing Items with Bricks Builder \u2014 JetEngine | Crocoblock<\/title>\n<meta name=\"description\" content=\"Learn how to create the Listing Item template with the JetEngine plugin and Bricks builder theme from this tutorial.\" \/>\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-listing-items-with-bricks\/\" \/>\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 Items with Bricks Builder \u2014 JetEngine | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Learn how to create the Listing Item template with the JetEngine plugin and Bricks builder theme from this tutorial.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2024-11-29T08:30:35+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/edit-listing-items-with-bricks-2.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-listing-items-with-bricks\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/\",\"name\":\"How to Create Listing Items with Bricks Builder \u2014 JetEngine | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2023-01-12T14:34:30+00:00\",\"dateModified\":\"2024-11-29T08:30:35+00:00\",\"description\":\"Learn how to create the Listing Item template with the JetEngine plugin and Bricks builder theme from this tutorial.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/#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 Listing Items with Bricks\"}]},{\"@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 Items with Bricks Builder \u2014 JetEngine | Crocoblock","description":"Learn how to create the Listing Item template with the JetEngine plugin and Bricks builder theme from this tutorial.","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-listing-items-with-bricks\/","og_locale":"en_US","og_type":"article","og_title":"How to Create Listing Items with Bricks Builder \u2014 JetEngine | Crocoblock","og_description":"Learn how to create the Listing Item template with the JetEngine plugin and Bricks builder theme from this tutorial.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/","og_site_name":"Help Center","article_modified_time":"2024-11-29T08:30:35+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/01\/edit-listing-items-with-bricks-2.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-listing-items-with-bricks\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/","name":"How to Create Listing Items with Bricks Builder \u2014 JetEngine | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2023-01-12T14:34:30+00:00","dateModified":"2024-11-29T08:30:35+00:00","description":"Learn how to create the Listing Item template with the JetEngine plugin and Bricks builder theme from this tutorial.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetengine\/how-to-create-listing-items-with-bricks\/#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 Listing Items with Bricks"}]},{"@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\/33144"}],"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\/8"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=33144"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=33144"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=33144"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}