Typewriter-Text Plugin
Get that cool cool, typewriter text effect on your page. Simply add a code block and add this to you code block:
<typewrite-text timing="4000">Hello World!</typewrite-text>
Features
- Use multiple times on your site
- Use with Headlines, Titles, and Paragraphs
- Set individual timing for each typewriter
- Typewriter only starts typing when the text is visible on the page
Installation Instructions
Add the included script to the Code Injection in Squarespace.
Settings -> Advanced -> Code Injection -> Footer
Once you've added the script you can add <typewriter-text></typewriter-text> to any code block.
Control Timing
To control the timing of typewriter you'll need to add a timing attribute.
Timing is in ms, so 1000 = 1s. If you want the typing effect to take place over 1s the code would look like this.
<typewrite-text timing="1000">I'm another typewriter</typewrite-text>
Controlling Styling
If you want to control the styling of typewriter you can place it inside heading tags. So if you wanted to use typewriter for a big heading it would look like this:
<h1><typewriter-text timing="2000">I'm a Big Title</typewriter-text></h1>
Show Blinking Cursor
If you want to show the blinking cursor you just need to add a cursor attribute to the element
<typewrite-text timing="2000" cursor>I have a blinking cursor</typewrite-text>