Typing Configuration and Social Media Links

Overview

This article is rewritten to match the current config.yml, covering the configuration and notes for the homepage typing animation (typetexts) and social media links (mediaLinks).

Typing Animation Configuration

The homepage typing animation uses a string array and displays items randomly:

1
typetexts:
2
    - "Free for free, not free for charge!"
3
    - "Where's the any key?"
4
    - "Press F12?"
5
    - "Hello World!"

• It is recommended to keep each text short for complete display in the first screen area.
• Supports any number of strings; when empty, the typing animation will not be displayed.

Social Media Links

The theme reads social links from mediaLinks and generates SVGs using simple-icons:

1
mediaLinks:
2
    - icon: github
3
      link: https://github.com/xingwangzhe/stalux
4
    - icon: bilibili
5
      link: https://bilibili.com/
6
    - icon: X
7
      link: https://x.com
8
    - icon: juejin
9
      link: https://juejin.cn/
10
    - icon: zhihu
11
      link: https://www.zhihu.com/
12
    - icon: maildotru
13
      link: mailto:xingwangzhe@outlook.com
14
    - icon: telegram
15
      link: https://t.me/

Field descriptions:

• icon is required; it is recommended to use simple-icons names (e.g., github, telegram, zhihu, x); internally, non-alphanumeric characters are removed and case is matched.
• link is required; social address or mailto/external URL.
• When no matching icon is found, it falls back to displaying the first letter to ensure clickability.

Common Modifications

• Add/remove text: Directly add or remove items from the typetexts array.
• Add new social links: Append { icon, link } to mediaLinks, ensuring the icon can be recognized by simple-icons.
• Replace icons: Change icon to a new simple-icons name; if not built-in, you can customize the icon name and accept the first-letter fallback.

Verification and Preview

• After modifying the configuration, run bun run dev to preview, checking that the homepage typing animation and social icons display correctly.
• If an icon is missing, first confirm whether the name exists in simple-icons, or try using all lowercase/no special characters.