非插件实现Emlog时间轴归档代码分享

2014-11-21 / 9 评论 / 9930 阅读

文件缓存型时间轴归档,后台更新缓存或者发布新文章的时候会自动更新;本站这个代码是使用缓存系统的,是需要修改内核文件的。慎用!

1、修改include/lib/cache.php文件,添加归档缓存函数

private $logalias_cache;
之后添加
private $loglists_cache;

添加在其他缓存函数位置添加归档缓存

    /*** 文章归档列表缓存 */
    private function mc_loglists() {
        $query = $this->db->query('select gid,title,date from ' . DB_PREFIX . "blog WHERE hide='n' and checked='y' and type='blog' ORDER BY date DESC");
        $loglists_cache = array();
        while ($row = $this->db->fetch_array($query)) {
            $loglists_cache[]= $row;
        }
        $cacheData = serialize($loglists_cache);
        $this->cacheWrite($cacheData, 'loglists');
    }

不懂的朋友只请直接下载本文件覆盖include/lib/cache.php(请做好备份)cache.zip

博客开通时间过长的话,可能后面发布的文章会显示不出来,可自定义时间:AND date > $time - 3365246060(这个代码表示显示最近3年的文章)

2、此方法因不同的模板修改的有所差异,本站讲述以默认模板为例,首先复制模板目录下的page.php并重新命名为guidang.php(ps:这个自己可自行修改),把其中的<?php echo $log_content; ?>更改为如下代码即可

<div class="guidang">
<?php
global $CACHE; 
$loglists_cache = $CACHE->readCache('loglists');
$year_month = 0;
foreach($loglists_cache as $value):
if($year_month != 0&&$year_month != date("Y-m",$value['date'])){
echo '</ul>';}
if($year_month != date("Y-m",$value['date'])){
$year_month = date("Y-m",$value['date']);
echo '<h2 class="guidang-tt">'.$year_month.'</h3><ul>';}
?>
<li><a href="<?php echo Url::log($value['gid']);?>" target="_blank" title="<?php echo $value['title']; ?>"><span><?php echo date("Y-m-d",$value['date']);?></span><div class="atitle"><?php echo $value['title'];?></div></a></li>
<?php endforeach;?></div>

css文件如下

.guidang h2{font-size:150%;}
.guidang li a{padding:8px 0;display:block}
.guidang li a:hover .atitle:after{background:#ff5c43}
.guidang li a span{display: inline-block;width:100px;font-size:12px;text-indent:20px}
.guidang li a .atitle{display: inline-block;padding:0 15px;position:relative;width:550px;white-space:nowrap;text-overflow:ellipsis;}
.guidang li a .atitle:after{position:absolute;left:-2px;background:#ccc;height:8px;width:8px;border-radius:6px;top:8px;content:""}
.guidang li a .atitle:before{position:absolute;left:-4px;background:#fff;height:12px;width:12px;border-radius:6px;top:6px;content:""}
.guidang{margin:10px;position:relative;padding:10px 0}
.guidang:before{height:100%;width:4px;background:#eee;position:absolute;left:100px;content:"";top:0}
.guidang-tt{position:relative;margin:10px 0;cursor:pointer}    
.guidang-tt:hover:after{background:#ff5c43}
.guidang-tt:before{position:absolute;left:93px;background:#fff;height:18px;width:18px;border-radius:6px;top:3px;content:""}
.guidang-tt:after{position:absolute;left:96px;background:#ccc;height:12px;width:12px;border-radius:6px;top:6px;content:""}

然后建立一个页面,在页面模板处填写 guidang 即可,演示地址:http://www.shuyong.net/guidang.html

评论一下?

OωO
取消
    1. 头像
      山山而川
      第5楼
      踩踩
      回复
    1. 头像
      小杰
      第4楼
      其实,我建议弄成鼠标触碰打开时间轴,一个个点有点不灵活吧
      回复
    1. 头像
      唐瑞
      地板
      谢谢,我可以了
      回复
    1. 头像
      唐瑞
      板凳
      好像没用啊
      回复
      1. 头像
        舍力
        @唐瑞:演示地址都有了,怎么可能没用呢?仔细检测一下自己弄的。可能那里弄错了吧
        回复
      1. 头像
        唐瑞
        @舍力:好的,我再去试试看看
        回复
    1. 头像
      唯一度博客
      沙发
      如果有收缩功能会更好一点
      回复
      1. 头像
        舍力
        @唯一度博客:这个css应该就可以搞定的,可以捣鼓一下的。。。
        回复
      1. 头像
        唯一度博客
        @舍力:我是菜鸟
        回复