巧用移动设备判断代码和日历调用代码优化404页面

投稿   泛宝汇博客  2016-12-02 11:18:24  242 人阅读  27 条评论

上次在《以Nana主题为例优化404页面 增加一个flash小游戏》中说到在404页面中添加的flash小游戏只有在PC端显示为最优,而手机端还是原来的配方原来的味道,略显单调,要么折腾CSS搞自适应要么手机端不显示小游戏。

折腾CSS搞自适应好头大,那有没有其它方法来优化移动端的404页面呢?正好前两天友站分钱榜泛宝汇博客说,给404加个WordPress自带的带文章链接日历也不错,并给泛宝汇博客发来了调用代码。嘿嘿,这不正好可以利用么?

OK!可以开始折腾了。这时又想起前些日子在懿古今看到的《利用WordPress移动设备判断函数进行PC端或移动端广告投放》,正好可以利用老古分享的判断代码实现404页面在PC端显示flash小游戏,而在手机端显示WordPress自带的带文章链接日历。

巧用移动设备判断代码和日历调用代码优化404页面

调用WordPress自带的带文章链接日历代码如下:

  1. <?php get_calendar(); ?>

PC或移动设备判断代码如下:

  1. <?php if ( wp_is_mobile() ){ ?>
  2. 此处可以放置移动端显示的内容
  3. <?php } else { ?>
  4. 此处可以放置PC端显示的内容
  5. <?php } ?>

具体折腾方法,首先从主题Nana文件夹中找到并打开404.php,在

  1. <p style="text-align:center;">亲,该网页可能搬家了!</p>

代码下方加入如下代码:

  1. <?php if ( wp_is_mobile() ){ ?>
  2. <div style="text-align:center;">点击日期查看其它文章</div>
  3. <div class="table"><?php get_calendar(); ?></div>
  4. <?php } else { ?>
  5. <div class="linkstandard" style="text-align: center;">
  6. <p style="text-align:center;">玩个小游戏放松一下</p>
  7. <embed src="<?php bloginfo('home'); ?>/wp-content/themes/Nana/images/hjkg.swf" type="application/x-shockwave-flash" width="540" height="360"></embed>
  8. </div>
  9. <?php } ?>
  10. <br />

折腾保存好,然后从主题Nana文件夹中找到并打开style.css,在

  1. .single-content{font-size:16px;font-size:1.6rem;line-height:25px}

下方加入:

  1. /*让日历居中对齐 */
  2. .single-content table{margin-left:automargin-right:auto}

折腾保存好后,连同刚修改好的404.php文件上传覆盖,分别用电脑和手机打开一个不存在的页面就可以看到不同的效果了。(效果演示地址:http://www.fanbaohui.com/thisis404/

文章标签: ,   ,  
原文地址:http://www.fanbaohui.com/zzjl012/
温馨提示:文章内容仅代表作者个人观点,不代表boke112导航赞同其观点和对其真实性负责!
版权声明:本文为投稿文章,感谢 泛宝汇博客 的投稿,版权归原作者所有,欢迎分享本文,转载请保留出处!
WordPress/zblogPHP免费响应式博客主题Blogs

 发表评论


  1. 捌零男人
    捌零男人 【镇长】 @回复

    我的站PC端也是用flash做404,移动端好像没搞,感觉移动端没啥必要,很少人在移动端手输网址吧

  2. 明月登楼的博客
    明月登楼的博客 【队长】 @回复

    我不是很喜欢在网站上放flash,要是有H5的小游戏倒是可以试试! [色]

  3. 热腾网
    热腾网 【市长】 @回复

    错误提示页更有内容了

  4. 薅羊毛
    薅羊毛 【村长】 @回复

    来看看呀

  5. 网赚博客
    网赚博客 【镇长】 @回复

    有用,收藏下

  6. 明月登楼的博客
    明月登楼的博客 【总理】 @回复

    可以试试!不错,我一直都想把404给弄的人性化一些

  7. 闲鱼
    闲鱼 【县长】 @回复

    生活不息,折腾不止

  8. 网赚博客
    网赚博客 【队长】 @回复

    这个给力了

  9. 纯洁博客
    纯洁博客 【市长】 @回复

    看你们的打字特效都弄上了,我也来弄个

  10. BanYuner
    BanYuner 【县长】 @回复

    好吧 目前来说我的站点就是启用了flash游戏 有时候自己还会玩一玩

  11. 网际电脑
    网际电脑 【市长】 @回复

    这个不错

  12. Koolight
    Koolight 【省长】 @回复

    搞那个公益404也挺好的。但是我的404被CDN弓虽女干了!

  13. 唯历史
    唯历史 【总理】 @回复

    这个方法很牛啊

  14. 橘子书
    橘子书 【市长】 @回复

    又一个从内容掉进技术坑里的娃。 [偷笑]

  15. 前端狂人
    前端狂人 【农民】 @回复

    移动和PC分别显示不同404

  16. 春熙路
    春熙路 【省长】 @回复

    好久没来看看了

  17. 王贱贱
    王贱贱 【村长】 @回复

    世间最可怕的就是认真二字,一旦认真,啥问题都能解决呀

  18. 我爱动感单车网
    我爱动感单车网 【省长】 @回复

    [流汗] 我博客的404错误页面在移动端是个啥样,还真就没关注过,算了爱咋滴就咋滴吧,懒得折腾!

  19. 靠谱学生兼职网
    靠谱学生兼职网 【市长】 @回复

    这个和之前的小游戏都不错。

  20. 分钱榜
    分钱榜 【县长】 @回复

    泛宝汇又上头条了

  21. 雅兮网
    雅兮网 【省长】 @回复

    原来WordPress自带日历函数

  22. 小萝博客
    小萝博客 【市长】 @回复

    下一个研究方向是什么