# Settings - Pagination Templates

## What are Pagination Templates?

![pagination gif](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/8Kr9SJ6WUXiuYZ3c3soX/pagination.gif)

* A feature that can replicate mouse and keyboard actions.
* Works on all sites once you configure a few values.
* New templates will be continuously added.

{% hint style="success" %}

### What is Pagination?

The most common way to load next page data. It consists of page buttons displayed as numbers (or characters), and you move to the next page by clicking the number or specific button.

If each page can be accessed directly via an independent URL, you can use the [**Group Extraction**](https://help.listly.io/getting-started/result-page-features/group-extraction) feature. However,

**1. When the URL doesn't change even when moving between pages**

**2. When accessing a specific page's URL automatically redirects to the first page**

In environments like these, try solving the problem with **Pagination Templates** 🙂
{% endhint %}

{% hint style="warning" %}
Pagination templates are settings that can be applied to individual tasks, and **each individual task has approximately a 10-minute collection time limit**. Due to this limit, if you enter too many pages, extraction may stop partway through. Also, the number of pages that can be extracted within the collection time using pagination varies depending on the amount of data per page.

* For example, on Site A with many images, only up to 24 pages could be extracted within the execution time.
* Conversely, on text-heavy Site B, up to 110 pages were successfully extracted.

In other words, the extractable range varies depending on the data volume and structure per page. Generally, pagination templates are suitable for scales around 100 pages.

[**Q. Why is there a 10-minute collection time limit?**](https://help.listly.io/docs/ko/support/faq/and/10)
{% endhint %}

***

## How to Use

{% stepper %}
{% step %}

#### Check Pagination Type

Refer to the type classification below to identify the pagination characteristics of the web page you want to extract.

Check whether there's a 'next page' button represented by an arrow (▶️) or 'Next' text, and how the page moves when clicking that button. Identify by function, not design!

***

<div align="left"><img src="https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/i9mjvTIBh7vxy6sHJr48/type_1.png" alt=""></div>

TYPE 1. Button that **moves directly to next page (1→2) when clicked** exists

<div align="left"><img src="https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/2wj3gpYHm8WJ5RfXE1lD/type_2.png" alt=""></div>

TYPE 2. **No** button to move directly to next page, only button to **move to next group (1→N)** exists

<div align="left"><img src="https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/f7N0wUWRtFon3jOnduii/type_3.png" alt=""></div>

TYPE 3. No buttons to move to next page or group **except page numbers**

<div align="left"><img src="https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/8dP2dWOvkGRYzSZ8HmKP/type_4.png" alt=""></div>

TYPE 4. **Only previous/next page buttons** exist without page numbers

***

**Let's review the steps using Site A as an example.**

![site A pagination](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/PIj5oO7jFKaRgDv08uuV/%ED%8E%98%EC%9D%B4%EC%A7%80%EC%9D%B4%EB%8F%99.jpg)

When clicking the 'Next' button in the pagination at the bottom of the page, it moved from page 1 directly to page 11—in other words, to the next group. We can identify that this page corresponds to **TYPE 2** from the above items.
{% endstep %}

{% step %}

#### Extract the First Page

![extract first page](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/Slxq7F9MaXUmJcjjBaEi/1%ED%8E%98%EC%9D%B4%EC%A7%80_%EC%B6%94%EC%B6%9C.jpg)

Extract page 1 where pagination begins.

{% hint style="success" %}
Here's a tip! You can choose either WHOLE or PARTS, but selecting **'PARTS'** can improve accuracy when extracting multiple pages at once. 🙂
{% endhint %}
{% endstep %}

{% step %}

#### Navigate to Task Settings

![task settings navigation](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/YbusHp7SBqNNRKxpl8Zg/%EA%B2%B0%EA%B3%BC%ED%8E%98%EC%9D%B4%EC%A7%80%20%EC%84%A4%EC%A0%95%EC%A7%84%EC%9E%85.jpg)

Check the extracted data in the results page. Site A has 80 data items per page. Click Browser Settings at the top to navigate to that task's settings page.
{% endstep %}

{% step %}

#### Configure Template Settings

![action template area](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/YZbVYCMlhrtkQvFK45QK/Untitled.png)

**A) Add Action Template** At the bottom of settings in **ACTION TEMPLATE**, click the **+ADD** button. The display and design of this setting may change in the future, but the application method remains the same.

![templates selection](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/iSvt6Uooc1pP1Ngwr6mb/templates.webp)

**B) Select Pagination Type** Refer to step 1 explanation to select the template to apply. Site A's case was **Pagination Type2**.

![variables image](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/vCk31vokFqYs0PXu46MN/%EB%B3%80%EC%88%98%EC%9E%85%EB%A0%A5.jpg)

**C) Enter Variables** Fill in items ①, ②, ③ in the image.

* ① How many times to repeat this template's action\
  If you enter 5, it repeats the next page action 5 times, extracting up to page 6. If you want to extract up to page 10, enter 9.
* ② CSS selector value for current page number\
  As shown in the marked area in the image, right-click the 'current page' number in the website's pagination and select it, then refer to [Copy & Paste CSS Selector](https://help.listly.io/getting-started/extension-features/css-selector) to enter that value.
* ③ CSS selector value for 'Next' button\
  As shown in the marked area in the image, right-click the 'Next' button in the website's pagination and select it, then refer to [Copy & Paste CSS Selector](https://help.listly.io/getting-started/extension-features/css-selector) to enter that value.

After entering all items, click `Add` → `Save` to save settings.

Other pagination types work the same way. Check the pagination type for each situation, then copy and paste CSS selector values.
{% endstep %}

{% step %}

#### Click Re-extract and Check Data

![re-extract button](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/qWdPkiQ7e4JiYiF1ffVs/%EC%9E%AC%EC%B6%94%EC%B6%9C%20%ED%81%B4%EB%A6%AD.jpg)

After saving settings, **be sure to click the re-extract button** to extract again with the applied settings.

![result after apply](https://content.gitbook.com/content/goHfMCeMlqJPW61OR5d1/blobs/UOnmM8Pnicu9IbZou78u/%ED%85%9C%ED%94%8C%EB%A6%BF%20%EC%A0%81%EC%9A%A9%ED%9B%84.jpg)

A total of 480 data items were extracted—80 from each of 6 pages.

Use templates to efficiently extract information spread across multiple pages 😊
{% endstep %}
{% endstepper %}
