Typewrite Header

You can set a typewriter header that appears on your home page. Follow the steps below.

Set the homeHeaderType param to typewriter in the params.toml file.

1
2
3
...
homeHeaderType = "typewriter" # text, img, slide, typewriter
...

Add some Front-Matters in your content root _index.md file.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
---
header:
  - type: typewriter
    methods:
      - typeString: Hello world!
      - pauseFor: 2500
      - deleteAll: true
      - typeString: Strings can be removed
      - pauseFor: 2500
      - deleteChars: 7
      - typeString: <strong>altered!</strong>
      - pauseFor: 2500
    options:
      loop: true
      autoStart: false
    height: 190
    paddingX: 50
    align: center
    fontSize: 44
    fontColor: yellow
...
---

In the above, you can see the methods, options Front-Matter. Refer the typewriterjs site. Change it to your taste