
巧用移动设备判断代码和日历调用代码优化404页面
上次在《以Nana主题为例优化404页面 增加一个flash小游戏》中,在404页面添加的flash游戏只在PC端显示为最佳,但手机仍然是原始配方的原始味道,略显单调,或者折腾CSS以适应或移动手机结束不显示小游戏。
折腾CSS以适应大头,有没有其他方法来优化移动端的404页面?就在两天前,朋友站分钱榜和泛宝汇博客说,添加404到WordPress附带的文章链接日历也不错,并向泛宝汇博客发送了一个调用代码。嘿,这不仅仅是可用的吗?
好!可以开始折腾了。这时,我想起了我在过去几天看到的《利用WordPress移动设备判断函数进行PC端或移动端广告投放》。我可以使用老谷共享的判断代码来实现404页面在PC端显示flash游戏,以及带有文章链接日历的WordPress在手机上。 。
调用WordPress自带的带文章链接日历代码如下:
<?php get_calendar(); ?>
PC或移动设备判断代码如下:
<?php if ( wp_is_mobile() ){ ?>此处可以放置移动端显示的内容<?php } else { ?>此处可以放置PC端显示的内容<?php } ?>
具体折腾方法,首先从主题Nana文件夹中找到并打开404.php,在
- <p style="text-align:center;">亲,该网页可能搬家了!</p>
代码下方加入如下代码:
<?php if ( wp_is_mobile() ){ ?><div style="text-align:center;">点击日期查看其它文章</div><div class="table"><?php get_calendar(); ?></div><?php } else { ?><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><?php } ?><br />
折腾保存好,然后从主题Nana文件夹中找到并打开style.css,在
.single-content{font-size:16px;font-size:1.6rem;line-height:25px}
下方加入:
/*让日历居中对齐 */ .single-content table{margin-left:auto; margin-right:auto}
折腾保存好后,连同刚修改好的404.php文件上传覆盖,分别用电脑和手机打开一个不存在的页面就可以看到不同的效果了。(效果演示地址:http://www.fanbaohui.com/thisis404/)
本文最后更新于2020年1月14日,若涉及的内容可能已经失效,直接留言反馈补链即可,我们会处理,谢谢
常见问题FAQ
- 1.关于新手解压出错 必看(附电脑+安卓WINRAR APP)
- 新手必看 本站资源解压教程:http://www.52cgzys.com/76304/
- 2.本站Telegram群组链接
- 3.所有礼包码下载地址:http://www.52cgzys.com/422289/
- 4.各类问题及解决处理方法合集