Z-Blog PHP文章、标签、分类编辑中加入单独缩略图上传功能

1912人参与｜分类: 站长百科｜时间: 2017年05月01日

今天有网友问我能不能在Z-BlogPHP的文章编辑中加入单独缩略图上传的功能，然后在模版中为文章添加独立的缩略图链接字段来调用。其实只要使用UEditor插件的上传功能我们就可以实现了！经过添加这个功能确实可以方便用户快速指定文章列表中图片。

下面详细说明下，如何为文章、分类、标签tag加入单独的缩略图功能。

一、文章增加独立的缩略图上传字段：

1、在include.php挂载：

Add_Filter_Plugin('Filter_Plugin_Edit_Response3','ChenDeXin_article_img');

2、在include.php加入：

function ChenDeXin_article_img(){
global $zbp,$article;
echo "<script type=\"text/javascript\" src=\"{$zbp->host}zb_users/theme/{$theme}/style/js/lib.upload.js\"></script>";
echo '<p align="right" class="uploadimg">上传缩略图：
<input name="meta_pic" id="edtTitle" type="text" class="uplod_img" style="width:60%;" value="'.$article->Metas->pic.'" /><br /><br />
<strong style="color: #ffffff; font-size: 14px;padding: 6px 18px 6px 18px; background: #3a6ea5;border: 1px solid #3399cc; cursor: pointer;">浏览文件</strong>
</p>';
}

特别说明：在上面的代码中必须单独加载一个JS文件，我在文章末尾会提供文件的下载地址。

3、调用方法：

{$article.Metas.pic}

二、分类、标签tag加入上传缩略图功能：

如果按文章增加独立缩略图的方法操作，会发现点击浏览文件，无法弹出编辑的上传弹窗，这是因为默认情况下，在分类和标签tag的编辑页面，并没有加载UEditor 的部分JS文件，而是只为文章编辑准备的。所以，需要手动补充完整UEditor的部分JS文件。

废话不多说，还是直接上方法：

1、还是include.php挂载：

Add_Filter_Plugin('Filter_Plugin_Tag_Edit_Response','ChenDeXin_tag_seo');//tag自定义字段

2、加入：（注意，这里补充加载了UEditor编辑器的部分JS文件）

function ChenDeXin_tag_seo(){
    global $zbp,$tag;
 echo "<script type=\"text/javascript\" src=\"{$zbp->host}zb_system/script/jquery.tagto.js\"></script>";
 echo "<script type=\"text/javascript\" src=\"{$zbp->host}zb_system/script/jquery-ui-timepicker-addon.js\"></script>";
 echo "<script type=\"text/javascript\" src=\"{$zbp->host}zb_users/plugin/UEditor/ueditor.config.php\"></script>";
 echo "<script type=\"text/javascript\" src=\"{$zbp->host}zb_users/plugin/UEditor/ueditor.all.min.js\"></script>";
 echo "<script type=\"text/javascript\" src=\"{$zbp->host}zb_users/theme/{$theme}/script/lib.upload.js\"></script>";
 echo '<p align="left" class="uploadimg">上传TAG图：<input name="meta_tagpic" id="edtTitle" type="text" class="uplod_img" style="width:40%;" value="'.$tag->Metas->tagpic.'" />
 <strong style="color: #ffffff; font-size: 14px;padding: 6px 18px 6px 18px; background: #3a6ea5;border: 1px solid #3399cc; cursor: pointer;">浏览文件</strong>
</p>';
}

特别注意：以上所有JS文件请确保路径正确，特别是lib.upload.js文件的路径，必须保证！

3、调用方法：