匿名.

本站美化集合笔记
前言前段时间经常有小伙伴来问本站Handsome是如何美化的 特此在这里写一个集合笔记预览评论展示教程顶栏天气教程...
扫描右侧二维码阅读全文
20
2019/04

本站美化集合笔记

前言

前段时间经常有小伙伴来问本站Handsome是如何美化的 特此在这里写一个集合笔记


预览


评论展示

教程


顶栏天气

教程


组成栏添加选项

教程

1.需修改文件usr/themes/handsome/component/aside.php

2.在注释 <!--独立页面pages-->上方或者合适位置添加以下代码即可(以下代码为我的博客的示例代码,请注意修改)

<!--站点分类-->
<li>
  <a class="auto">
    <span class="pull-right text-muted">
      <i class="fontello icon-fw fontello-angle-right text"></i>
      <i class="fontello icon-fw fontello-angle-down text-active"></i>
    </span>
    <i class="glyphicon glyphicon-cog"></i>
    <span>站点</span></a>
  <ul class="nav nav-sub dk">
    <li class="nav-sub-header">
      <a data-no-instant="">
        <span>站点</span></a>
    </li>
    <!--网站-->
    <li>
      <a href="https://img.5sir.cn">
        <i class="glyphicon glyphicon-picture icon text-md"></i>
        <span>图床</span></a>
    </li>
    <li>
      <a href="https://download.5sir.cn">
        <i class="glyphicon glyphicon-paperclip"></i>
        <span>资源</span></a>
    </li>
    <li>
      <a href="https://5sir.cn/funny/">
        <i class="glyphicon glyphicon-ice-lolly-tasted"></i>
        <span>滑稽</span></a>
    </li>
  </ul>
</li>
<!--站点分类-->

背景动画

教程

1.下载JS文件放入你网站目录

传送门:canvas-nest.js

2.Handsome主题后台--更改外观--设置外观--开发者设置--自定义输出body尾部的HTML代码内添加以下代码即可(注意地址改成自己的引入链接)

<script type="text/javascript" color="128,128,128" src="https://5sir.cn/js/canvas-nest.js"></script>

一言居中 删除网站名称

教程

1.删除约33行的以下代码

<h1 class="m-n font-thin h3 text-black l-h"><?php $this->options->title(); ?></h1>

2.将<header class="bg-light lter b-b wrapper-md">修改为<header class="bg-light lter b-b wrapper-md" style="text-align:center">即可



本文由 匿名. 创作, 采用 知识共享署名4.0 国际许可协议进行许可

本站文章除注明转载/出处外,均为本站原创或翻译,转载前请务必署名

原文地址:《本站美化集合笔记》

最后修改:2019 年 05 月 05 日 02 : 55 PM
如果觉得我的文章对你有用,请随意赞赏

发表评论

2 条评论

  1. 有意博客

    早上好,弄得不错啊,越来越好了。

    1. 匿名.
      @有意博客

      老哥早上好哈