HI, I am wondering if there is a way that anyone knows to link in a JQuery Filter Plugin like this one http://mixitup.io/
What I would like is to somehow tag divs/containers and then set up a navigation bar that can then filter by these tags.
Any ideas would be great. Thanks.
Hi Chris
I am wanting the same function, it would be great to get some feedback . Exciting to see webflow boundaries growing more every day
Hi @Chris_Reeves and @garethknott you guys can totally set something up like this in Webflow.
Check out their documentation to learn how to set things up. Here’s an example of how to create filter buttons from the docs:
<ul>
<li class="filter" data-filter="dogs"></li>
<li class="filter" data-filter="cats"></li>
<li class="filter" data-filter="krakens"></li>
<li class="filter" data-filter="dogs cats"></li>
</ul>
And this is how you would add the data-filter in Webflow:
Also you will have to find a place to host their “jquery.mixitup.min.js” file and link to it in the after </body> custom code section.
So I can’t host the plug-in file in my site in webflow? That seems strange. Would I have to have another site and host it there and then direct webflow to it? That seems a little odd to me. Why can’t i host the plug-in in the head section of the custom code? Please advise, thank you 
Haha I know it’s weird Richard. We’re actually working on a way for you to host files on Webflow. So this would be possible in the near future. I know it’s a bummer, but in the meantime you’ll have to host it on another server. Some people use their dropbox - it’s not a CDN like Webflow, but it gets the job done.
In your case it would work because your gallery will probably be lower in the page and will not notice slow download of the js file.
Thank you for your reply @thesergie, but I’m afraid my ambitions are a little bit more complicated.
What I want to design and develop is a website with a unified stream of different classes of content, from music to photos to videos to merchandise to blog posts to show flyers and to be able to dynamically sort and filter these categories with the navbar on top.
Each category of content will need it’s own javascript code to allow it to do the things that I want it to do. For example, each musical track will have a built in play button, which will connect with the fixed transport controls on the bottom of the site. It will also feature the ability to buy and download the track all within the space of the album art itself, without the need to visit a second page.
The same will be the case with the merchandise. I want somebody to see the picture of a t-shirt, click on it and purchase it directly from the picture itself, without the friction of being taken to another page. The Mix It Up Plug-in could power the overall filtering of objects, but other javascript and plug-ins will be needed to do all of the other things that I am imagining.
I will color code each category of stuff, and also allow the user to go to a page dedicated to each category for more in depth browsing, all the while keeping the fixed transport controls and navigation available as need be.
This is ambitious, yes, but I think that it is doable. I just need some javascript help, and I need Webflow to integrate javascript more deeply into the workflow to create the experience that I’m looking for without too much lag time for the user.
k, fingers are tired
RN
We’re working on it! Good luck with your website - it seems pretty complex, but doable. Btw there are many services out there that provide a payment modal out of the box.
Thank you for the input @thesergie. I am looking into all of the options that I can find right now and we’ll hopefully fulfill my needs by summer. If you have any suggestions of the top of your dome I’m all ears
RN
Heh, I use a $5 mo digital ocean VPS account to host all my dev stuff. Perfect for fast loading of external scripts and style sheets. I can play with my webflow exports, etc. I know, it’s so shameful =)
Hey guys. Just came to this thread since I am building a site where I need a sort/filter function. I just wanted to know if I still have to host the .js files on a different server?
Thanks in advance.
I found the way how to filter pics in gallery without adding code or .js files. If you still interested let me know
Well, I hope I will be able to explain correct 
Biggest “pain in ass” is creating classes of pics for filtering. It has to be NOT NESTED classes. Because nested classes do not appear in the interactions. So I created few images with all classes that I need. (It is not necessary to upload pics on this step). For example:
1- img-gallery ( later will be used for all images),
2 - plum,
3 - cherry,
4 - apple,
5 - rose,
6 - tulips,
7 -fruits,
8 - flowers
Then we are adding to our gallery, images, which there has to be and which we will filtering. All images inside the div’s and has display settings “Inline-Block”. ALL images will have to class “img-gallery”, then depends on picture’s type we are adding more classes to every of them. In this case will have images:
Next step is creating buttons (links) for filtering gallery. So in this case we will have:
For every button (link) we have to create interaction on CLICK trigger, affecting different elements.
Show All imgs:
1 step: Scale to minimum (there is 0,01x) and
make it transparant:
2 step: Scale to original and make it visible:
For filtering other classes we will have to make 2 triggers on click, few steps every trigger.
Examle for plum:
1st trigger is hiding all img-gallery
1st trigger, 1step: img-gallery —> scale 0.01x, opacity 0%
1st trigger, 2step: img-gallery —> display none
2nd trigger is showing only class that we need
2nd trigger 1step: plum —> scale 0.01x, opacity 0%
2nd trigger 2step: plum —> scale to original, opacity 100% ##!!! UPD : in 2nd step add Diplay Inline-block. Other way image will not appear if it was hide by other filter interaction ##
Same interactions we make for every other class-filter (button or link)
It can look complicated, but it is really not. It is pretty much similar steps. And no code, no connected plugins. For me it is much easier. 
HERE IS DEMO —> http://filtergallery.webflow.com/
Hi @pingram3541
I saw a comment you made about hosting files on a $5/mo Digital Ocean VPS. I’ve toying with the idea of hosting my main site on Digital Ocean, would you recommend it? How do you find them?
I’ve been very impressed with DO. I’ve been hosting host my main site tellatek.com and a few others off a $10mo droplet and haven’t had any issues with DO at all. Very reliable.
Ok cool. Your site looks impressive.
Would you say that the speed of you website is down to hosting on DO?
Also, how would you compare it to a shared Hostgator a/c with regards to bandwidth etc…?
Is DO’s bandwidth on the $10/mo droplet adequate?
Also is it hard to setup?
The only thing that slows my site down is me as I also often use the same droplet for sub-domains used for development until my client sites go live so I reboot every once in a while to refresh resources…not often, maybe couple times a year at most and a reboot takes under a minute. The bandwidth has never been an issue for me and they are spot on with any maintenance notices which have been few and far between in the past several years I’ve been using them.
Some of the advantages w/ DO is yes, VPS is much faster in my experience than shared hosting, hostgator, blue host, godaddy etc. especially the database server, often abused and overloaded by thousands upon thousands of subscribers…and then there’s the shared IP address that can often get you in trouble with blacklists and the like.
With DO You have full control over the software environment, the memory allocation to apps, the file system and permissions, and you get a dedicated IP address w/ full root SSH access with each droplet so no one else is gonna tarnish your reputation but you.
But at the same time you’re responsible for installing your choice OS, maintaining it, keeping it up to date and keeping it secure. So there is a trade off but there are literally tons of tutorials to help you setup your VPS server. In fact, one of the things that attributes to their success is that DO pays a nice little sum of $ to those that write up tutorials for the community.
Give it a try. The $5mo is also relative to your droplet running for the full month. You can simply setup a droplet just to play around, shut it down and only spin it up when needed, you pay even less. It’s a pretty amazing idea IMO.
However, if the setup, security and maintaining your own VPS server is a scary idea, and the sites you build here on webflow don’t need applications such as wordpress or similar. The hosting here is WAY better than shared hosting elsewhere and you maintain edit-ability within the webflow framework.
Thanks for your detailed feedback @pingram3541, its much appreciated.
Do you have a link to any simple DO setup tutorials i could have a look at?
Cheers
Sure, and I hope its not too unscrupulous but here is my ref link which also gives you $10 off if you choose to sign up.
I’ve been using Vesta Control Panel which installs the typical LAMP/LEMP stack (mix of Apache and Nginx). I use this to support most CMS such as WordPress.
I used this tutorial after installing a fresh droplet w/ Ubuntu 14.04. (12.04 instructions still work)
Tons of other control panel install tutorials here:
And here is a simple 1-click WordPress install via a droplet image.
Lastly, this came in handy too so server doesn’t run out of memory,
Wow, I think we totally hijacked this thread. Maybe we should have started a DO thread…
