What is Pagination?
This is a must for every large site. How many products can be on a large web resource? Tens, hundreds, thousands … It’s very difficult for the user to navigate in such a number of pages. And here you can’t do without pagination.
It Solves Several Problems:
- Speeds up page loading. An “endless” web page is technically possible, but in practice it will load for a very long time, checking the user’s patience for strength.
- Makes browsing and searching for the necessary elements easier and more convenient;
- Gives the site design a neat and finished look.
- Pagination allows you to find the information you need on the site quickly and comfortably.
Therefore, users of the WooCommerce Product Table like this mechanism.
Pagination in the Product Table
Firstly, open -Settings-> Features :
- “Pagination” to show the pagination in the table.
- Turn “Pagination menu” if you want to show a drop-down list to select the number of products per page to display.
If the Pagination menu is enabled, in the contents of the Pagination list you can specify the number of lines displayed on one Pagination page. Set multiple numbers separated by commas so that users can select them in person. The first number will be displayed by default. After that, the number of pagination pages will also be recounted. - “Products per Page”. (If the “Pagination Menu” is disabled) By default, one page consists of 10 products.But you can change this by setting the values in the “Products per Page”. Here you can specify the number of products displayed on one page.
- Toggle the “Scroll to top on pagination” option to scroll the page to the top when pagination is used.
- “Server-side processing” – this option is recommended for large tables that cannot be processed in the usual way. The table will be loaded ajax sequentially for each page, all filtering, ordering and search conditions are also implemented on the server side.
An example of using pagination options:
| Thumbnail | Name | Size | Color | Date | Rating | Price | Buy |
|---|---|---|---|---|---|---|---|
 | WooBeWoo top | XL, XXL | Blue, Gray | 2019-03-26 12:03 | $15 | | |
 | WooBeWoo hoodie | M, S | Gray, Green | 2019-03-26 12:03 | $10 – $18 | $10 $13 $18 $18 | |
 | Gray top | M | Black, Gray | 2019-01-03 15:01 | $12 – $14 | $12 $14 | |
 | WooBeWoo hoodie | M, S, XXL | Gray, Green | 2019-01-03 15:01 | $18 | | |
 | Black hoodie | L, S | Black | 2019-01-03 15:01 | $12 | | |
| Gray hoodie | L, M, S, XL | Gray | 2019-01-03 15:01 | $12 | | |
 | Blush Hoodie | M, S, XL, XS | Blush | 2018-09-27 06:09 | $20 | | |
 | Red T-Shirt | L, M, XL | Red | 2018-09-27 06:09 | $8 | Out of stock | |
 | White T-Shirt | M, S, XS | White | 2018-09-27 06:09 | $7 | | |
  | Gray T-Shirt | XL, XXL | Gray | 2018-09-27 06:09 | $9 | | |
 | Blue Hoodie | M, XL, XS | Blue | 2018-09-27 06:09 | $20 | | |
 | Gray Hoodie | M, S, XL, XS, XXL, XXXL | Gray | 2018-09-27 06:09 | $25 | | |
 | Black Hoodie | M, S, XL | Black | 2018-09-27 06:09 | $20 | | |
 | Red Hoodie | L, M, XL, XS, XXL | Red | 2018-09-27 06:09 | $20 | | |
 | Woo t-shirt | M | Black, White | 2018-05-31 12:05 | $6 | |
Can I Set the Location of the Pagination Buttons?
Of course ! By default, the Pagination Buttons are located on the right, but you can easily set the horizontal position of the pagination buttons. :
1) Turn on “Table Style” (Settings-> Appearance)
2) And select “Pagination Position” to the position you like. (none;left;center;rigth)
Example Pagination Positions on the Left:
If “Products per Page” is not Displayed ?
Most likely you have the Pagination Menu turned on. Turn it off and you can specify the number of products displayed on one page.
Can I Display the Page Numbers Above the Product Table?
Unfortunately, at the moment you can only display the position of the page number buttons below the product table (see above). But anyway if you would like to see such an option in the WooCommerce Product Table please contact us for an offer.