天兴工作室

今天用css写了个图片连续横向滚动，完成效果如下：

总共用了两张图，一张背景图，一张滚动图，html结构如下：

<div class="img-box">
    <img src="背景图地址">
    <div class="roll-img1"><img src="滚动图片地址"></div>
    <div class="roll-img2"><img src="滚动图片地址"></div>
</div>

然后是css

/* 动画1 */
@keyframes rollimg1 {
    0% {
        left: 0;
    }
    100% {
        left: -100%;
    }
}
/* 动画1 */
@keyframes rollimg2 {
    0% {
        left: 100%;
    }
    100% {
        left: 0;
    }
}
/* 最外层 */
.img-box{
    position: relative;
    overflow: hidden;
}
/* 背景图 */
.img-box>img{
    display: block;
    position: relative;
    line-height: 1;
    width: 100%;
    height: auto;
    z-index: 1;
}
/* 最开始滚动的图片 */
.roll-img1{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    overflow: hidden;
    animation: rollimg1 12s infinite linear;
    display: flex;
    align-items: center;
}
/* 接着滚动的图片 */
.roll-img2{
    position: absolute;
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
    z-index: 2;
    overflow: hidden;
    animation: rollimg2 12s infinite linear;
    display: flex;
    align-items: center;
}

以上就是用css的“@keyframes”动画效果来实现图片横向滚动的全部代码了，调节滚动速度修改“animation”里面的“12s”中的数字即可。

我们在用zblogphp的时候，需要调用网站的全部分类名称或者链接啥的，对于这个需求zblogphp内置了三个函数。

第一个函数是“$zbp->GetCategoryList”，这个函数可以自定义获取的分类排序或者过滤，用法如下：

{foreach $array=$zbp->GetCategoryList(null,null,array('cate_Order'=>'ASC'),null,null) as $cate}
<a href="{$cate->Url}">{$cate->Name}</a>
{/foreach}

函数一共有5个参数，分别对应：“选择项”、“获取指定值”、“排序、“调用数量”、“附加选项”。这个函数的构造在“zblogphp.php”文件里面，具体用法可以在这个文件里面搜索。

第二个函数是“$zbp->categorysbyorder”，这个函数用法如下：

{foreach $zbp->categorysbyorder as $cate}
<a href="{$cate->Url}">{$cate->Name}</a>
{/foreach}

这个函数可自定义项没有那么多，如果你要自定义获取一些数据，推荐用第一个函数。

如果你想在主题配置里面使用，还有一个封装好的函数。这个函数已经集成好了“select”选择及选中效果，在主题的配置项文件里面只需要像下面这样就可以让用户选择指定的分类了。

<select name="字段名">
<?php echo OutputOptionItemsOfCategories('自定义字段名');?>
</select>

上面的三个函数就可以解决大部分的关于调用网站分类的需求了，如果还有更复杂的需求，欢迎联系我们定制。

如果你想批量在每篇文章正文的前面或者后面插入指定内容的话，可以按照本文教程操作。

ps：需要有一定的动手能力，另外进行前请务必把网站数据备份到本地以免发生意外。

第一：打开你所使用的主题或者插件里面的include.php文件，在“ActivePlugin”函数里面挂上这个接口：

Add_Filter_Plugin('Filter_Plugin_ViewPost_Template', '应用ID_Main');

第二：写一个自己的函数，如下：

function 应用ID_Main(&$template) {
    global $zbp;
    $article = $template->GetTags('article');
    $article->Content = '这里就是插入到每篇文章正文前面的内容'. $article->Content . '这里是插入到每篇文章正文后面的内容';
}

保存文件后，打开后台首页清空下缓存。然后打开一篇文章即可看到效果了。

上一节我们讲了zblog的用户管理，这一节讲的是zblog的主题管理。

打开zblog后台，点击左侧的“主题管理”，就会来到如下图所示界面，这里会显示你网站所有可以使用的主题。

当前正在使用的主题会排在第一位并有蓝色背景，想使用其他主题直接点击该主题的启用按钮即可启用。

zblog安装主题：

zblog安装主题有3种方式：

1、后台--应用中心里面直接选择合适的主题点击在线安装即可；

2、获得“.zba”格式的主题包直接在上图所示的“本地上传并安装主题zba文件”后面点击浏览选择本地的zba文件上传，再点击后面的“提交”按钮即可完成主题安装；

3、获得文件夹或者压缩包格式的主题包，将主题文件夹通过ftp整个上传到服务器的“zb_users/theme/”目录下即可完成主题安装；

下载zblog主题到本地：

同样有两种方式：

1、ftp链接服务器打开“zb_users/theme/”文件夹，找到你需要下载的主题文件夹整个下载到本地即可；

2、下载“.zba”格式文件到本地，这个需要先再后台--应用中心--设置--启用开发者模式，之后再打开主题管理，会发现界面变成下图所示：

然后再点击主题底部的下载按钮即可下载该主题的".zba"格式主题包到本地了。

补充说明：

zblog默认可以上传的文件大小限制为“2M”，如果你发现上传“.zba”格式主题包成功了但是不显示主题，那么请检查下该主题包是否大于2M。

当主题包大于2M的时候还需要去后台--网站设置--全局设置里面把“允许上传文件的大小(单位MB)”的值设置大一点，通常此处设置后如果还是不行那么还需要去服务器里面修改php.ini配置项，由于每种服务器环境不一样导致设置路径不一样，具体请自行百度。