泛宝汇博客使用懿古今的Nana 主题有一段时间了,最近留意到它的 404 页面只是简单的“亲,该网页可能搬家了!”,略显单调。于是根据自己的思路折腾一翻,在 404 页面中增加一个 flash 小游戏,这次折腾相对顺利,在此也感谢友站分钱榜提供的初始引用代码,下面说说具体折腾方法:
首先找度娘要一个 flash 小游戏(泛宝汇博客选择的是“黄金矿工.swf”),然后将 flash 小游戏上传到主题的 images 文件夹。特别提醒:flash 小游戏的格式必须为 swf 后缀。
然后从主题 Nana 文件夹中找到并打开 404.php,在
- <p style=“text-align:center;”>亲,该网页可能搬家了!</p>
代码下方加入如下代码:
- <br />
- <div class=“linkstandard” style=“text-align: center;”>
- <p style=“text-align:center;”>玩个小游戏放松一下</p>
- <embed src=“<?php bloginfo(‘home’); ?>/wp-content/themes/Nana/images/hjkg.swf” type=“application/x-shockwave-flash” width=“540” height=“360”></embed><!–小游戏引用代码–>
- </div>
- <br />
特别提醒:如果 flash 小游戏是放在其它文件夹,要记得修改“小游戏引用代码”中的路径。
保存后,将 404 文件上传覆盖,打开一个不存在的页面就可以看到效果了(效果演示:http://www.fanbaohui.com/thisis404/)。
到这里本可以结束,但手机打开后发现页面错位,而且在手机上玩这个游戏也不好操作,于是通过修改 CSS 代码,让小游戏在手机端不显示,方法如下:
从主题 Nana 文件夹中找到并打开 style.css,找到代码:
- .cat-dt .line-one-thumbnail,.dengji,.entry-meta .edit-link,.item-st .thimg,.p-content,.plxiaoshi,.slider-caption{display:none}
替换为(其实就是在上述代码中加入了.linkstandard):
- .cat-dt .line-one-thumbnail,.dengji,.entry-meta .edit-link,.item-st .thimg,.p-content,.plxiaoshi,.linkstandard,.slider-caption{display:none}
至此,Nana 主题的 404 页面优化即已完成。其它主题也可以通过此思路进行折腾,想在手机端也显示小游戏并让它不错位的话,那可以折腾 CSS,让小游戏尺寸自适应即可。
来源:泛宝汇博客