Building a CMS Quiz in Webflow Using WeBlocks

In this tutorial, we'll build an interactive CMS quiz using WeBlocks that tracks your progress and displays a success message when all questions are answered.
To follow along with this tutorial, clone this project
webflow.grsm.io/tricks?path=Q...
Get the final and fully functioning project at webflow.com/website/Interacti...
Check out WeBlocks at www.weblocks.com/
Join my Webflow Wizards Community
/ timothyricks
Try Webflow using my affiliate link below.
webflow.grsm.io/4840096

[@usabilitytester8714]

Please make a beginner's Webflow playlist which covers everything a beginner needs to know to start offering development services on freelance platforms. This playlist will be highly awaited. Thanks!

[@weblocks]

Timothy, you are a WeBlocks PRO!! Thank you for doing such a great video!! As always you are taking no-code to the next level!!

[@timothyricks]

YAY!! Thank you for building such an awesome tool and tutorials!

[@rashidnawaz5634]

Detailed tutorials and better understanding of code like always. A person like me learn many things from your tutorials without extensive knowledge of code. Thank you so much..

[@coreymoen]

So stellar, and beautifully designed!! 👏 I have watched a few of the WeBlocks tutorials and wasn’t super intrigued with the block oriented approach, but now you have me considering a second look!

[@timothyricks]

Thank you, Corey! Yeah, it takes some getting used to but is also kind of fun to use. 😄

[@virgilhorghidan7496]

Amazing stuff. WeBlocks is the bomb. I don't know JS/Jquery (though I understand the logic behind it) but with WeBlocks it looks much more approachable.

[@rickbossenbroek]

nice one again Timothy!

[@mohamedalighediri5224]

THANK YOU SO MUCH MAN !! WHAT A GREAT VIDEO

[@t_o_ny]

DUDDEEE!!!! You crushed this

[@Taskade]

Beautiful tutorial!

[@graphyteco]

so awesome!

[@niallmcdermott9206]

Great work as always

[@timothyricks]

Thanks so much!

[@HarshitAgrawalOfficial]

Weblocks is on fire🔥 thanks for the amazing tutorial Timothy

[@timothyricks]

So true! Thanks Harshit!

[@stackingflow]

Harshit you are good too with fsweet

[@HarshitAgrawalOfficial]

@@stackingflow ❤️

[@BluezKlue]

I thought this was gonna be more a basic learning tutorial. With no prior knowledge to this where is the best place to learn.

[@connorfinlayson]

Epic!

[@eltongreenfield]

It's like whenever I have something I want to be programmable in Webflow you read my mind and upload a video😭

[@timothyricks]

Hahaha, funny how that works! 😂

[@chakhmanmohamed9436]

Amazing tutorial. Please could you nake tutorials using 2D 3D perspective, and do some tricks with it.

[@markusb3218]

Nice coding Timothy... Weblocks certainly looks like a lot of fun. I have a question. Is it possible for the progress bar to show the correct answers only? I tried to change the code but I am not really making any progress.

[@truescotsman83]

Really helpful Timothy, just curious how i could go about having two different hero completed messages - pass and fail. assuming I'd need another IF statement?

[@hilarypeters3943]

Hi Timothy, love tutorials, I am currently trying to build a multi-step form that allows you access a client based on their responses( not a quiz per say). I have searched KZbin but I haven't seen one that clearly explains it, can you please have a tutorial on it with this same example. Thanks

[@sarplaninacdogs7292]

Timothy, that is so cool! Do you like Weblocks better than you own builder? The logic is pretty cool behind it all. Thanks for making your builder, and thanks for introducing me to Weblocks! 🤘 BTW, do you prefer Timothy or Tim? 😅

[@timothyricks]

Awesome! I’m so glad you like them! For my personal workflow, I start with the jQuery Builder to get a rough idea down and then usually quickly move over to a code editor and write a lot from scratch for complete flexibility. WeBlocks can definitely do a lot more than jQuery Builder, while jQuery Builder might be a little more beginner friendly for people who don’t know where each block goes yet. I personally view both as stepping stones and great learning tools towards starting to code from scratch. Which often leads to cleaner code, faster building, and less limitations. I really hope these are helpful! 😄 Also, Timothy or Tim are both fine. It seems like most people call me Tim though 😂

[@sarplaninacdogs7292]

@@timothyricks Totally, Tim! You got it :D Thanks for your reply, man!

[@growthbranding]

Hello Timothy! That was wooow! I would love to replicate but I have a problem, the project i´ve to do it has more than 100 quizz, each quizz with around 25 question. Any idea to migrate bulk? Thank you very much!

[@thebrain87]

WHAT?! That's witchcraft! :D Super nice video hehe

[@timothyricks]

Hahaha, thank you!

[@joe6776]

Hi T! In the live product it is a sound effect when you hover the different answers. Can you make a guide on how to implement this?

[@cnizar1]

How would you create reporting for the quiz? I would like to record score and choices. Can I send this to a spreadsheet somewhere?

[@itsharrysteer]

The biggest complaint I get about webflow is that it can’t be customised with code - your tutorials help me prove clients otherwise! Thank you!

[@timothyricks]

So glad to hear that! It’s awesome how many possibilities WebFlow + custom code opens up

[@josmito]

there's a mistake on the trial you never explain where is the combo class of "correct"

[@ElizaVanessa]

I am trying to add a score at the end of the quiz. But i don't know how. ANYONE has an idea? :$

[@matteas1008]

I'm having the same issue!!!