handsome主题算是一个比较完善的typecho主题了，在设置面板里也提供了诸多功能。不过功能永远赶不上需求，因此笔者会不定期对handsome进行一些改动以满足自己的爱好。

主题下载（？）：不存在下载，请支持正版：[handsome][1]

  • 本文会将页面样式和JS分开记录，均按笔者的改造时间新=>旧为序。
  • 会标出大致行数，不过由于可能会有忘记的修改因此行数可能不一致，请善用搜索功能
  • JS部分默认读者已有最基础的JS和HTML知识
  • 使用的辅助工具：VSCode、github（现已支持免费私人repo）

前端样式

修改置顶和目录按钮

typecho的侧边浮动按钮图标比较怪，全屏的按钮竟然是目录，鼠标不悬浮在上面也没有提示；置顶按钮只是个人不喜欢而已。
文件位置：usr/themes/handsome/component/footer.php
70行左右

      <div class="topButton panel panel-default">
          <button id="goToTop" class="btn btn-default no-shadow pos-abt hide">
              <i class="fontello fontello-chevron-circle-up" aria-hidden="true"></i>
          </button>
      </div>

文件位置：usr/themes/handsome/component/sidebar.php
130行左右

                  <button class="btn btn-default no-shadow pos-abt" data-toggle="tooltip" data-placement="left" data-original-title="<?php _me("目录") ?>" data-toggle-class=".tocify-mobile-panel=active">
                      <i class="glyphicon glyphicon-resize-full"></i>
                  </button>
                  <div class="panel-heading"><?php _me("文章目录") ?></div>

修改<button>标签内的<i class>即可。笔者使用了Bootstrap的自带图标。

404页面去除登录注册按钮

个人的博客不需要此功能
文件位置：usr/themes/handsome/404.php
删就完了

删除时光机右侧联系方式图标下方圆点

文件位置：usr/themes/handsome/cross.php
130行左右

$contactItemsOutput .= '<li class="list-group-item"><a target="_blank" href="'.$itemLink.'"
        class="pull-left thumb-sm avatar m-r"><img src="'.$itemImg.'" class="img-circle"><i
            class="on b-white bottom"></i></a>
    <div class="clear">
        <div><a target="_blank" href="'.$itemLink.'">'.$itemName.'</a></div><small
            class="text-muted">'.$itemValue.'</small>
    </div>
</li>';

删除<i class="on b-white bottom"></i>

分类开关改为默认打开

新版handsome已经提供此功能，故折叠

折叠的内容


文件位置：usr/themes/handsome/component/aside.php
约120行


<!--分类category-->
<!-- php+jquery展开、收起下拉菜单 -->
<?php
$class = "";
if (in_array("openCategory", $this->options->featuresetup)) {
$class = "class=\"active\"";
}
?>
        <li class="active">
          <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-th"></i>
            <span><?php _me("分类") ?></span>
          </a>
添加`<li class="active">`