WordPress添加字体切换大小按钮
给自己的网站WordPress添加字体切换大小按钮吧,这样方便读者阅读文章,一般网页字体大小都在12-16PX之间,中文最新的就是12PX了,当然还可以再小,不过就几乎看不见了,
这里分享一个代码的方法,给WordPress的文章页面添加一个字体控制按钮,这里也附上美化样式,实现方法如下:
WordPress添加字体切换大小按钮
将此JS代码添加到single.php中:
<script type="text/javascript"> function doZoom(size) { var zoom = document.all ? document.all['entry'] : document.getElementById('entry'); zoom.style.fontSize = size + 'px'; } </script>
这里需要注意的就是,上面代码的entry指的是正文内容的div id,必须根据主题的实际情况进行修改即可。
前端调用html(在文章适当页面加入即可一般都是single.php):
<div id="fschange"> <span id="font_title">字号:</span> <span id="fs_dec"><a href="javascript:doZoom(12)" title="缩小">-</a></span> <span id="fs_n"><a href="javascript:doZoom(14)" title="恢复">o</a></span> <span id="fs_inc"><a href="javascript:doZoom(16)" title="增大">+</a></span> </div>
然后是美化的css代码,加入主题文件中即可:
/* 字体大小 */ #fschange {float:right; margin:0; padding:0;} #fschange #font_title{margin-top:2px;} #fschange span {display:inline; float:left; margin-left:4px;} #fschange span a {border-bottom:#c8c8c8 1px solid; text-align:center; border-left:#c8c8c8 1px solid; width:16px; display:block; height:18px; border-top:#c8c8c8 2px solid; border-right:#c8c8c8 1px solid;} #fschange span a:hover {background:#ebebeb; text-decoration:none;}
完成以上操作,马上看看是否已经成功的为自己的WordPress添加了字体大小的按钮了呢?点击可以随时切换。
1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长!
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 如遇到加密压缩包,默认解压密码为"www.vfaner.com",如遇到无法解压的请联系管理员!
微范儿 » WordPress添加字体切换大小按钮
2. 分享目的仅供大家学习和交流,您必须在下载后24小时内删除!
3. 不得使用于非法商业用途,不得违反国家法律。否则后果自负!
4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解!
5. 如有链接无法下载、失效或广告,请联系管理员处理!
6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需!
7. 如遇到加密压缩包,默认解压密码为"www.vfaner.com",如遇到无法解压的请联系管理员!
微范儿 » WordPress添加字体切换大小按钮
常见问题FAQ
- 免费下载或者VIP会员专享资源能否直接商用?
- 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。
- 下载不了或者解压包需要密码?
- 蓝奏云下载不了一般改一下后缀就可以下载了,比如t改成i或者x等,很早之前的资源可能有几个需要解压密码,默认就是本站域名www.vfaner.com
- 资源经过测试有bug或者不能使用?
- 资源都是各大平台和收费平台搜集的,遇到不能使用添加QQ7940758进行反馈及时删除该资源