摘要:图标是给文字的一种补充,许多图标往往可以让我们快速的识别内容。在Wordpress上个导航菜单添加个性图标早已实现,emlog一直没有看到类似内容,折腾一下,发现其实现其实挺简单的。

图标是给文字的一种补充,许多图标往往可以让我们快速的识别内容。在Wordpress上个导航菜单添加个性图标早已实现,emlog一直没有看到类似内容,折腾一下,发现其实现其实挺简单的。再此发布下教程(注:本篇文章仅为作者个人观点,如您有更好的意见方法可在此回复,不到之处忘勿喷。)

1.修改代码

找到模板文件 module.php 打开,并搜索以下代码:

<?php echo $value['naviname']; ?>

找到如下这行:

<a href="<?php echo $value['url']; ?>" <?php echo $newtab;?>><?php echo $value['naviname']; ?></a>

把代码修改为:

<a href="<?php echo $value['url']; ?>" <?php echo $newtab;?>><?php list($a,$b) = split('#',$value['naviname']); if(empty($b)) {echo $a;}else {echo "<i class='".$b."'></i>".$a."";} ?></a>

2.添加图标

接下来便是在导航添加 FontAwesome 图标

打开导航管理,编辑导航名称

找到合适的FontAwesome图标,把相应的代码添加到导航名称后面,并且用 # 相连接

例如我要添加的图标代码为:

<i class="fa fa-home"></i>

那么最终导航的名称为:

首页#fa fa-home

这样就可以实现效果了。