How can I remove pagination and add circular categories in Dawn Theme store?

[Alancart]

My Store link: https://alancartonline.myshopify.com/ , Please help me to resolve 2 issues

Issue 1 : I need to remove pagination option (view all ) across website and enable infinity scrolling

Issue 2: I need to implement circular categories list on home page.

Screenshots attached.

[Ujjaval]

@Alancart 
add below css into base.css file(online store->themes->assets->base.css)

a#ViewAllButton-template--16820368605493__2e5d404c-af17-41ee-bd1e-0d397de81100 {
    display: none !important;
}
.center.collection-list-view-all.small-hide.medium-hide {
    display: none !important;
}
.center.collection__view-all {
    display: none !important;
}

[Alancart]

Still pagination is visible on collection pages : https://alancart.com/collections/women

There is a 1,2,3 button at the end of the page and I need infinity scrolling option.

[Ujjaval]

@Alancart 
can you put below css also 

.pagination-wrapper {
    display: none !important;
}

in base.css file 

[Alancart]

This option is truncating page 2 and 3 an d other pages, not loading all products.

[Ujjaval]

@Alancart  i think you need to remove pagination code into main-collection-product-grid.liquid file .

[Alancart]

Not working, same issue.

[ferdware]

I found this to be easier

look for the section file "main-collection-product-grid.liquid"

Scroll to about line 199 where you will see this:

  "name": "t:sections.main-collection-product-grid.name",
  "class": "section",
  "settings": [
    {
      "type": "range",
      "id": "products_per_page",
      "min": 25,
      "max": 500,
      "step": 25,
      "default": 25,
      "label": "t:sections.main-collection-product-grid.settings.products_per_page.label"
    },

then change the following parameters to what you want for example

Max: 1000

Min: 100

Step: 100

Default: 1000

- Note: the STEP and MIN values must be multiples of the MAX value. My rule of thumb is the MIN/STEP values is the MAX value divided by 10. 

[esssee]

Hi Alan, Try adding this code to the bottom of component-slideshow.css

.slideshow__controls.slider-buttons.no-js-hidden { display:none; }

[N_H]

Hi @Alancart, 

I had the same issue and couldn't find a solution on the internet.

So I tried solving with my own common sense and programming knowledge.

Here's how you do it:

• Got Edit Code from your dawn theme
• And the file "main-list-collections.liquid"
• Search for the following lines of codes: 

{%- paginate collections by paginate_by -%}
  <ul
      class="collection-list grid grid--{{ section.settings.columns_desktop }}-col-desktop grid--{{ section.settings.columns_mobile }}-col-tablet-down"
      role="list">
      {%- for collection in collections -%}
          ...
     {%- endfor -%}
   </ul>
    {% render 'pagination', paginate: paginate %}
{%- endpaginate -%}​

• and only remove/delete the following lines:

{%- paginate collections by paginate_by -%}
    ...
    {% render 'pagination', paginate: paginate %}
{%- endpaginate -%}​

It solved my problem, hope it does same for you.

[mandadee]

Would you by chance know how to approach this if you only wanted to remove pagination from a specific collection?