How to Create a Stunning Typewriter Text Effect With Kadence Blocks

So, if you’re anything like me, you probably got excited when Kadence dropped their big 3.0 update in February. They cleaned up the user interface, streamlined the code, and snuck in some amazing new features. And one of my fav new features? The typewriter effect in the Kadence Text block!

This typewriter text effect is a simple way to add a bit of movement and flair to your content. If you’ve got a creative business, like a photography site or anything else in the creative space, this is the kind of thing that makes people stop scrolling in their tracks and take notice. It’s a fun, stylish way to add a little personality and make your message stand out.

In this post, I’m going to show you just how easy it is to add this trendy typewriter text effect to your site, without using any code.

Let’s make a trendy typewriter text effect.

Step #1 – Add the Kadence Text Block

Add a new Kadence Text (adv) block, or edit an existing one. With your cursor, highlight the word or phrase with your cursor that you want to feature with the typewriter text effect. This highlighted text will be your first string, which is what the Kadence Typewriter effect will animate.

Step #2 – Typed Text Settings

Click the More arrow in the toolbar settings and choose Typed Text. This opens up the Typewriter Effect settings, where you can easily add more strings to your animated text and adjust other typing settings, which we’ll go over in the next steps.

Step #3 – Cursor Settings

The first setting you’ll see is the cursor. Adjust the cursor style in the Kadence Typewriter Effect settings. The default cursor is an underscore, but you can change it to something like the pipe/line symbol for a different look. You can also remove the character completely and leave it blank if you don’t want to use a cursor! Feel free to choose whatever cursor suits your design.

Next, decide whether to enable or disable looping. If you keep looping enabled, your typewriter text effect will continuously run in an infinite loop, adding a dynamic touch to your content.

Step #4 – Adding Strings

Open the Additional Strings tab. Under String 1, type in a string of text, and then click the Add String button to add another string. Repeat these steps to continue adding more strings of text.

You’ll also find additional settings here at the top, such as the option to enable shuffle, which will randomize your strings.

Step #5 – Speed Settings

Open the Speed Settings tab. Here, you can adjust the speed settings to your liking!

Here’s what my typed text looks when it’s all finished:

And that’s it– I told you it was simple! Once you’re finished, you can click off somewhere else on your screen. If you need to go back and make adjustments, simply click on one of the strings in your heading to open the settings back up.