{"id":892,"date":"2021-03-14T09:22:25","date_gmt":"2021-03-14T09:22:25","guid":{"rendered":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/?p=892"},"modified":"2022-05-08T12:10:08","modified_gmt":"2022-05-08T12:10:08","slug":"pagination-setting-in-woocommerce-product-table-plugin","status":"publish","type":"post","link":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/pagination-setting-in-woocommerce-product-table-plugin\/","title":{"rendered":"Pagination setting in Woocommerce product table plugin"},"content":{"rendered":"\n<p>We provide two types of pagination (Load more and page number) on the <a href=\"https:\/\/ithemelandco.com\/plugins\/woocommerce-product-table\/\" target=\"_blank\" rel=\"noreferrer noopener\">Woocommerce Product Table Plugin<\/a>. This options are available on the \u201c<strong>Search box and Pagination<\/strong>\u201d tab.\u00a0<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-search-box-and-pagination-tab.jpg\"><img fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-search-box-and-pagination-tab.jpg\" alt=\"search box and pagination tab\" class=\"wp-image-897\" width=\"1399\" height=\"591\"\/><\/a><\/figure>\n\n\n\n<p>In this page, you have to scroll down to see \u201c<strong>Pagination Options<\/strong>\u201d.<\/p>\n\n\n\n<p>There are two methods of paging under &#8220;<strong>Pagination Mode<\/strong>&#8220;:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>Load More: <\/strong>Products will be shown in one page under previous products.<\/li><li><strong>Pagination: <\/strong>Products will be displayed in different pages.<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-methods-of-pagination.jpg\"><img decoding=\"async\" src=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-methods-of-pagination.jpg\" alt=\"methods of pagination in woocommerce product table plugin\" class=\"wp-image-896\" width=\"1393\" height=\"660\"\/><\/a><\/figure>\n\n\n\n<p>We describe more about this setting and how they could change the appearance of your product table in the below example:<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Pagination<\/strong> mode<\/h2>\n\n\n\n<p>At first, you have to build your product table by going to &#8220;<strong>Add New<\/strong>&#8221; page. Then select your desired columns to be shown in the table.<\/p>\n\n\n\n<p>In this example, we Select ID, Thumbnail, Product title, Category and SKU.<\/p>\n\n\n\n<p>We also type \u201cTest Paging\u201d as our table name in the &#8220;<strong>Shortcode Name<\/strong>&#8221; box.<\/p>\n\n\n\n<p>Then you can go to the \u201c<strong>Query tab<\/strong>\u201d and filter those products that you want to be displayed in the product table.<\/p>\n\n\n\n<p>There is also another option as a &#8220;<strong>Post Limit Number<\/strong>&#8221; in this tab. You can set how many products to be displayed in each page of your product table.<\/p>\n\n\n\n<p>Also the products which are on sale have been displayed and the &#8220;<strong>Post Limit Number<\/strong>&#8221; has been set to 10.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-set-filters.jpg\"><img decoding=\"async\" src=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-set-filters.jpg\" alt=\"set post limit number\" class=\"wp-image-900\" width=\"1585\" height=\"908\" srcset=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-set-filters.jpg 1585w, https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-set-filters-1536x880.jpg 1536w\" sizes=\"(max-width: 1585px) 100vw, 1585px\" \/><\/a><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p>We also set the \u2018<strong>Pagination Mode<\/strong>\u2019 to \u201c<strong>Pagination<\/strong>\u201d in the \u201c<strong>Search and Pagination<\/strong>\u201c tab as you can see on below image:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-choose-pagination-mode.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-choose-pagination-mode.jpg\" alt=\"Choose pagination mode in woocommerce product table plugin\" class=\"wp-image-899\" width=\"1408\" height=\"603\"\/><\/a><\/figure>\n\n\n\n<p>Then we saved the product table and used a shortcode to display the table in the frontend. To get familiar with using shortcode, you can refer to \u201cHow to insert product table shortcode in wordpress\u201d.<\/p>\n\n\n\n<p>By choosing those pagination settings, our table is displayed as below:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-pagination-mode.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-pagination-mode.jpg\" alt=\"pagination mode \" class=\"wp-image-895\" width=\"1513\" height=\"666\"\/><\/a><\/figure>\n\n\n\n<p>As you can see, at the end of the product table, the other pages of products are specified with a number. Customers can select to see other pages by clicking on the number.<\/p>\n\n\n\n<p>It is also considerable that just 10 products are showing in each page as we set before.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Load More mode<\/strong><\/h2>\n\n\n\n<p>Now, we want to see what will happen if we change the &#8220;<strong>Pagination Mode<\/strong>&#8221; to the \u201c<strong>Load More<\/strong>\u201d.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-load-more-mode.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-load-more-mode.jpg\" alt=\"Load more mode for pagination\" class=\"wp-image-894\" width=\"1408\" height=\"648\"\/><\/a><\/figure>\n\n\n\n<p>After choosing \u201c<strong>Load More<\/strong>\u201d, we also changed the &#8220;<strong>Post Limit Number<\/strong>&#8221; to \u201c5\u201d in the &#8220;<strong>Query tab<\/strong>&#8220;.<\/p>\n\n\n\n<p>You can see the changes made after we updated our table, in the below picture: <\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><a href=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-view-of-load-more-mode.jpg\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-content\/uploads\/sites\/3\/2021\/03\/39-view-of-load-more-mode.jpg\" alt=\"load more mode in front-end\" class=\"wp-image-893\" width=\"1528\" height=\"741\"\/><\/a><figcaption> <\/figcaption><\/figure>\n\n\n\n<p>By choosing this option for &#8220;Pagination Setting&#8221;, the \u201c<strong>Load More<\/strong>\u201d button will be added to the end of the product table and the customers can see more products by clicking on it.<\/p>\n\n\n\n<p>It is also considerable that just 5 products are displayed in the first view as we set this number before.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>We provide two types of pagination (Load more and page number) on the Woocommerce Product Table Plugin. This options are available on the \u201cSearch box and Pagination\u201d tab.\u00a0 In this page, you have to scroll down to see \u201cPagination Options\u201d. There are two methods of paging under &#8220;Pagination Mode&#8220;: Load More: Products will be shown [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-892","post","type-post","status-publish","format-standard","hentry","category-plugin-usage"],"_links":{"self":[{"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/posts\/892","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/comments?post=892"}],"version-history":[{"count":0,"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/posts\/892\/revisions"}],"wp:attachment":[{"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/media?parent=892"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/categories?post=892"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ithemelandco.com\/docs\/woocommerce-product-table\/wp-json\/wp\/v2\/tags?post=892"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}