[Resolved] left and right pagination arrows

[Author]

Posts

[digitalF]

We're using the toolset views (slide style) with pagination arrows. I've noticed that the 'previous' pagination arrow doesn't work until the slide is on the second slide, and when I'm on the last slide the 'next' pagination arrow doesn't work either.

Ideally we like infinity scrolling for the pagination arrows, so on the first/last slides both the next/previous arrows can be selected. Is this possible?

[Waqar Supporter Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)]

Hi,

Thank you for contacting us and I'd be happy to assist.

Can you please share temporary admin login details, along with the link to a page where this view can be seen?

I'll be in a better position to suggest you the next steps accordingly.

Note: Your next reply will be private and please make a complete backup copy, before sharing the access details.

regards,
Waqar

[Waqar Supporter Languages: English (English ) Timezone: Asia/Karachi (GMT+05:00)]

Thank you for sharing the details.

During testing on my website, I was able to make the next and previous navigation links work on the first and the last pages, by updating the navigation code from:

<ul class="pagination">
	<li class="page-item home-left-arrow">[wpv-pager-prev-page][wpml-string context="wpv-views"]<i class="fas fa-chevron-left"></i>[/wpml-string][/wpv-pager-prev-page]</li>
	<li class="page-item">[wpv-pager-next-page][wpml-string context="wpv-views"]<i class="fas fa-chevron-right"></i>[/wpml-string][/wpv-pager-next-page]</li>
</ul>

To:

<ul class="pagination">
	<li class="page-item home-left-arrow">
		[wpv-conditional if="( '[wpv-pager-current-page]' eq '1' )"]
			<a class="wpv-filter-previous-link js-wpv-pagination-previous-link page-link" href="[wpv-post-url item='$current_page']?wpv_paged=[wpv-pager-total-pages]" data-page="[wpv-pager-total-pages]" data-viewnumber="58">
					[wpml-string context="wpv-views"]<i class="fas fa-chevron-left"></i>[/wpml-string]
			</a>
		[/wpv-conditional]
		[wpv-conditional if="( '[wpv-pager-current-page]' ne '1' )"]
			[wpv-pager-prev-page]
				[wpml-string context="wpv-views"]<i class="fas fa-chevron-left"></i>[/wpml-string]
			[/wpv-pager-prev-page]
		[/wpv-conditional]
	</li>
	<li class="page-item">
		[wpv-conditional if="( '[wpv-pager-current-page]' eq '[wpv-pager-total-pages]' )"]
			<a class="wpv-filter-next-link js-wpv-pagination-next-link page-link" href="[wpv-post-url item='$current_page']?wpv_paged=1" data-viewnumber="58" data-page="1">
				[wpml-string context="wpv-views"]<i class="fas fa-chevron-right"></i>[/wpml-string]
			</a>
		[/wpv-conditional]
		[wpv-conditional if="( '[wpv-pager-current-page]' ne '[wpv-pager-total-pages]' )"]
			[wpv-pager-next-page]
				[wpml-string context="wpv-views"]<i class="fas fa-chevron-right"></i>[/wpml-string]
			[/wpv-pager-next-page]
		[/wpv-conditional]
	</li>
</ul>

In this approach, we use the conditional output to detect if the current page in the view is either the very first or the very last.

On the very first page, a manual navigation link is created for the last page and on the very last page, a manual navigation link is created for the first page.

This way, the navigation links work in an infinite loop.

I hope this helps and please let me know if you need any further assistance around this.