The method of adding navigation column icons to Tuoyuan Pure Theme

informal essay two thousand and twelve 2 years ago (2021-11-11)

Yituoyuan Pure theme For example, add Icon , refer to the following methods:

1. Visit the AliIconfont icon library website, find and select the icons to be used, and add them to the project in batch.

 Method of adding navigation column icons to Tuoyuan Pure Theme (1)

2. Click "Resource Management" - "My Project" to find the "Navigation Bar Icon" project just created. If the color icon is used, you need to click "Project Settings" typeface Check "Color" in the format, and generate Font class online code after saving (prompt: every time you adjust the icon or setting in the project, you need to regenerate Font class code).

 Method of adding navigation column icons to Tuoyuan Pure Theme (2)

3. Fill in the class name (such as icon shouye) corresponding to each icon in the above figure to zblog In the corresponding text box under "Module Management - Navigation Bar - Icon" on the left side of the background, add an iconfont class name separated by a space. As shown in the figure below:


 Method of adding navigation column icons to Tuoyuan Pure Theme (3)

4. Go to Tuoyuan Pure Theme (theme setting - SEO Settings - Custom Code Block - Header Common Code), fill in the online code generated by the icon project. The format is shown as follows:

 Method of adding navigation column icons to Tuoyuan Pure Theme (4)

After saving, return to the homepage of the website, and you can see the final effect of adding icons as follows:

 Method of adding navigation column icons to Tuoyuan Pure Theme (5)