![]() If you save the templates now and check out your member list, you'll see that it's now working! Substitute your custom profile field numbers as necessary. Paste the following into your member list row I'll go into the script in more detail when I describe how to add more sort by buttons. If you want to save yourself the hassle, just use the same class names I use. If you have changed any of the class names in your HTML, you will need to read through the script and change to the appropriate class. The next bit is telling what div to act execute the isotope on. The first line is telling the script to not execute until the entire page has loaded. If you prefer, you can add it to your global wrapper in the usual spot. I recommend just putting it on the member header template just because you don't need to run the script anywhere else. You must have this (or the version on your site) linked before the script in order for it to run properly. Use your site link for the script source. The following script source links directly to isotope's website, I strongly recommend downloading a version yourself and uploading it to your site. The Sixth and final section is the script. I'll address a work around for that later in this guide. Infinite scroll is also not doable on Jcink due to the way it needs to be set up. All the script does is sort information that is already there, it doesn't retrieve any additional data. You can only display so many users on a page and the script will not load more that for you. The div class is important here because it is referred to by the script.įifth section is the pages button and this is sadly the memberlist's biggest weakness. The fourth section contains the actual members and the container that they will sit within. The third section has a handy reset button, allowing your users to put all characters back into view. ![]() ![]() The most important thing here is data-filter=".Good" take note of the word used in the data-filter attribute. These are what will make users vanish from view (filtered out) when they do not meet the filter requirements. The second section is the filter buttons. The most important thing here is data-sort-by="face" take note of the word used in the data-sort-by attribute. These are what will rearrange the order in which member's are displayed. The first section is the sort by buttons. Sort by: original order Face Claim Character Age Filter by Character Faction show all The Good Guys The Bad Guys Member List Row - this is every individual member listed in the member list. Member List Headers - this is the container that every member sits in within the member list. Save your custom profile fields and take note of their numbers. Example:Ĭharacter Age and Playby does not need any special settings. I strongly recommend that Character Faction is a drop down selection, the script relies on everyone using the same spelling and capitalisation. For the purposes of this exercise, we're going to use the following: To get started, set up a couple of custom profile fields.
0 Comments
Leave a Reply. |