Skip Navigation

[Resolved] How to Toggle View Loop Style from Front End?

This thread is resolved. Here is a description of the problem and solution.

Problem:

I'd like to have a way to change the Loop style from the front end. Many websites I've visited have something like this to change the style from grid to list to table etc...

Solution:

There isn't such kind of built-in feature within Toolset Views/Blocks plugin, you might consider to create two views, but display them in different style(grid and list), then use custom JS codes to toggle to different view, for example:

Relevant Documentation:

https://api.jquery.com/toggle/

This support ticket is created 3 years, 5 months ago. There's a good chance that you are reading advice that it now obsolete.

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.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

This topic contains 2 replies, has 2 voices.

Last updated by NickC8880 3 years, 5 months ago.

Assisted by: Luo Yang.

Author
Posts
#2124809

I'd like to have a way to change the Loop style from the front end. Many websites I've visited have something like this to change the style from grid to list to table etc... In fact, a functionality like this is built into the BuddyBoss theme that I'm using.

Is this possible to do for Toolset Views in a reasonably accessible/low-code way?

You can see an example here, where you can toggle between grid and list view.
hidden link

#2124989

Hello,

There isn't such kind of built-in feature within Toolset Views/Blocks plugin, you might consider to create two views, but display them in different style(grid and list), then use custom JS codes to toggle to different view, for example:
hidden link

#2125381

Thanks for quickly confirming as well as finding a possible alternative!