Add a Wordpress quiz leaderboard to your site

Have you created a quiz with Riddle’s quiz maker, and want to show users how their scores compare with other users? You should try our WordPress quiz leaderboard feature – no coding required.

You’ll need our free WordPress quiz maker plug-in to start.

(Are you using a different site builder than WordPress? Try our PHP quiz leaderboard option – super flexible, with some easy modifications of our sample code.)

Video walkthrough

Check out this handy video tutorial – and if you have any questions, please just ask us on support chat. We love to help.

Creating a WordPress quiz leaderboard

Step 1: Create a quiz

Our WordPress quiz leaderboard option currently works only with our ‘quiz’. But coming soon – you’ll be able to display rankings for any of our formats with points:

• Auto-quiz
• Tap and find
• Order it

Step 2: Add a lead generation form

You’ll need to add a lead generation form for each quiz taker to register and to have their scores appear on your leaderboard.

Add any fields you like – like ‘first name’, ‘last name’, and a ‘checkbox’ for terms and conditions.

IMPT: Each form must have a field whose field ID is called ‘Email’ (case sensitive)

We also recommend add a field called ‘Nickname’ (case sensitive) – for the displaying each entrant (such as ‘Paris Paul’) vs. their real name.

You can still collect and/or send your leads to your marketing software like MailChimp, Google Sheets, etc.

Step 3: Create a leaderboard in WordPress

• Now let’s go back to your Riddle plug-in on WordPress.
• (New to Riddle? Here’s how to get started with our plug-in.)
• Click on ‘My Riddles’
• Then ‘Create leaderboard’ by your quiz

Step 4: Setting up the quiz leaderboard

1. Add a leaderboard image (optional). 16:9 ratio works best (ex. 960×540 pixels)
2. Customize the ‘score message’ (e.g. ‘Your score:’)
3. Modify the leaderboard title
4. And the leaderboard description

5. Add the field IDs from your lead form – that you want to display as leaderboard columns.
6. Note: You must have a field named ‘Email’ – case sensitive.
7. We recommend add a field called ‘Nickname’ (case sensitive) – for the displaying each entrant (such as ‘Paris Paul’) vs. their real name.
8. We also add ‘index’ – which will put a ranking # by each contestant’s place (e.g. 1, 2, 3 for the top 3 contestants), and ‘percentage’ to show their score.

9. Set your result text – the comparison message users will see (use the %%PERCENTAGE%% variable)
10. Want to avoid embarrassed users? Set the absolute lowest value they will see – ie. even if they got a ranking of 5%, they’d see “You scored better than 20% of all quiz takers!”
11. Customize the overall ranking message
12. Tweak the message people will see if they arrive on the page before anyone has taken the quiz.
13. Motivate your users – show them close they were to the top X places… we recommend this to encourage more engagement through repeat entries.

14. Save your leaderboard – then insert the short code into any page or post.
15. Publish – then copy your page/post’s URL.

Step 5: Activate quiz result landing page

Almost there – now you need to go back to Riddle and activate your quiz result landing page. This will send each quiz taker’s score and details to your leaderboard.

1. Go to our ‘advanced’ tab.
2. Turn on ‘quiz result landing page’.
3. Paste in your URL (e.g. https://www.yoursite.com/quiz-leaderboard)
4. Activate quiz result landing page – and turn on ‘open outside Riddle iFrame’
5. Make sure that ‘Do not send Riddle data via POST method’ is OFF

Last – just press ‘publish’ to push these changes live, and you’re all set!

And of course, if we can help in any way with your WordPress quiz leaderboard, please ask away – on support chat, or at hello@riddle.com.

We’re big customer support geeks – and race each other to answer questions in under two minutes. That’s super fast! 🙂