WordPress网站除以图片来丰富整个呈现视觉化,常常也会利用如Font Awesome、Elusive Icons、Genericons等各种图示组(icon sets),但得额外云端载入图示档案,甚至得利用外挂以方便使用图示,加上许多外挂也常会载入自己的图示组,也就常常会成为拖慢网站速度的主要来源之一,若能善用内建Dashicons图示组,就有助于改善网站整体速度。
Dashicons的基本介绍📂
Dashicons为Wordpress核心内建的图示组,进入后台管理介面时,就会看到功能列的各项图示,但是在前台浏览时,若是未登入状态的一般使用者,Dashicons通常不会自动载入,图示也就无法显示,此时可利用程式码片段(Code Snippet)载入Dashicons,让网站视觉更加丰富。
以下介绍在前台启用Dashicons的作法,一旦启用前台浏览载入时,在撰写网页时,就可直接利用Dashicons来丰富网站视觉,使用方法可参考Dashicons官方网站。
延伸阅读▶️Dashicons官方网站
Dashicons的载入作法
方法一:修改布景主题
修改布景主题的functions.php档案,在
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );
function load_dashicons_front_end() {
wp_enqueue_style( 'dashicons' );
}
方法二:程式码管理外挂
使用程式码片段(Code Snippet)管理外挂程式,例如:Code Snippets、WP代码框等外挂程式,选择加入PHP类型的程式码片段,通常程式码片段管理外挂会自动加入
<?php
add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );
function load_dashicons_front_end() {
wp_enqueue_style( 'dashicons' );
}
除使用程式码片段外,当然也可用Menu Icons by ThemeIsle等外挂可协助载入与管理图示组,但就是得再安装一个外挂,也容易造成网站速度拖慢或浏览时小问题,就曾经在使用Menu Icons外挂载入时,造成文章类别页面的缩图显示出现问题。