WordPress主题添加字体大小切换按钮

鱼见海资源网最新教程：

经常会看到一些网页在显着位置有一个“大、中、小”的字号选择切换按钮，这是个很人性化的设计，方便不同人群的阅读习惯。下面以默认主题Twenty Eleven为例，把该功能集成到Wordpress主题中。

一、打开Twenty Eleven主题文章页面模板single.php，把下面javascript代码：

   
    function doZoom(size) {   
        var zoom = document.all ? document.all['primary'] : document.getElementById('primary');   
        zoom.style.fontSize = size + 'px';   
    }   

加到第12行：

  



上面。



注：primary为正文内容所在的id选择器标签名称，可根据不同主题进行修改，前提正文内容所在选择器必须是







形式，采用







控制将失效。



二、把下面代码：




	小 
	中
	大
  
加到：

<?php next_post_link( '%link', __( 'Next →', 'twentyeleven' ) ); ?>
  
下面，视不同主题可以放在自己认为合适的位置。其中：数字为不同的字号大小，可自行修改。


标签 : 

         wordpress主题制作 , 字体 , 字体大小      


本文版权归原作者所有，转载请注明原文来源出处，

        WordPress教程网        感谢您的支持！
本文链接： http://www.wpcn.net/2198.html 


      上一篇: WordPress主题制作导航菜单的几种方法      

      下一篇: WordPress解决文章id不连续的办法    
  



推荐内容

WordPress插件开发视频教程
WordPress网站熊掌号API自动提…
WordPress分类列表函数:wp_list…
WordPress函数 get_header()
wordpress后台分类列表显示分类…
WordPress新手必看的SEO优化技…
WordPress 5.0后版本退回旧版编…
WordPress禁用古腾堡编辑器，如…
WordPress网站制作热门文章排行…
WordPress调用随机文章的五种方…






热点阅读

给WordPress分类目录和页面添加… 
WordPress企业主题制作(定制)应… 
WordPress页面链接添加.html后缀 
最强大的 WordPress 搜索插件：… 
WordPress移除后台管理界面右上… 
自定义和扩展WordPress搜索功能 
自定义WordPress后台登录页面样… 
正确使用 template_redirect 和… 
在WordPress自定义字段功能为文… 
在WordPress文章添加下载按钮 






最近更新

WordPress解决文章id不连续的办… 
WordPress主题添加字体大小切换… 
WordPress主题制作导航菜单的几… 
WordPress主题制作导航菜单的方… 
WordPress 插件开发教程：Part4… 
WordPress调用随机文章的五种方… 
WordPress数据库：wp_usermeta… 
WordPress 如何在后台文章列表… 
浅谈搜索引擎不收录的几种违规… 
WordPress 6.3.1发布 维护更新 




相关内容

WordPress宣布“百年计划”新服务 
中国网民超过10亿，互联网红利还在吗？做网… 
WordPress 6.3发布，提升用户体验和网站性能 
WordPress 诞生 20 周年，市占率已达 43% 
WordPress官方发布了 2022 年度用户调查报告 
WordPress 6.2发布，功能增强及错误修复 
WordPress中断将多肉植物的图像淹没在高级博… 
发现WordPress在线聊天的关键缺陷 
WordPress.com网站开始推广订阅服务：或对整… 
后门程序利用盗版插件传播，感染力强成WordP… 
WordPress 6.1 “Misha” 正式发布 
WordPress Log HTTP Requests 插件存在XSS漏… 
WordPress Bricks 主题存在代码注入漏洞 
WordPress博客平台融资3亿美元 
WordPress网站安全漏洞 98%由外挂引发 
WordPress 6.0.3 发布 涉及多个安全修复 
如何保证你的WordPress网站的安全 
WordPress 5.3 发布，改进的块编辑器和新的… 
WordPress 5.2.4 正式版发布 









关于本站
本站声明
联系站长


版权所有：

    WordPress教程网

    网站地图 
	
网站备案/许可证号： 黔ICP备14002784号-10
站内所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
免责声明：本站所有内容来源于互联网。如果本站部分内容侵犯您的权益，请您告知(QQ:410242577)，站长会立即处理。

var _hmt = _hmt || [];

(function() {

  var hm = document.createElement("script");

  hm.src = "https://hm.baidu.com/hm.js?7da702cd9a82d0f2db175f9d4df6869f";

  var s = document.getElementsByTagName("script")[0];

  s.parentNode.insertBefore(hm, s);

})();

/*  */




文章来源于互联网