Skip Navigation

[Resolved] left and right pagination arrows

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

This topic contains 2 replies, has 2 voices.

Last updated by Waqar 2 months, 3 weeks ago.

Assigned support staff: Waqar.

Author
Posts
#2128717

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?

#2129417

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

#2131521

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.