为你的zblog博客文章添加版权声明

 2025-01-15  阅读 450  评论 5  点赞 130

摘要:简介我想大家在浏览其他博客文章的时候会发现在文章尾部会有一段版权说明吧,就是类似‘本文由XXX原创,转载请注明XXXX’,那么这个功能在zblog上要怎么操作呢?下面我们来看下效果以及代码。效果一css代码.open-message{margin-bottom:10px;padding:5px 10px;border-radius:

简介

我想大家在浏览其他博客文章的时候会发现在文章尾部会有一段版权说明吧,就是类似‘本文由XXX原创,转载请注明XXXX’,那么这个功能在zblog上要怎么操作呢?下面我们来看下效果以及代码。

效果一

为你的zblog博客文章添加版权声明

css代码

.open-message{margin-bottom:10px;padding:5px 10px;border-radius:2px;background-color:#fcf8e3;border:1px solid #faebcc;color:#8a6d3b}

将css代码添加至主题中的css文件中。

HTML代码

<div class="open-message" style="border:#00a67c 1px solid;border-radius:5px 5px 5px 5px;">
<i class="fa fa-bullhorn"></i>转载请注明:<a href="{$host}">{$name}</a>»<a href="{$article.Url}">{$article.Title}</a></div>

将div代码添加至主题中的文章页模板中,不出意外的话一般都是post-single.php(template/post-single.php),在模板文件中找到{$article.Content}这个标签,这是文章正文输出的标签,将代码添加在标签div的下方。

代码说明:

<i class="fa fa-bullhorn"></i> <!---此代码为Font Awesome字体图标--->

Font Awesome图标安装及使用方法

{$host} <!---此标签为首页链接--->
{$name} <!---此标签为网站标题--->
{$article.Url} <!---此标签文章链接--->
{$article.Title} <!---此标签文章标题--->

效果二

为你的zblog博客文章添加版权声明 鼠标悬停效果为你的zblog博客文章添加版权声明

css代码

.post-copyright{background-color:#f2f2f2;font-size:12px;color:#999;padding:6px 15px 5px;border-radius:2px;margin-top:10px;margin-bottom:30px}
.post-copyright:hover{background-color:#FF5E52;color:#fff}

HTML代码

<p class="post-copyright">除特别注明外,本站所有文章均为<a href="{$host}" style="color:#51aded;">{$name}</a>原创,转载请注明出处来自<a href="{$article.Url}" style="color:#51aded;">{$article.Url}</a></p>

效果二的添加方法与上述效果一是相同的。  

评论列表:

  •   echo111
     发布于 3天前回复该评论
  • 写的很不错,学到了!
显示更多评论

发表评论:

管理员

承接各种程序开发,外贸网站代运营,外贸网站建设等项目
  • 内容2460
  • 积分67666
  • 金币86666

Copyright © 2024 LS'Blog-保定PHP程序员老宋个人博客 Inc. 保留所有权利。 Powered by LS'blog 3.0.3

页面耗时0.0269秒, 内存占用1.94 MB, 访问数据库27次

冀ICP备19034377号