---
schema_version: "1"
id: 3531612a92e083833ae867bf9a82496bf002211d8d56bd727b81f6c182410e5c
title: Provide a View All Button for Search Results
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/commerce-cloud/b2c-commerce/guides/search-and-navigation/b2c-providing-a-view-all-button-for-search-results.md
canonical_url: https://developer.salesforce.com/docs/commerce/pwa-kit-managed-runtime/guide/b2c-providing-a-view-all-button-for-search-results.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: ed35fed9659a1ebfc2fa27c615ad045eefdd20b95c8ee33cad3c63d90c1cf22d
products:
  - Composable Storefront
  - Salesforce APIs
---
# Provide a View All Button for Search Results

Create a View All button for search results.

## To Create a View All Button for Search Results:

1.  Create the resource messages for the View All link.

    To the pagingcomponents.properties file, add a `pagecomponents.paging.viewall=View All` resource message.

2.  In the **pt_global.css,** add a `.pagination li.viewall`style. This can be the same as the `.pagination li.nextpage` style.
3.  In the Search pipeline, click the **Paging (bc_api)** pipelet and change the value of the PageSize property to CurrentHttpParameterMap.sz.intValue. This causes the pipelet to derive the value of the paging size from the value passed into the pipeline if it's present. The name of the property is set by the PagingModel class AppendPaging method.
4.  To the pagingbar.isml file, you need to add the following in the first \<sscript>in the file:

    ```javascript
    if (pdict.pagingmodel.pageSize == null) {
      pageSize = 9;
    } else {
      pageSize = pdict.pagingmodel.pageSize;
    }
    ```

5.  After the next page control, add:

    ```javascript
    <isif condition="${totalCount > pageSize}">
      <isscript>dict.pagingmodel.setPageSize(totalCount); </isscript>
      <li>
        <a href="${pdict.pagingmodel.appendPaging( pageURL, 0)}">
          ${Resource.msg("pagecomponents.paging.viewall", "pagecomponents", null)}
        </a>
      </li>
      <isscript>pdict.pagingmodel.setPageSize(pageSize); </isscript>
    </isif>
    ```

**note:** When you have made this change, you can't change the default paging size directly from the pipeline. Instead, you have to change the pageSize = 9 line in the pagingbar.isml file to the desired value.