You can use team style templates to save your entire quiz look and feel – from fonts to colors, logos and social sharing.
Style templates are a powerful way to save time for your teams of creators – automatically applying your brand’s look and feel to ensure your quizzes seamlessly match your site’s look and feel.
All changes you make under the ‘Customize’ section can be saved – from fonts to colors, logos and social sharing.
Creating your team style templates
Okay – let’s jump right in. You’ll need to be a team owner or team admin to create or modify your templates.
Here’s how to do it:
- Create a team.
- Under ‘My Riddles’ – make sure that team is selected.
- Start making any type of Riddle.
- In the ‘Customize’ step, select ‘slot 1’ from the ‘Team style template’ dropdown.
- Click ‘rename’ and type the team’s name.
- Style your Riddle – using each of the five tabs in the ‘Customize’ step.
- Click ‘save’ to lock in your changes.
As a team admin, you can create up to 10 style templates per team.
And remember – there’s no limit to how many teams (each with 10 style templates) you can create.
Team roles and style templates
Teams have three different roles:
- Admins: can create templates
- Editors and authors: can both apply templates but not save any additional styling changes
Editors and authors can make changes to the particular riddle they’re working – but they can’t change the template on.
Most of Riddle’s publisher or brand partners (such as CNN or Formula 1) set the style template as a starting point.
They know every quiz might have special requirements, so they are happy with editors and authors adjusting things for any individual quiz.
Team style templates – live examples
We put together this list of 23 of our favorite quizzes from our partners such as the BBC, NFL, and Red Bull – all using our style templates feature.
We especially love this brilliant personality test by Choice Hotels – they changed everything from hover states to borders and buttons.
Each of these quizzes was styled with just a click – their editors wrote the questions, uploaded the images and videos, then applied the team template.
No muss, no fuss – it was all done for them without having to worry about the right hex color code, font, or CSS.
Video: how to create or modify templates
Here’s a video we whipped up showing more info:
Video transcript
(Prefer reading vs. watching videos? Here’s a handy transcript of our help video.)
Hi there, my name is Mike and I’m one of the co-founders here at Riddle, and if you’ve watched a bunch of these videos before, you probably heard you say that. I think I start every video with the same introduction.
But anyways, in this video, I’m going to give you a quick walkthrough on how to use our team style templates. And these are essentially preset combinations of colors, fonts, all the customization options for your quizzes so you can apply them with just a click.
OK, so first off, let’s you’ll need to be in a team environment, so if you happen to see my personal account up here, this will not have our team style templates because you’re not in the team.
Once in my team workspace, I am also going to pop over to the customize step. So I’ve created my quiz, going to customize and now you’ll see there’s a team style template here – this is where the fun stuff happens.
I’m going to select slot six now. We include ten different slots and they can all be renamed for your team. You can also have unlimited numbers of teams. So you might have 10 teams – each with ten different slots.
I’m going back to slot six and now I’m going to make some changes. First, I’m going to rename it. I’m going to call it ‘Mike CSS style template demo’.
I’m going to save that. Now, only team owners or team administrators get the edit options. Anyone on the team can use a team style template, but only admins and owners can actually make modifications.
OK, so I’m going to change the style. And layout, you’ll see as soon as I have made that one change, Riddle thinks “Hey, as an administrator, Mike, do you want to save this?”.
Next I’m going to change the font. And what most of our publishing partners will do is they’ll also use our custom font feature. Maybe they’ll use TypeKit or Google Fonts or they’ll upload a font with a .woff2 file to use it.
The cool thing about this is that their teammates and the team members don’t have to worry about how to use this team custom font. It’s just automatically applied. So in this case, I’m just going to select Arimo and we’ll just go down to branding – where, for example, you probably don’t want to have our Riddle logo on there if you’re any sort of professional brand.
What else? I’m going to change some of the colors. So this font color is probably too light. So I’m going to go down here and pick a dark color. Maybe I’ll change the key color for all the buttons and things like that to this rather lovely shade of orange and so on.
And you can just keep going down.
One other neat trick is that we have a very powerful CSS editor.
And if you are not great at CSS, we also have this handy list of probably about 75 CSS hacks that customize everything from buttons to borders and things like that.
But in this case, I’m just going to demonstrate how you can paste in some CSS – now watch what happens to the actual look and feel of this quiz. So you see here there’s no longer a border around the quiz and the start button is now much bigger.
You can customize almost every aspect of your quiz. So get super, super creative.
And again, with these style templates, I’m going to now save this. Now all of these changes here are part of your team style template and your editors won’t have to worry about ‘How do I use CSS?’.
So that’s basically it. If you ever want to make changes again, you’ll need to just pop in here and save them. In this case, I’ll go to Colores, for example, and maybe I’ll change the key color to a rather lovely blue.
And there you go.
Any questions about team style templates? Please let us know on support chat.
Because Boris myself, our entire team of engineers, we all love to help out, especially with geeky stuff like this.
So any questions? Just let us know. Thanks again and Happy Riddling!