上篇《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 {: ;}
- #post_content {: ;}
- #post_content {: ;}
其中:post_content 为主题正文部分的DIV选择器,可视不同主题作适当修改。
步骤二,打开主题header模版,在:
- <link rel= href= type= media= />
下面添加:
- <link title=css1 rel= href= />
- <link title=css2 rel= href= />
- <link title=css3 rel= href= />
在</head>标签上面添加:
- <script type= src= ></script>
- <script type= src= ></script>
步骤三,打开主题single模版,在:
- <div =><?php the_time(\’Y-m-d\’); ?></div>
下面添加:
- <div span=>
- <a = style= title= rel=css1>小</a>
- <a = style= title= rel=css2>中</a>
- <a = style= title= rel=css3>大</a>
- </div>
折腾完成。
浏览者只要不清空浏览器cookie,刷新后或者再次浏览你的站点,将会继续显示之前选择的字号。
上面的方法只用于改变字号,有点大材小用,可以通过定义不同的样式让浏览者选择整体布局和风格,就看你的想像力和创造力了!
暂无评论内容