> ## Documentation Index
> Fetch the complete documentation index at: https://dokumentation.websale.de/llms.txt
> Use this file to discover all available pages before exploring further.

# E-Search_ (pagination and hits per page)

> Build pagination for FACT-Finder search results and let the visitor choose how many products appear on a page.

> [!WARNING]
>
> The FACT-Finder direct integration is deprecated and no longer supported. It is only available up to FactFinder version 6.9 and is neither maintained nor developed further by WEBSALE. New integrations run exclusively via the FactFinder WebComponents. This reference serves the operation of existing shops.

Two things belong below every longer hit list: the page navigation and the choice of how many products should appear on a page. FACT-Finder provides both, and you assemble both in the template from loops and ranges.

Guide: FACT-Finder at a glance · Reference: E-Search\_ (basics and result list)

## Pagination

`E-Search_Paging` is both the check whether there is more than one page at all and the loop over the page numbers.

| Tag | Returns |
| - | - |
| `E-Search_Paging` | the check and the loop over the pages |
| `E-Search_PagingPosition` | the page number of the current loop iteration |
| `E-Search_PagingLink` | the link to the respective page |
| `E-Search_PagingActive` | applies to the page the visitor is currently on |
| `E-Search_PagingCurrent` | the current page number |
| `E-Search_PagingMax` | the highest page number |

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{!E-Search_Paging}
   <p>Seite 1 von 1</p>
{/!E-Search_Paging}

{E-Search_Paging}
   <p>Seite ~E-Search_PagingCurrent~ von ~E-Search_PagingMax~</p>

   <nav class="blaettern">
      {@E-Search_Paging}
         {E-Search_PagingActive}
            <strong>~E-Search_PagingPosition~</strong>
         {/E-Search_PagingActive}

         {!E-Search_PagingActive}
            <a href="~E-Search_PagingLink~">~E-Search_PagingPosition~</a>
         {/!E-Search_PagingActive}
      {/@E-Search_Paging}
   </nav>
{/E-Search_Paging}
```

> [!NOTE]
>
> The current page does not get a link. A link that leads to the page you are already on is misleading for visitors and an unnecessary self-reference for search engines.

> [!WARNING]
>
> `E-Search_PagingCurrent` and `E-Search_PagingMax` are standalone tags and have nothing to do with the loop. `E-Search_PagingPosition`, on the other hand, only returns a meaningful value within the loop or within one of the four jump ranges.

## Jumping to the edges

Four ranges return the links to the first, previous, next and last page. They only apply if the jump is possible at all.

| Tag | Applies if |
| - | - |
| `E-Search_PagingFirst` | the current page is not the first |
| `E-Search_PagingPrev` | the current page is not the first |
| `E-Search_PagingNext` | the current page is not the last |
| `E-Search_PagingLast` | the current page is not the last |

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{E-Search_Paging}
   <nav class="blaettern">
      {E-Search_PagingFirst}
         <a href="~E-Search_PagingLink~">Erste</a>
      {/E-Search_PagingFirst}

      {E-Search_PagingPrev}
         <a href="~E-Search_PagingLink~">Zurück</a>
      {/E-Search_PagingPrev}

      {@E-Search_Paging}
         {!E-Search_PagingActive}<a href="~E-Search_PagingLink~">{/!E-Search_PagingActive}
            ~E-Search_PagingPosition~
         {!E-Search_PagingActive}</a>{/!E-Search_PagingActive}
      {/@E-Search_Paging}

      {E-Search_PagingNext}
         <a href="~E-Search_PagingLink~">Weiter</a>
      {/E-Search_PagingNext}

      {E-Search_PagingLast}
         <a href="~E-Search_PagingLink~">Letzte</a>
      {/E-Search_PagingLast}
   </nav>
{/E-Search_Paging}
```

> [!NOTE]
>
> `E-Search_PagingLink` always refers to the range it is in. Within `E-Search_PagingNext` it leads to the next page, within `E-Search_PagingLast` to the last, and within the loop to the page currently being iterated.

> [!NOTE]
>
> The notation in the middle block, where only the opening and closing `a` elements are enclosed, keeps the page text in one place. This saves you from writing the number twice.

> [!WARNING]
>
> `E-Search_PagingFirst` and `E-Search_PagingPrev` apply under the same condition, as do `E-Search_PagingNext` and `E-Search_PagingLast`. On page 2 of 10, "First" and "Back" therefore both appear, even though they lead to the same page. Hide one of the two for short lists.

## Hits per page

The FACT-Finder Management defines which quantities are available for selection.

| Tag | Returns |
| - | - |
| `E-Search_ResultPerPage_SelectName` | the field name of the selection list |
| `E-Search_ResultPerPage_Option` | the loop over the quantities; as a single tag, the respective number |
| `E-Search_ResultPerPage_Active` | applies to the currently selected quantity |
| `E-Search_ResultPerPage_Link` | the link that sets this quantity |
| `E-Search_ResultPerPage_Params` | only the link parameters for an SEO address |

As a selection list:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<label>
   Produkte je Seite
   <select name="~E-Search_ResultPerPage_SelectName~" onchange="this.form.submit()">
      {@E-Search_ResultPerPage_Option}
         <option value="~E-Search_ResultPerPage_Option~"
                 {E-Search_ResultPerPage_Active}selected{/E-Search_ResultPerPage_Active}>
            ~E-Search_ResultPerPage_Option~
         </option>
      {/@E-Search_ResultPerPage_Option}
   </select>
</label>
```

As a link list:

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
<p class="treffer_pro_seite">
   Produkte je Seite:
   {@E-Search_ResultPerPage_Option}
      <a href="~E-Search_ResultPerPage_Link~"
         class="{E-Search_ResultPerPage_Active}aktiv{/E-Search_ResultPerPage_Active}">
         ~E-Search_ResultPerPage_Option~
      </a>
   {/@E-Search_ResultPerPage_Option}
</p>
```

> [!NOTE]
>
> `E-Search_ResultPerPage_Option` is loop and value in one. Within the loop, the single tag outputs the quantity of the current iteration, which can therefore appear both in the `value` and as the label.

> [!WARNING]
>
> The link variant does not need a form and therefore also works without JavaScript. The selection list with `onchange` needs a submit button next to it for this case.

## Links for SEO addresses

`E-Search_PagingLink` and `E-Search_ResultPerPage_Link` each have a Params variant that returns only the parameters.

```html theme={"theme":{"light":"github-light","dark":"github-dark"},"languages":{"custom":["/languages/websale.json"]}}
{E-Search_Paging}
   {@E-Search_Paging}
      {E-Search_PagingActive}
         <strong>~E-Search_PagingPosition~</strong>
      {/E-Search_PagingActive}

      {!E-Search_PagingActive}
         ~DC-FPFactFinderLink_reset~
         ~DC-FPFactFinderLink_set($CAT-Link$)~

         {E-Search_PagingParams}
            {DC-FPFactFinderLink_contains(?)}
               ~DC-FPFactFinderLink_append(&)~
            {/DC-FPFactFinderLink_contains(?)}
            {!DC-FPFactFinderLink_contains(?)}
               ~DC-FPFactFinderLink_append(?)~
            {/!DC-FPFactFinderLink_contains(?)}
         {/E-Search_PagingParams}

         ~WS-DisableXSSProtectionOnce~
         <a href="~DC-FPFactFinderLink~~E-Search_PagingParams~">
            ~E-Search_PagingPosition~
         </a>
      {/!E-Search_PagingActive}
   {/@E-Search_Paging}
{/E-Search_Paging}
```

> [!WARNING]
>
> The call to `DC-FPFactFinderLink_reset` must be inside the loop, not before it. Otherwise each iteration appends its parameters to the address of the previous one.

Guide: SEO extension of links · Reference: DC- (Parameters)

## The tags at a glance

| Tag | Single tag | Range tag | Negative range tag | Loop tag |
| - | - | - | - | - |
| `E-Search_Paging` | – | yes | yes | yes |
| `E-Search_PagingPosition` | yes | – | – | – |
| `E-Search_PagingLink` | yes | – | – | – |
| `E-Search_PagingParams` | yes | yes | yes | – |
| `E-Search_PagingActive` | – | yes | yes | – |
| `E-Search_PagingCurrent` | yes | – | – | – |
| `E-Search_PagingMax` | yes | – | – | – |
| `E-Search_PagingFirst` | – | yes | yes | – |
| `E-Search_PagingPrev` | – | yes | yes | – |
| `E-Search_PagingNext` | – | yes | yes | – |
| `E-Search_PagingLast` | – | yes | yes | – |
| `E-Search_ResultPerPage_Option` | yes | – | – | yes |
| `E-Search_ResultPerPage_SelectName` | yes | – | – | – |
| `E-Search_ResultPerPage_Active` | – | yes | yes | – |
| `E-Search_ResultPerPage_Link` | yes | – | – | – |
| `E-Search_ResultPerPage_Params` | yes | yes | yes | – |

All tags on this page apply in the search template and in the campaign template. `E-Search_PagingPosition`, `E-Search_PagingLink` and `E-Search_PagingParams` only within the `E-Search_Paging` loop or one of the four jump ranges, and the hits-per-page tags only within the `E-Search_ResultPerPage_Option` loop.

## Related topics

* Guide: FACT-Finder at a glance
* Reference: E-Search\_ (basics and result list)
* Reference: E-Search\_ (filters)
* Reference: E-Search\_ (sorting)


## Related topics

- [E-Search_ (filters)](https://dokumentation.websale.de/en/v8s/referenz/tags/e-search/filter.md)
- [E-Search_ (sorting)](https://dokumentation.websale.de/en/v8s/referenz/tags/e-search/sortierung.md)
- [E-Search_ (basics and result list)](https://dokumentation.websale.de/en/v8s/referenz/tags/e-search/grundlagen-und-ergebnisliste.md)
- [Search API](https://dokumentation.websale.de/en/schnittstellen/search-api.md)
- [ws-page-size-selector](https://dokumentation.websale.de/en/ws-search/integration-in-die-templates-storefront/webcomponents/ui-komponenten/ws-page-size-selector.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.