页面字体大小切换cookie版
上篇《wordpress主题添加字体大小切换按钮》中的方法，当浏览者刷新页面后，不能将设置保存到浏览器cookie中，需再次选择字体大小，不够人性化，有童鞋提出能不能选择一次，刷新后不用再次选择，下面就以 Prower V4主题 为例，将浏览者选择的字号大小信息保存到浏览器cookie的方法，添加到wordpress主题中。
步骤一，在 Prower V4主题主题目录中新建一个名称为：js 的文件夹，将下载的jquery.min.js和styleswitch.js放进去。
所需JS文件下载：jquery.min和styleswitch
再新建一个名称为：css 的文件夹，并在其中新建名称为：c1.css、c2.css、c3.css三个样式文件。
打开三个样式文件分别在其中输入：
- 在第一个中输入：#post_content {font-size: 14px;}
- 在第二个中输入：#post_content {font-size: 16px;}
- 在第三个中输入：#post_content {font-size: 18px;}
其中：post_content 为主题正文部分的DIV选择器，可视不同主题作适当修改。
步骤二，打开主题header模版，在：
- <link rel=“stylesheet” href=“<?php bloginfo(‘stylesheet_url’); ?>” type=“text/css” media=“screen” />
下面添加：
- <link title=css1 rel=“stylesheet” href=“<?php bloginfo(‘template_url’); ?>/css/c1.css” />
- <link title=css2 rel=“stylesheet” href=“<?php bloginfo(‘template_url’); ?>/css/c2.css” />
- <link title=css3 rel=“stylesheet” href=“<?php bloginfo(‘template_url’); ?>/css/c3.css” />
在</head>标签上面添加：
- <script type=“text/javascript” src=“<?php bloginfo(‘stylesheet_directory’); ?>/js/jquery.min.js” ></script>
- <script type=“text/javascript” src=“<?php bloginfo(‘stylesheet_directory’); ?>/js/styleswitch.js” ></script>
步骤三，打开主题single模版，在：
- <div class=“meta”><?php the_time(‘Y-m-d’); ?></div>
下面添加：
- <div span=“fontsize”>
- <a class=“styleswitch” style=“cursor: pointer” title=“小” rel=css1>小</a>
- <a class=“styleswitch” style=“cursor: pointer” title=“中” rel=css2>中</a>
- <a class=“styleswitch” style=“cursor: pointer” title=“大” rel=css3>大</a>
- </div>
折腾完成。
浏览者只要不清空浏览器cookie，刷新后或者再次浏览你的站点，将会继续显示之前选择的字号。
上面的方法只用于改变字号，有点大材小用，可以通过定义不同的样式让浏览者选择整体布局和风格，就看你的想像力和创造力了！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
相关文章
写给所有做网站的朋友的一封信
现在就开始执行“1+N”互联网推广和没有开始执行的人，一两天看不出任何区别； 一两个月看来差异也是微乎其微的；但在2-5年的长远时间来看的时候，你的高质量询盘不断增加，你的互联网资产已经建立完成，对手已经很难匹敌，现在你看到这段文字的时候就是最好的开始，现在就是最好的时候，马上开始“1+N”体系的整体互联网推广吧，我们和你一起，开创互联网大未来！
18324743309
点击咨询
