I’m trying to create a large video library for client that is moving their gym business online. They produce a few vimeo videos a day that their members are supposed to be able to access later on the website. I wanted to create a filtering mechanism so I put different collection lists into different tabs on a page in the members area. However, because the collection items are all pulling video links from vimeo it takes way too long for the page to load and it crashes on mobile.
My current work around is to create the illusion of tabs for a filter and sort by actually having different pages that load the different collection lists as opposed to having all the collection lists in the same tabs element.
Is there a better way to do this? Is there a better way to create a video library with a filter and sorting mechanism that involves hundreds of videos pulled from vimeo without making the page take forever to load?
@sabanna. Hi! I’ve been digging into your Mixitup3 tutorials you put together. Do you think this would be a good application for this?
Some of the things my client wants their members to be able to do is sort classes based on different types, but also different instructors, and also allow members to search through the list for a specific title of class.
Yes, with MixitUp you can achieve all of that. You would need their multi-filter file.
Also, I would recommend using thumbnails instead of real videos on the “Virtual Classes” page, it will decrease the page load time. I don’t think that site visitors would start watching videos on that page anyways.
Agreed! And you’re right, they won’t use those videos. I just couldn’t figure out any code solutions to pull the thumbnail image from vimeo (I don’t know very much about custom coding yet).
I’m looking at their mult-filter extension. Seems complicated but I’ll have to see what I can do with it. Do you have other tutorials for the multifilter extension?
Unfortunately, I don’t have a ready “automated” solution, but I know there are some scripts exists.
When I mentioned thumbnails I meant that along with the video you could upload an image-thumbnail when creating a CMS item. Then on the page with all courses you would connect only images and not videos
Sure. I figured as much but wanted to save my client some time. Thanks again for all the help and for putting together those tutorials. Hopefully you won’t have to hear from me again about it
hi @sabanna I’ve built a dummy version of a filtering page for a website based off of your basic filter and sorting tutorial. However after publishing the site the container and elements disappear. Working with a devleoper friend on it. It seems like the javascript is working and calling upon the mixitup library but the individual elements are disappearing. Any idea why it’s not working? Is it something to do with webflow?
You’ll see when you click and ‘instructor’ check box the Mixitup Mulitfilter tries to filter the content but then all of the tiles disappear. I’ve checked my class names, verified my code based on the tutorial but I can’t figure out what’s missing that’s causing the problem. Do you know why this might be happening?
Ok. So I realized that I had to change data attributes to data-value for the checkboxes which was causing my issue. But now the Multifilter does not filter based on elements matching two filters. Instead it includes everything attached to both filters.
So another way is that it appears to be ‘or’ logic between different filters. Not ‘and’ logic between different filters. How can I change that?
I gave in and started using Jetboost.io - it offers so much flexibility for dynamic search and filtering (and even CMS item auto-archiving). Fab for a large fitness video library
