Typecho Theme Story - 故事

Story

每个人都有属于自已的故事,我们编织着、叙述着,只为了那个必定动人的结局。

爱上自已的故事,爱上别人的故事,交织着的,是美好,是快乐,是幸福。

最近想开始记录一下自已的所见所得,感觉缺了一个可以让人安心记录的地方。
就这样,Story 诞生了。

Download: GitHub

Version@Halostory-halo by ruibaby, thanks.

Version@纸小墨ink-theme-story by akkuman, thanks.

Version@VeriPressStory-for-VeriPress.

Story v1@.0

预览图

Home

述说

导航
  • 各种原因
  • 引用的开源项目
  • 感谢及版权声明

个人认为这是一个适合写作与阅读的主题,所以我打算在这篇发布文章中以长段落的形式来写。首先,说说为什么要写 Typecho 版本的吧。具体有三点:一是 Typecho 轻量(相对);二是习惯写 Typecho 主题了,本地有很多写的练手项目可以参考;三是我本身对博客系统不怎么感冒,用了一个就不怎么想换了。本来打算把 Story 也写得很轻量,但迫于一些原因,就引用了以下项目(感谢): 75CDN, Bootstrap 4, jQuery, zoom_vanilla.js, Prism.js, Twemoji Awesome. 其实 jQuery 就用了它的 FadeIn(), FadeOut() 等函数,本来打算用纯 JavaScript 语法写的,但,emm... Prism 也是见仁见智吧,很多人都不需要的。

很久没有写主题了,主要是没什么灵感。私下里也写了几款,写的时候感觉超棒,但之后就不觉得了...一次偶然,进到了 Art ChenArtifact.me ,哇,这也太美了!特别是首页样式,真的叫人把持不住。然后我尝试写了几个有相似的感觉的首页,但还是感觉不如 Artifact 的。然后我就厚颜无耻的去征求原作者同意,想借鉴一下他的首页样式。征得同意之后,就马上开始后续了。所以你们觉得首页十分相似不要过度介意啊...

Story 首页样式来自 Art ChenArtifact.me 主题 Element,征得允许后开始写本主题,十分感谢。

评论框样式来自 Jimmy.

主题的一些食用说明

导航
  • config.php
  • 菜单
  • 网站标题修改
  • 修改网站标题后菜单定位
  • 背景图设置
  • 默认显示导航树
  • 其他
config.php

Story 包含一个全局配置文件。

//on 为开启
//off&其他 为关闭
$GLOBALS['isAutoNav'] = 'off'; //自动设置导航栏中 margin 及 width 值(推荐开启)
$GLOBALS['isIconNav'] = 'off'; //将导航栏中的 1,2,3 替换成 Emoji 图标
$GLOBALS['isRSS'] = 'off'; //在菜单栏中加入 RSS 按钮

$GLOBALS['style_BG'] = ''; //背景图设置。填入图片 URL 地址,留空为关闭
菜单

标题旁边有一个 · 字符,点击后便可显示菜单。1,2,3 分别代表 独立页面菜单导航树(仅在文章界面有用,仅解析 h3,h4 标签)以及搜索框

若您觉得 1,2,3 太抽象,可以将 config.php$GLOBALS['isIconNav'] 设置为 on 即可替换成相应 Emoji 图标。

网站标题修改

本主题要修改标题必须自行修改代码...位于 header.phpclass .header-logo(54行处) ,用 <span class="b"></span><span class="w"></span> 把自已的站点标题拼接出来就行了,其他可以不做修改。

修改网站标题后菜单定位

您可以将 config.php$GLOBALS['isAutoNav'] 设置为 on 即可自动调整,无需进行以下操作。

若您网站标题字数与原来(5个英文字母)不同,那要自行修改菜单的 margin 值。位于 assert/css/main.css#menu-page(609行处)#search-box(629行处) ,每个字符格子宽度为 28px ,可自行计算(别忘了算上菜单格,有4个)。

背景图设置

若要设置背景图,请修改位于 config.php$GLOBALS['style_BG'] 变量值。改为图片链接即可,留空即为关闭。

默认显示导航树

若要文章默认直接显示导航树,请在文章任意位置(推荐开头)添加 <!-- isTorTree:on; --> 。值得一提的是,当页面宽度小于 1024px ,导航树将不再显示。

其他

以上的特别说明如果有很多人介意的话,应该还是会写个配置文件然后用 PHP 自动生成修改的...

其他没有特别说明的基本不需要修改,当然你也可以按照个人兴趣随意修改。

若有什么不清楚可以给我发邮件或是在本页&GitHub询问。

写在最后

版权声明

感谢
许可

本程序源代码可任意修改并任意使用,但禁止商业化用途。一旦使用,任何不可知事件都与原作者无关,原作者不承担任何后果。

如果您喜欢,希望可以在页面某处保留原作者(Trii Hsia)版权信息。

感谢。

以一首歌结束

《旅立ちの日に》。

因为刚刚毕业,所以很有感触。

最后,暑期快乐!

Edit with Markdown

已有 147 条评论

  1. Bryans

    谢谢博主的主题,但是为什么目录树加上代码会直接显示出来,而不会生成,就像这样https://s1.ax1x.com/2020/06/20/Nlq3WT.png
    config.php里面也已经是on了

    Bryans June 20th, 2020 at 08:45 pm回复
    1. Jamie

      有可能是你没有格式化html代码,你试试首尾加!!!

      Jamie September 13th, 2020 at 04:56 am回复
    2. Trii Hsia

      可能是你 Typecho 的 Markdown 解析器不支持 HTML 解析。如果不想更换解析器的话,可以选择默认开启导航树。导航树默认只解析 h3, h4 标签,所以文章中需要出现此类标题才会显示。

      Trii Hsia June 20th, 2020 at 09:01 pm回复
      1. Bryans

        好的谢谢博主,有没有推荐的解析器?比如你的博客用的是啥

        Bryans June 21st, 2020 at 10:30 am回复
        1. Trii Hsia

          我用的是 Typecho 开发版,貌似 Markdown 解析器是 https://github.com/SegmentFault/HyperDown ?我也忘了...

          Trii Hsia June 21st, 2020 at 10:33 am回复
          1. Bryans

            啊好的,万分感谢,很Story这个主题

            Bryans June 21st, 2020 at 10:36 am
  2. Bryans

    作者大大,你右边的页内目录树是怎么实现的,通过插件还是改页面代码?我试了很多插件都不行

    Bryans June 20th, 2020 at 03:35 pm回复
    1. Bryans

      啊我看到源码了,config.php里面$GLOBALS['isTorTree'] = 'on'改了,但是文章开头加上不会生成目录树会直接显示出来,怎么办大大

      Bryans June 20th, 2020 at 04:10 pm回复
  3. 571

    作者你好,在只用了你的主题之后,我尝试更换背景图,但是更换完成之后,发现背景图像是被蒙上了一层白色的半透明图片,请问怎么解决呢

    571 April 30th, 2020 at 09:20 pm回复
    1. Trii Hsia

      是会降低图片的不透明度,默认设置为 0.05。
      要自定义的话,可以修改 main.css@111行 - body:before - opacity。
      https://github.com/txperl/Story-for-Typecho/blob/master/assert/css/main.css#L111

      Trii Hsia April 30th, 2020 at 09:23 pm回复
      1. 571

        改为多少才能生效呢,我改了数值但是没变化

        571 April 30th, 2020 at 10:04 pm回复
  4. bin

    感谢作者的辛苦付出,很喜欢你的主题,一直在找一款极简而优美,并适合手机等移动设备阅读的typecho主题外观,终于找到了,并用于我的个人博客,非常开心,再次感谢作者的付出!
    另:很喜欢的关于中那段优美的英文,我copy过去了,希望不要介意。

    bin April 29th, 2020 at 11:24 pm回复
  5. 凌晨

    怎么添加备案号呢

    凌晨 March 5th, 2020 at 06:28 pm回复
    1. Trii Hsia

      https://github.com/txperl/Story-for-Typecho/issues/24

      Trii Hsia March 14th, 2020 at 04:45 pm回复
  6. Heven Kin

    博主的这个主题很不错,抱走了ˋ( ° ▽、° )
    麻烦请问一下,独立页面能不能也有评论功能呢?

    Heven Kin February 19th, 2020 at 01:55 pm回复
    1. Trii Hsia

      可以的,只要修改 page.php 的代码就行了。具体请参考 post.php。

      Trii Hsia February 19th, 2020 at 10:04 pm回复
  7. Jamie

    博主,还有一个问题,就是首页文章封面,我按照加了后,直接显示出来了,是因为我用的默认编辑器不解析html标签问题?

    Jamie February 1st, 2020 at 01:40 pm回复
    1. Trii Hsia

      Story 不支持自定义文章封面。

      Trii Hsia February 1st, 2020 at 03:50 pm回复
  8. Jamie

    博主,请教下这个代码样式用的插件还是?安装了主题我这边默认没有代码样式?

    Jamie February 1st, 2020 at 02:37 am回复
    1. Trii Hsia

      可以参考一下 https://yumoe.com/archives/moricolor.html#anchor-3 - 代码高亮 部分。

      Trii Hsia February 1st, 2020 at 10:18 am回复
  9. Jamie

    有个问题,是不是登录的时候评论评论框上方的高度会很高?

    Jamie February 1st, 2020 at 02:23 am回复
    1. Trii Hsia

      emm 什么意思?

      Trii Hsia February 1st, 2020 at 10:16 am回复
      1. Jamie

        就是登陆评论,显示个人信息框会特别高,很不协调~

        Jamie February 1st, 2020 at 12:32 pm回复
        1. Trii Hsia

          确实,但看多了也习惯了...我觉得不影响普通浏览,之后可能会修复。

          Trii Hsia February 1st, 2020 at 01:19 pm回复
  10. 墨兰

    博主,评论框可以设置默认展开吗?

    墨兰 January 1st, 2020 at 08:48 pm回复
    1. Trii Hsia

      可以的,改一下 JS 就好了。

      Trii Hsia January 18th, 2020 at 02:08 pm回复