Play Video

How To Build a Dynamic Page Leaderboard in Wix | Wix Database Tutorial

HOW TO BUILD A DYNAMIC PAGE LEADERBOARD IN WIX | In this video I’m going to show you how to build a leaderboard and points system on a dynamic page in Wix. This video dives deep into the capabilities of Wix’s platform.

Wix Corvid, previously known as Wix Code has opened a world os possibilities as shown with this Wix Database Tutorial. Creating a leaderboard can build some gamification features into your website causing higher amounts of community interaction and engagement.

As mentioned in the video, I just announced our Wix Nation Leaderboard which can be accessed here: https://www.wixmywebsite.com/leaderboard This leaderboard is in BETA stage and at MVP (Minimum Viable Product). The concept of this leaderboard is to create and fun and engaging way to interact as a community while also building incentives for commenting on these YouTube videos.

The goal is that the Wix Nation Leaderboard comes out of BETA, which relies solely on your feedback and comments on these videos. Following that, I would look to start adding more point grabbing opportunities, contests and prizes.

Right now, everything is manual entry and works solely based on your YouTube username, profile picture and channel URL. The point scale is as follows:

WIX NATION LEADERBOARD (BETA):

Scoring System:

First Comment: 25 points
Helpful Comment: 30 points
Top Comment (determined by community based on likes, hearts and engagement): 35 points
General Comment: 10 points

If you’d like to get on our leaderboard and track progress, click here: https://www.wixmywebsite.com/leaderboard

*Reminder: The leaderboard is manual entry so you will not be adding, editing or removing any data. It is simply used for tracking and viewing right now in the MVP stage.

VIDEO & CHANNEL RESOURCES:

Sign up to your Free Wix Training Academy here:
https://www.wixmywebsite.com/

BECOME A WIX NATION INNER CIRCLE MEMBER (LIMITED TO 10):
https://www.patreon.com/wixtrainingacademy

GET YOUR WIX ACCOUNT & HOSTING:
https://bit.ly/2QdbqCo

MUST-HAVE TOOL FOR YOUTUBE CHANNELS:
https://www.tubebuddy.com/MPS

Watch more videos on my Wix Training Academy YouTube Channel:
https://www.youtube.com/user/ComputerMDofGilbert

WIX TRAINING DIGITAL ENTREPRENEUR PLAYLISTS:

“Wix Ecommerce: The Ultimate Guide To Building An Online Store in Wix:
https://www.youtube.com/playlist?list=PL-m-hYpBsNRog8IJTA9nDh8v69dQPkjXs

“Building A Social Network in Wix: The Non-Coding Founder’s Guide”:
https://www.youtube.com/playlist?list=PL-m-hYpBsNRoFvJHfOroU2_cWXS896dIQ

“Corvid by Wix Training Tutorials”:
https://www.youtube.com/playlist?list=PL-m-hYpBsNRpl47zvCKHdfVv5k3D0s9ZG

“Wix My Website”:
https://www.youtube.com/playlist?list=PL-m-hYpBsNRqWqgpOSWU06HmLJM4Y_KDE

“Ascend by Wix: Training Tutorials”:
https://www.youtube.com/playlist?list=PL-m-hYpBsNRqiTbV6OGc8oFMExJh5Mx7D

NEW TO THE CHANNEL? START BY WATCHING THESE VIDEOS:

“Open Q&A”:
https://youtu.be/NkVwCumsEeI

“8 Underrated Wix Features You Probably Don’t Know About ”:
https://youtu.be/mx6eiYxlYDI

“5 Ways To Obtain Funding For Your Business”:
https://youtu.be/VD-xL4_9pJ0

“How to Create Wix Code Databases & Dynamic Pages: Wix.com”:
https://youtu.be/SD42xkb8vOs

“Wix My Website Welcome Video”:
https://youtu.be/jMhkSUx-xzc

__________

CONSULTING: Want to work 1-on-1 with MPS to work through online business strategy, Wix strategy or YouTube strategy? We are now accepting applications for new clients. You can apply here: https://www.wixmywebsite.com/copy-of-work-with-us-1

DONE FOR YOU WEB DEVELOPMENT. Want to have a professional website developed? I am now accepting applications for new clients. I specialize in Corvid/Wix Code Development projects on Wix. If you’d like to hire me for your project, you can submit your application here: https://www.wixmywebsite.com/copy-of-work-with-us-1
——————–
Stay Connected:
Email: info@wixmywebsite.com
Twitter: http://www.twitter.com/WixTraining
Subscribe: https://www.youtube.com/c/ComputerMDofGilbert?sub_confirmation=1
Hire Michael: https://www.wixmywebsite.com/copy-of-work-with-us-1

MPS Message: I wanted to make sure you are aware that this video description contains affiliate links. It is completely up to you whether you utilize these links. Just know that if you use these links, there is no difference to you, but it does partially support this channel 🙂

what’s going on which nation MPs here from which training academy and today I’m going to show you how to build a dynamic page leaderboard in Wix why such a random topic you may ask because we just announced the beta of Wix nation leaderboards that’s right you have the opportunity to get to the top of that leaderboard and it’s a whole points leaderboard you can access in the description below and it starts right now we’re ranking it via
comments so if you’re the top comment if you have the most helpful comment or if you just comment in general you are going to get points when you comment on each of these videos and you can track where you stand in the leaderboard the Wix nation leaderboard in the link in the description below and that’s what we’re gonna build today in today’s video I wanted to show you and that’s kind of the story behind it so I’ll kind of walk you through how I
built the Wix nation leaderboard and then we’ll go through it and you’ll have an opportunity to rank up in it so let’s first dive into it by clicking that like button so you never miss any content comments so you can rank on the leaderboard and let me know if you’re excited to learn about this and lastly make sure you click that subscribe button in the bottom right in this video and turn those Bell notifications on so you never miss a single
upload and you’ll instantly plug into 30,000 plus other like-minded entrepreneurs and if you want some free Wix training content I’ve got it for you come over to Wix training academy com join the Academy and email password you’re in no strings attached that’s it let’s jump into it so we’re here in our blank editor right and what we’re going to need to start with is activating our corvid tools so we have to go up here to dev mode turn on dev mode
and then I’m gonna X out of this I’m gonna blank template right now just keep things nice and simple and then what we’re gonna do is first and foremost when building a leaderboard we’re building kind of a small-scale leaderboard again the Wix nation leaderboard is in beta right now so its Minimum Viable Product so that’s kind of what I’m showing you in today’s video but it gets the job done and I think it gets the job done in a well-designed and
well functionality type way so we have to build a database what that database is going to have is it’s going to have you know a name a picture in the case of the which nation leaderboard a YouTube icon with a link back to that particular person’s YouTube channel and then the current points so the way this leaderboard is gonna work and the way the which nation leaderboard is currently set up is its manual so I know that sounds like a pain so
there’s no actual automation behind it especially since its Minimum Viable Product we’re going for the most simple but yet working product possible so everything is manual so when you guys go through you put your comments on this video here and you guys are ranking up in it I have to or I have an assistant actually go in and manually enter the points each time you comment and each time there’s a top command a helpful comment that’s how it’s gonna
have to work for this particular leaderboard when you start you can add more automation a whole bunch more automation as much as you really want and you have the ability to do that in Wix but for the purpose of this I’m gonna show you the base of it and how to begin it and it starts with the database so what we’re gonna do is we’re gonna go to our data button down here if you haven’t noticed nice little nifty data button we’re gonna create a new
collection I’m gonna start creating and I’m going to start from scratch I’m not using preset I’m gonna name this database leaderboard and then it is going to have some custom permissions we’re gonna set up the custom permissions who can read content from this collection in the case of the Wix nation leaderboard which is basically what I’m gonna walk you through how I built it’s anyone so anyone from YouTube anyone on the public can come see this
leaderboard who can create content admin who can update content admin and who can delete content admin so I’m the one actually assigning the points updating the points deleting the points that’s all on my side as the admin and I’m gonna set and create the collection it’s gonna do it’s magic and it’s gonna populate a new blank database here we’re not going to use this title field but what we are going to use is full name and that’s going to be a
textfield because I’m going to pull the YouTube username from the person that comments and I’m going to do it in a text field I’m not gonna do anything special for that or use your name anything like that I’m just gonna put full name for the case of the field I’m gonna press add I’m then going to include a profile picture this will be pulled from YouTube whatever you have on your profile picture for YouTube is what’s going here so if you want to
be on the leader board and which nation and you’re gonna comment know that I’m pulling this information from your YouTube channel and I’m going to choose an image then I’m going to do you YouTube URL this is going to be a URL this is gonna be obviously whatever the link is to your channel and I’m going to include that there and then I’m going to do total points and this will be a number field and this will be a number of points that you will be
assigned and the way the scale currently works if you comment you get 10 points if your first top first comment you’ll get 25 points if you’re a helpful comment and you’re one of the communities helpful comments and that will go off of community engagement if people like it reply engage with it you will get 30 points and that’s how it’s gonna work for every single video so the more you comment the more you engage the more points you’re gonna rack
up and eventually we’re gonna make this a really really cool thing but we’re starting with simply YouTube comments one because everything’s manual right now and it’s easy to track and two because it’s a good way to test it out and see how it works and if the response is well from you then we will continue building upon that adding you know like little contest prizes stuff like that so it’s gonna be a real fun thing so we’ll do number and that’s
gonna be total points just like that our database for this is built out there’s nothing more nothing less that we need right now at the and add it to the database I’ll show you why because now that we have our database here what we’re gonna go do is I’m gonna go add a page no this is not going to be dynamic to begin I’ll show you why I’m just gonna name it leaderboard I’ll make it dynamic with a data set now on this leaderboard page first and
foremost maybe I’m just weird about this I don’t always like headers and footers so I’m gonna get rid of the header and footer and then I’m gonna go to add now we have to add a repeater because we are going to be displaying data from the database collectively lots of data so it’s not going to be just one item it’s not gonna be an item type dynamic page is gonna be a category with several pieces of data entry so what I’m gonna do is I’m gonna go
to lists and grids which is where the data lives are the repeaters live excuse me and the way I’d set it up for the Wix nation leaderboard is I’m doing a top three and I’m gonna show you the exact same way so I’m doing a top three and I’m gonna edit the design and all that in just a second and then under that will be the actual kind of running leaderboard for everyone not on the top three and I’ll drag that about yay high and then what I’m gonna
do is I’m gonna come through here and drag it out okay so now what you’re about to see is you’re about to see me do a little bit of design I might speed this part up in the video but I’m literally just gonna be designing this to add the profile picture the full name etc so let’s see if I can do this quick I guess it doesn’t start with that gonna okay so I’m basically getting rid of stuff I do not need and you’ll see how and why and how to talk
words now for the chemistry I’m gonna change the design is it again gonna be like a profile picture for that person I’m going to get circular design I don’t want to look like I’m gonna double click it and then prop it into a circle I’m going to apply that and if you can see it will uniformly apply across contributor you know straight this I need a little bit maybe about yay high I’m gonna drag it to Center and then going to come over here with
the text and this will be the full name so I’m going to make sure it stands out one’s a person with the name have you ever stand out so they can be recognized of course I’m going to just put my name and placeholder right now Center it I’m going to increase assignment not quite that big huh clear perfect then what I’m gonna do is I’m going to change the test here to say come on and then I’m going to change text to say currently also going to
censor this and I’m gonna drag this to the pill as well I’m gonna bring it up a little bit we don’t need some that your space I’m gonna take the number here I’m going to officially change the color to this nice blue color that I don’t really have it I’m not in my regular website so I’m gonna go ahead and go with this color right here go check it out I’m gonna bring it up a little bit then I’m going to bring the peter up Lobeck in the dumpee go
that far down I’m going to add a walking through exactly exactly I go to taste meat order add a line right here we’re gonna do is go to my other websites with all the pictures were little and we’re just gonna do is this is gonna be the little icon button heading click on your link links and right down to your Gucci and now down here don’t you director over here good get you this too I’m gonna size that one a little bit not that much just make a
point right here voice over and then we also need to bring you to come back alright guys so we’re done with the little speed design right there I got the design properly set up – this dollar sign right here that won’t be there okay so – the dollar sign I got the design set up and well one last little thing I want the design of the repeater to show same as above this is gonna be for this is gonna be 10 and this is gonna also be 10 and then the
border not a perfect okay so now oh and we want the background to be white all right now we’ve got a uniform design as above so the design aspect here has been completed let’s continue on with the functionality so we did a little speed up of the design now what we have to do is we’ve got our top three up here so this is going to be the top three runners if you will in the leaderboard so what we have to do is we have to add a dataset to pull from
the database to display the top three so what we’re gonna do is we’re gonna go to this data button we’re gonna go to add data elements and we’re going to add a data set once we’ve got our data set in here what we’re gonna do is we’re going to double click on it we have to choose and connect it to a collection and we’re going to connect it to the leaderboard database we’re gonna name this leader board top and then we want this to be read-only and
now this is a key part right here number of items to display three we don’t want it displaying a whole bunch more and then just repeating down the page we only want the top three to be displayed here so we’re going to choose three right there and then we are also going to add a sort to this data set we want to sort total points and we want it to go from high to low so it shows the highest to the left lowest to the right and we’re gonna add a sort
there okay so now we’ve got our data set for the top portion what we have to do now is we have to go in here to our element and we have to connect it to its proper field so we’re gonna choose the data set we want this to connect to leader board top the image source connects to profile picture and I’m going to do link connects to YouTube URL then right here we’ve got full name so we’re gonna connect it to the data text connects to full name then
the YouTube icon we’re not gonna do image source because we’ve already got the image here but we are gonna do link link connects to YouTube URL and that will link it directly to the YouTube URL and then lastly points and we’re going to come up here connected to total points so that’ll have in running total so essentially we now have our top portion of the leader board set up so this will display the top three the first person are like the top
user top leader will have the number one spot on the left and then according to points will go down to the right since we added that sorting feature we now have to do the same thing for the bottom however we need a new data set because we want this data set to display everyone so we don’t want it to stop at three okay so what we have to do is we have to go back to data add data elements add data set and then what we’re gonna do is we’re gonna
come over here we’re gonna double click it we are once again going to connect it to the leaderboard database we’re gonna choose the name of this one to be leaderboard lower so it’s the lower section of the leaderboard under the top three it’s gonna be read-only and number of items to display here I’m just gonna put a thousand just to start okay you can choose how much you want here if you start getting a crazy amount you’re gonna probably have to
add page a nation to your leaderboard I’m not gonna show that in this particular video but that’s where you add like page 1 page 2 page 3 of the leaderboard I also added a search function on my leaderboard I’m not gonna show that in this particular video we’re focusing directly on the functionality a leaderboard here although I will do it video on the search functionality if you’d like to see that as well once again we are going to add a sort we
want to sort total points and we want it from high to low so the top person on this first slide here will have the highest amount of points and it’ll go down according to obviously the sorting in the points and so now we go ahead we add that and just like we did up top we have to connect the elements so this is our profile picture so we have to connect it to leader board lower image source connects to profile picture to link connects to YouTube
URL then we’ve got our full name here and we want this to connect to full name then we’ve got our YouTube icon we’re gonna connect to data and this will connect link to YouTube URL and then lastly we’ve got our points we will connect to data and this will connect you total points okay so now we have officially set up the functionality behind the database and the dynamic page all we have to do now is add some testing data to our sandbox database
to test it out so I’m gonna come up here to data I’m gonna go to our database and I’m gonna come in and add some test data so full name Michael Patrick Stroud profile picture let me go pull one where is this looking man here that they call NPS let’s pull that one right there did at an end perfect add the page YouTube URL I’m gonna I’m just gonna go grab it quick just so we can experiment I can show you that it works correctly all right a video of
mine is probably gonna play here in a second okay I’ll grab my YouTube URL perfect I’m gonna throw that in right there and then let’s just say I have total points right now of 237 I’m now gonna add an additional field I want to test the top three I might even add a fourth I’ll just name this one and yes clone I’ll choose a different profile picture I’ll come in here Wix and the reason I do this guy’s and we why you should also do this is you want
to test to make sure stuff works so just use some test data be funny if you want like here here’s a picture of me standing next to a cone that says MPs while I was in Boston this summer I’ve come up here I’m gonna add the same Utara YouTube URL for this purpose and then I’m purposely gonna add less points I’ll just say I have 207 points here and then I’m gonna name one tech Paddington for those of you that don’t know we’ve got unique nicknames
between my girlfriend my family her family so a unique nickname here I’m just gonna come up here I’m just going to name or just go College because her and I are both in college I’m gonna pull all results if you didn’t know Wix offers some free Wix images I’ll just pull female student with a laptop once again I’m going to add the same YouTube URL and this time I’m gonna add less points than before and then just for a final one I’m just going to
come in here and name it Bob tall and then I’m gonna come in here and look for mail and this will be Bob tall the smiling businessman and then he will have 147 oh that’s two hundred and forty seven point he’ll have 147 points now we have four data points here to test and see so that way we can test our top three and test our bottom repeaters to make sure it’s working below as well so we’re gonna come into here and just so you know the bottom
repeaters will also display the top three from above they’ll just be the top three slots on that bottom one and then the rest will follow so if we come in here now and we press preview let’s see what we get perfect there we go here’s our leaderboard it shows that I’m at the top no surprise there right just kidding that was just kidding I’m Chozen I’m at the top shows MPs clones behind me shows Tac Paddington is behind me and then if we scroll
down we see same thing leaderboard and Bob Hall is at the bottom at the 147 points we can test we can click YouTube and voila it’s going to take me to the YouTube channel that was linked and the rest is looking good if we click the picture it’ll take us the YouTube channel just like we linked and it looks like we’re solid and set and that’s the leaderboard so if you’re part of which nation you just watch this video I think it’s time for you to go
get on the leaderboard which means you need to comment down below and if you weren’t the first comment and you got beat to it I’m sorry but try to be the most helpful comment out there help some other people down in the comment section and at the very least just comment how you enjoyed this video and if you like this new idea of a wicks Nation leaderboard and if you think we can have some fun and creativity drawn with this because I see a lot of
opportunity here and I hope this video helped you out in fact if it did make sure you drop a like down below and hit that subscribe button in the bottom right so you can do more fun things like the wicks nation leaderboard and learn to build a whole bunch more and wicks and turn those Bell notifications on alongside the subscription and you’ll instantly plug into 30 thousand plus entrepreneurs just like me you and the person in California because
wicks just released the top five cities emerging in wicks in the United States and it’s like la Chicago New York Houston and Camp Miami those are the top five so if you’re in one of those places cool you’re emerging in which but go ahead and join a whole bunch of people just like us and let’s have a fun community interaction here I’m excited for it and head over to Wix my website calm no strings attached click join the Academy and get instant
access to a whole bunch of training content alright guys that’s it for today I hope you go out and build your leaderboard and you enjoy it do remember the way this is built right now it requires manual entry on your part as an admin but that’s okay it might be a little bit of admin entry at first you can hire an assistant or even find people on up work and fiber to help you out as well and that’s what we’ve got rolling for today’s content catch
you back on the next one the next time you see a video from me I’ll be back home in Arizona and I will be complete with finals bada bing bada boom