新闻中心

WordPress代码实现字体字号调整功能

作者 / 无忧主机 时间 2014-09-04 14:56:11

无忧主机小编很喜欢看小说。在打开腾讯小说的时候,小编发现在很多大型小说站以及新闻站对客户都开放一个字号调整按钮功能,主要让客户调整自己合适字体方便观看。这无疑是增加了用户体验度~下面无忧小编就简单的介绍下如何在wordpress中不用插件实现代码实现字体字号调整功能,在修改代码的时候一定要看清楚,但是无忧主机小编为了让大家可以简单的理解会说的很详细的,只要按照下面教程一步步操作也可以实现就没问题。   [caption id="attachment_16335" align="alignnone" width="300"]wordpress字号调整功能效果图 wordpress字号调整功能效果图[/caption] 首先找到single.php,这个是用来控制wordpress网站每篇文章的显示的哦,然后在文件中适当的位置添加按钮代码,把如下的代码添加到single.php里面去。 <div><a href="javascript:doZoom(16)">小</a> <a href="javascript:doZoom(18)">中</a> <a href="javascript:doZoom(24)">大</a></div> 当然拥有上面的代码,无忧小编还是认为不够完美的还需要一些脚本驱动代码实现效果,还是在同一个文件下,找一个适合的位置添加以下js代码:

<script type="text/javascript">
function doZoom(size) {
var zoom = document.all ? document.all['entry'] : document.getElementById('entry');
zoom.style.fontSize = size + 'px';
}
</script>
嗯好的!大功告成了。快点刷新看看效果吧!   无忧主机相关文章推荐阅读: WORDPRESS开源博客系统简介与快速部署教程 从入门到精通:WORDPRESS网站整体迁移教程 WORDPRESS版权保护如何给文章后自动添加版权和本文地址

本文地址:https://www.51php.com/wordpress/16334.html

1
1
1
1
1
1
1