Pagination template with separator before last page

Open Q&A
, ,
1

Hello,

i would like to change my actual pagination : < 1, 2 ,3 , 4 >
for this :
< 1, 2 , 3 … 6 >

So display the first 3 pages, then put a separator and display the last page number.

I thought I could replace Last Link ‘>>’ with the number of the last page and then move it in CSS before the next arrow. But it’s not working.

instantsearch.widgets.pagination({
  container: '#pagination',
  scrollTo: '.search-panel',
  showFirst: false,
  showLast: true,
  cssClasses: {
    selectedItem: 'active',
    list: 'pagination'
  },
  templates: {
    last: '{{#isLastPage}}<li class="ais-Pagination-item ais-Pagination-item--page ais-Pagination-item--page">{{page}}</li>{{/isLastPage}}',
  },
})
1 Like
2

Hi, I was looking to implement this. I was wondering if you found a solution for this?