WordPress添加自定义小工具

2019年2月23日01:08:25 评论 203

最近给博客添加了一个显示作者信息的小工具,网上也有很多关于边栏显示作者信息的实现方式,但是大多都需要我们再修改代码中的一些信息,很是麻烦,于是自己借鉴了很多网上的代码并优化成了目前我所使用的这款显示作者信息小工具。

WordPress添加自定义小工具

对于社交信息的获取,由于并不是所有主题都会有微博、QQ、微信等信息的获取,这里我只获取了用户信息中的博客地址及作者博文的内容,当然你也可以通过增加这些字段来实现更多社交媒体的选项。具体增加方式以增加微博社交信息为例,在function.php文件中添加如下代码:

下面是小工具前端显示的截图,希望你喜欢。

WordPress添加自定义小工具

好了,现在我们来看下作者信息小工具的具体实现。

新增 widget-authorinfo.php 文件

新建一个 widget-authorinfo.php 的文件,并在其中添加如下代码:

这是这次主题修改的核心文件,其中的一些代码大家可根据自己需要进行删改,比如你想增加更多社交信息可修改102-109这段代码实现。

修改 widget-index.php 文件

DUX主题对其所有小工具的调用都是通过 widget-index.php 文件来实现的,添加完上述代码后我们需要在该文件中找到如下代码并添加上 ‘authorinfo’, 这一字段。该数组中的每一个字段对应DUX主题 widgets 文件夹下的一个小工具,大家可对应了解。

值得注意的是,’tags’ 这个字段后面没有结束“,”符号,所以如果大家添加到该字段后注意一下。当然,为了避免大家添加中错误,建议添加到原有两个小工具对应字段中间,比如这里你可以添加到 ‘posts’,  与 ‘readers’, 之间。

修改 main.css 文件

添加如下代码至你主题的主样式文件中,DUX主题添加到 main.css 文件中即可。

由于主题的不同及其他原因,样式代码可能会出现错位等现象,可能需要大家根据自己情况微调一下。

其他主题修改

对于其他 WordPress 主题直接使用上述代码可能无法在外观小工具下显示该工具,我们需要将 widget-authorinfo.php 中注册小工具的代码打开,同时我们需要在 function.php 文件中添加如下代码加载这个 PHP 文件。注意修改下代码中的路径!

最后更新:2019-06-03
weinxin
关于本站
本站是一个分享建站经验、SEO优化、互联网技术以及日常生活的个人生活博客。

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: