Writing effect | Rife Theme Documentation

Available as Elementor widget!

If you are using Elementor page builder, you can now use Writing effect in a more convenient way, like other widgets in Elementor. Install Rife Elementor Extension plugin to add writing effect easily.

What is it for

Writing effect shortcode will make your text appear like it is just typed on a keyboard. This fun way to make user focus on your introduction. Text can be looped or just printed out once.

You can check example use here.

Shortcode and its parameters

First, let’s see some examples:

[a13fe-writing-effect color="#ffffff" bg_color="#000000" loop="0"]My name is James|James Bond|Aston Martin?[/a13fe-writing-effect]
[a13fe-writing-effect]My name is James|James Bond|Aston Martin?[/a13fe-writing-effect]
[a13fe-writing-effect loop="0"]Text 1|Text 2|Last Text that stays visible[/a13fe-writing-effect]

So shortcode is named a13fe-writing-effect. Texts that should be typed are divided by pipe char | .

Shortcode has following parameters that you can use:

loop – (default 1) should text be looped forever. 1 for yes, 0 for no.
color – (no default value) color of typed text in correct CSS value.
bg_color – (no default value) background color of typed text in correct CSS value.

Also, an interesting effect is to use it with static text, where last words changes. Try this Example:

I am [a13fe-writing-effect]perfect|creative|Designer![/a13fe-writing-effect]

Using it with page builder plugins

When a shortcode is entered in page builder with live preview, like Elementor, you will not see the result right away. However, after save, and visiting your page you should see effect fine.

This is caused by “partly refreshing” in those tools, however, we are working on better integrations.

Displaying effect on Mobiles

It is good to disable this effect on mobiles to save CPU of your user device. Also if your text loop forever your user can experience “jumping screen” effect on smaller screens, cause text is entered and deleted.

You have to decide depending on how you use it. You can switch mobile view on & off in Appearance → Customize → Miscellaneous Settings → Writing effect.