经常有人问我博客主题的事,写篇文章介绍一下,也算是个备份。

我使用的是Typecho程序,主题也是在Typecho默认主题上稍加修复得到的。

1、修改字体

本站使用了鹜霞文楷字体。

首先,在主题header.php中引用字体的css文件

<link rel="stylesheet" href="https://cdn.staticfile.org/lxgw-wenkai-screen-webfont/1.6.0/lxgwwenkaiscreen.css">

然后,修改style.css文件,在bodyh1,h2,h3,h4,h5,h6中的font-family,如下:

body {
    background-color: #FFF;
    color: #444;
    font-family: "LXGW WenKai Screen","Droid Serif",Georgia,"Times New Roman","PingFang SC","Hiragino Sans GB","Source Han Sans CN","WenQuanYi Micro Hei","Microsoft Yahei",serif;
    font-size: 100%;
}

h1,h2,h3,h4,h5,h6 {
    font-family: "LXGW WenKai Screen","Droid Serif",Georgia,"Times New Roman","PingFang SC","Hiragino Sans GB","Source Han Sans CN","WenQuanYi Micro Hei","Microsoft Yahei",serif;
}

2、修改页脚

页脚「本站已运行xx天,共xx篇文章和xx条评论。」的代码如下,主要增加了运行天数的统计:

本站已运行
<?php
$unixTime_1 = "1422748800";
$unixTime_2 = time();
$timediff = abs($unixTime_2 - $unixTime_1);
$days = intval($timediff / 86400);
echo  $days." 天. ";?>
<?php $stat = Typecho_Widget::widget('Widget_Stat');?>共 <?php echo $stat->PublishedPostsNum;?> 篇文章和 <?php echo $stat->publishedCommentsNum;?> 条评论.

3、增加图片注释

图片注释部分,修改了Typecho的Markdown解析器,属于核心代码了,我在这篇文章中提到过,现在汇总在本文中。

首先,需要修改var/HyperDown.php,对图片修改为

<figure><img class=\"skyimg\" src=\"https://static.skyue.com{$url}\" alt=\"{$escaped}\" title=\"{$escaped}\"><figcaption class=\"image-caption\">{$escaped}</figcaption></figure>

相应style.css增加

figure {
        border-style: solid;
        border-width: 1px;
        border-color: #e7e7e7;
        padding: 2px;
}

.image-caption {
    color: #999999;
    text-align: center;
}

以上修改实现的功能:

  • src增加https://static.skyue.com前缀,本地写作时,不用补全前缀即可发布。
  • 图片和图片标题包在figure中,并添加灰色边框,避免白底图与背景色重合,分不清边界。
  • 图片标签放在figcaption中,使用灰色字体。

分类: 折腾 标签: typecho, 博客程序

🔔 Email RSS订阅本博客

已有 25 条评论

  1. 这个主题的确不错,清爽

  2. 字体很舒服,我都想换上了

  3. 越简单的主题越耐看,好回味。

  4. 还是简单一点好看

  5. 改的还可以哈

  6. alan alan

    想问一下博主字体咋改大点,感觉按照你的方法改后,字体还是小一点

    1. 需要修改font-size,试试打到style.css中的下面这段,把font-size改为17,默认好像是16

      .post-content,.comment-content {

      line-height: 1.6;
      word-wrap: break-word;
          font-size: 17px;

      }

      1. alan alan

        谢谢博主

  7. 博友们有好多用Typecho,wordpress的确有些臃肿了

    1. typecho也有一些遗憾,比如没有restful api,与其它产品联动不方便。
      但我真的非常佩服作者,多年来只维持,不加新功能,很克制。这风格让我用起来非常安心。

  8. 我刚玩个人博客, 界面基本就按照你的来山寨的哈哈, 希望不要介意

    在这里我也想咨询一个问题, 希望看到的大家能帮我解决一下. 就是目前我博客里的内容已经有部分可以再Bing搜到, 但会出现两个链接结果, 一个是正常的, 另一个链接则会显示我的公网IP, 我该怎么做才能不让他搜出显示公网IP的结果

    1. 用cdn试试?

    2. 这个我没出现过,可以google一下,应该能在服务器端配置解决。

  9. 你的😎主题是我喜爱的其中之一,哈哈

    1. 简简单单,舒舒服服,连个异步加载都没有😂

  10. 其实这种超简的主题还是不错的。

添加新评论