Lzy's Hobby

  • 首页
  • IT教程
    • 操作系统相关
    • 网络相关
    • 网站运维相关
  • IT资源
    • 建站资源
    • 软件资源
  • IT学习
    • 知识体系
    • 学习笔记
    • 学习资源
  • 关于
    • 博主简介
    • 建设历史
    • 朋友
    • 留言
  • Lzy's Life
Lzy's Hobby
一个关注IT科技的个人独立博客
  1. 首页
  2. IT教程
  3. 正文

Typecho“时光机”页面实现

2018-08-31 5546点热度 0人点赞 8条评论

明天下午就要踏入高中校门了,今天发布暑假最后一篇文章。

封面

Typecho“时光机”页面实现

在一些博客,大家可能会看到这种类似微博的页面:

handsome时光机页面(XSY&Free sky截图)

那么怎么实现这种功能呢?实现思路是在一个独立页面模板中调用评论区。
1.创建一个独立页面模板"cross.php"。
2.创建一个新的评论区模板"comments2.php"(先完全复制comments.php中的代码,然后删掉评论者昵称、评论者邮箱、评论者网址这三个输入框)。
3.在独立页面模板中调用新的评论区模板"comments2.php"。
4.在Typecho创建独立页面(模板选择刚刚所创建的独立页面模板)
下面引用了梁兴健博客的代码,使用了AmazeUI 前端框架,各位可以按自己的需求自行修改样式。
独立页面模板cross.php:

<?php
/**
* 闲言碎语
*
* @package custom
*/
if (!defined('__TYPECHO_ROOT_DIR__')) exit;
$this->need('header.php');
?>

<div class="main">
  <div class="am-g">
    <div class="am-u-lg-12">
      <div class="post">
        <div class="post-top bg-white">
          <h1 class="post-title-x" itemprop="name headline"><?php $this->title() ?></h1>
        </div>
        <div class="post-content bg-white">
              <?php $this->need('comments2.php'); ?>
        </div>
      </div>
    </div>
  </div>
</div>
<?php $this->need('footer.php'); ?>

新评论区模板:

<?php if (!defined('__TYPECHO_ROOT_DIR__')) exit; ?>
<div id="comments">
    <?php $this->comments()->to($comments); ?>
    <?php if ($comments->have()): ?>
    
    <?php endif; ?>

    <?php if($this->allow('comment')): ?>
    <div id="<?php $this->respondId(); ?>" class="respond">
        <div class="cancel-comment-reply">
        <?php $comments->cancelReply(); ?>
        </div>
        <form method="post" action="<?php $this->commentUrl() ?>" id="comment-form" role="form">
            <?php if($this->user->hasLogin()): ?>
            <p><?php _e('登录身份: '); ?><a href="<?php $this->options->profileUrl(); ?>"><?php $this->user->screenName(); ?></a>. <a href="<?php $this->options->logoutUrl(); ?>" title="Logout"><?php _e('退出'); ?> &raquo;</a></p>
          <div class="am-form-group">
            <textarea class="am-form-field" placeholder="文明灌水~" rows="5" name="text" id="textarea" required><?php $this->remember('text'); ?></textarea>
          </div>
          <button type="submit" class="am-btn am-btn-primary"><?php _e('提交评论'); ?></button>
            <?php else: ?>
          <?php endif; ?>
        </form>
    </div>
    <?php $comments->listComments(); ?>
    <?php $comments->pageNav('«', '»', 1, '...', array('wrapTag' => 'ul', 'wrapClass' => 'am-pagination am-pagination-centered', 'itemTag' => 'li', 'textTag' => 'span', 'currentClass' => 'am-active', 'prevClass' => 'prev', 'nextClass' => 'next',)); ?>
    <?php else: ?>
    <h3><?php _e('评论已关闭'); ?></h3>
    <?php endif; ?>
</div>

本站实现的效果是这个样子的:

时光机页面

将“时光机”页面的内容输出到首页

如果要把“时光机”页面的内容显示在首页呢?其实亦不难。

在主题文件目录创建PHP文件,内容如下(参数请根据实际需要修改):

<?php
//start page comments
    $slug = "17"; //页面缩略名
    $limit = 1;  //调用数量
    $length = 40;  //截取长度
    $ispage = true;  //true 输出slug页面评论,false输出其它所有评论
    $isGuestbook = $ispage ? " = " : " <> ";
    $db = $this->db;//Typecho_Db::get();
    $options = $this->options;//Typecho_Widget::widget('Widget_Options'); 
    $page = $db->fetchRow($db->select()->from('table.contents')
        ->where('table.contents.status = ?', 'publish')
        ->where('table.contents.created < ?', $options->gmtTime)
        ->where('table.contents.slug = ?', $slug));  
    if( $page ){
        $type = $page['type'];
        $routeExists = (NULL != Typecho_Router::get($type));
        $page['pathinfo'] = $routeExists ? Typecho_Router::url($type, $page) : '#';
        $page['permalink'] = Typecho_Common::url($page['pathinfo'], $options->index);
            
        $comments = $db->fetchAll($db->select()->from('table.comments')
        ->where('table.comments.status = ?', 'approved')
        ->where('table.comments.created < ?', $options->gmtTime)
        ->where('table.comments.type = ?', 'comment')
        ->where('table.comments.cid '.$isGuestbook.' ?', $page['cid'])
        ->order('table.comments.created', Typecho_Db::SORT_DESC)
        ->limit($limit)  );
    
        foreach($comments AS $comment) {
            echo Typecho_Common::subStr(strip_tags($comment['text']), 0, $length, '...');
            echo ' <a href="'. $page['permalink']."#comment-".$comment['coid'] .'" class="btn btn-danger btn-sm" style="color:white">详情</a>';
        }    
    }else{
        echo "暂无公告";        
    }
//end page comments

然后在需要显示的地方插入:<?php include_once "xxx.php";?>(文件名请修改为实际文件名),效果如下:

将“时光机”页面的内容输出到首页

参考来源:梁兴健博客,SegmentFault

本作品采用 知识共享署名-相同方式共享 4.0 国际许可协议 进行许可
标签: AmazeUI typecho 代码 博客 模板
最后更新:2018-08-31

lzy20021010

一个研究了N年IT的博主

打赏 点赞
< 上一篇
下一篇 >

文章评论

  • 淘宝优惠券

    这个功能不错!

    2018-09-01
    回复
    • lzy20021010

      @淘宝优惠券 谢谢!

      2018-09-07
      回复
  • Vultr VPS

    朋友 交换链接吗
    我站:https://www.laopan.org/ (便宜vps)

    2018-09-02
    回复
    • lzy20021010

      @Vultr VPS 你好,已收录到本站内页链接处,谢谢支持!

      2018-09-07
      回复
      • 便宜vps

        @lzy20021010 已添加贵站为首页链接,能否将我站链接也改为首页?

        2018-09-08
        回复
      • 便宜vps

        @lzy20021010 已添加贵站为首页链接,能否将我站链接也改为首页?

        2018-09-08
        回复
  • 梁兴健

    时光机显示到首页是个好点子,学习了!

    2018-09-02
    回复
    • lzy20021010

      @梁兴健 这个功能初衷是用来显示公告的。

      2018-09-07
      回复
  • razz evil exclaim smile redface biggrin eek confused idea lol mad twisted rolleyes wink cool arrow neutral cry mrgreen drooling persevering
    取消回复

    文章目录
    • Typecho“时光机”页面实现
    • 将“时光机”页面的内容输出到首页
    最新 热点 随机
    最新 热点 随机
    世界,您好! 中国计算机软件著作权个人申请攻略 WordPress屏蔽海外非中文垃圾评论(2023版) Dell Inspiron 15-3541 笔记本折腾记 本站架构由Typecho迁回WordPress 世界,您好!
    免费使用VestaCP控制面板的文件管理器和SFTP Chroot功能 中国计算机软件著作权个人申请攻略 Typecho更新小记 OneinStack一键安装脚本-快速安装VPS网站环境 Typecho博客搬家教程和.htaccess重写让空间绑定多个域名到不同的目录支持多站点 台式电脑更换显卡记
    标签聚合
    typecho 文件 博客 域名 网站 来源 用户 Windows

    COPYRIGHT © 2015-2025 Lzy's Hobby ALL RIGHTS RESERVED.

    THEME KRATOS MADE BY VTROIS

    Powered by WordPress

    Server by Aliyun

    闽ICP备18019376号-1

    闽公网安备 35052102000284号