{"id":17202,"date":"2019-11-15T10:43:03","date_gmt":"2019-11-15T10:43:03","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&p=17202"},"modified":"2023-07-28T08:28:18","modified_gmt":"2023-07-28T08:28:18","slug":"jetengine-how-to-add-pagination-to-the-listing-grid-widget","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/","title":{"rendered":"How to Add Pagination to the Listing Grid Widget"},"content":{"rendered":"\n

If you have a large number of posts in your listing grid, but you want only several of them to be seen at a time on your page, you can attach the Pagination<\/a> widget from the JetSmartFilters<\/strong> plugin to the listing you have. The visitors of your website will be able to switch between the posts using pagination instead of scrolling down non-stop. It will take only a few steps, so let\u2019s go through them.<\/p>\n\n\n\n

Adding Widgets to Page<\/h2>\n\n\n\n

Go to your website’s dashboard and find the page where you would like to place the Listing Grid with Pagination. Open it in the Elementor page builder. Find the Listing Grid<\/strong> widget in the left-side widget menu and drop it on to the page. <\/p>\n\n\n\n\"listing\n\n\n\n

Choose the needed listing in the Listing <\/strong>drop-down and do all the other necessary customization. If you need a hint – go through this Listing Grid Overview<\/a>. Afterward, open the Advanced <\/strong>tab of the left-side menu and fill in the CSS ID<\/strong> field. You will need that ID to link the listing Grid with the Pagination widget.<\/p>\n\n\n\n\"listing\n\n\n\n

Next, find the Pagination<\/strong> widget and drop it next to the Listing Grid<\/strong> widget.<\/p>\n\n\n\n\"pagination\n\n\n\n

Set Connection between Widgets<\/h2>\n\n\n\n

In the Content<\/strong> settings block, navigate to the Pagination for:<\/strong> and select the “JetEngine” option. In the Apply type<\/strong> drop-down list choose “AJAX” option.<\/p>\n\n\n\n

If there is a single JetEngine item on the page, then you don’t need to fill the Query ID<\/strong> field. However, if there are several Listing Grids on the page you have to specify which one to apply the Pagination to. Copy the ID you typed into the CSS ID<\/strong> field of Listing Grid previously and paste it into the Query ID<\/strong> field.<\/p>\n\n\n\n\"pagination\n\n\n\n

Do the necessary customization and styling and click the “Publish<\/strong>” or “Update<\/strong>” button on the bottom of the menu.<\/p>\n\n\n\n

Now you can click the digits below the listing in order to switch the posts in a click. <\/p>\n","protected":false},"excerpt":{"rendered":"

From this tutorial, you will learn how to connect the Pagination widget of JetSmartFilters plugin and the Listing Grid widget of JetEngine plugin properly in order to make your page look neat.<\/p>\n","protected":false},"author":11,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[421,394],"yoast_head":"\nHow to Attach Pagination to Listing Grid \u2014 JetEngine | Crocoblock<\/title>\n<meta name=\"description\" content=\"Learn how to make it easier to navigate around the posts in a listing.\" \/>\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\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Attach Pagination to Listing Grid \u2014 JetEngine | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Learn how to make it easier to navigate around the posts in a listing.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2023-07-28T08:28:18+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/listing-grid-widget.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=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/\",\"name\":\"How to Attach Pagination to Listing Grid \u2014 JetEngine | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2019-11-15T10:43:03+00:00\",\"dateModified\":\"2023-07-28T08:28:18+00:00\",\"description\":\"Learn how to make it easier to navigate around the posts in a listing.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/#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 Add Pagination to the Listing Grid Widget\"}]},{\"@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 Attach Pagination to Listing Grid \u2014 JetEngine | Crocoblock","description":"Learn how to make it easier to navigate around the posts in a listing.","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\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/","og_locale":"en_US","og_type":"article","og_title":"How to Attach Pagination to Listing Grid \u2014 JetEngine | Crocoblock","og_description":"Learn how to make it easier to navigate around the posts in a listing.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/","og_site_name":"Help Center","article_modified_time":"2023-07-28T08:28:18+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2023\/03\/listing-grid-widget.png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/","name":"How to Attach Pagination to Listing Grid \u2014 JetEngine | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2019-11-15T10:43:03+00:00","dateModified":"2023-07-28T08:28:18+00:00","description":"Learn how to make it easier to navigate around the posts in a listing.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetsmartfilters\/jetengine-how-to-add-pagination-to-the-listing-grid-widget\/#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 Add Pagination to the Listing Grid Widget"}]},{"@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\/17202"}],"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\/11"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=17202"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=17202"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=17202"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}