我想要集合多个模板的样式，该怎么做呢？

我目前使用的是 Bitcron 的 Classify 模板
 因为我最喜欢这里的分类是一个个方块文件夹，而且界面很简洁，总体而言很不错
 但这并不意味着，我就非常满意了。

第一个要的是好看的分类

Classify 模板满足了这一点，可是它并不是通过 域名/category 链接到的，而是这个模板自己的属性决定了，它的首页就是如此展示。
 但是 Classify 首页只能展示最新的一篇文章，而且长度很短…
 文章内容也显示成了纯文本，并且挤在一起…

第二个要的是左侧可隐藏的菜单栏 √

fexo 模板 我的小号在用，我喜欢它右侧自动显示、并且可浮动的 TOC
 文章移动到哪一个段落，对应的段落颜色就会加深，太实用了！

补充 1：Wiki 的 Fit 目录结构也能满足我的要求，可惜的是，如果我要搭建这个页面的话，需要手动添加每一篇文章的链接，这就是一个大问题。（最大篇数是 300 篇）
 补充 2：感谢 kmt007 的热心建议，在 meta 里增加 app:markdown，然后在正文里添加返回主页的链接，代码如下 

> 这是一个wiki样式显示的网页。[点击这里返回主页](http://www.liaoyuqin.com?status=loaded)。

最终显示效果如下

这是一个wiki样式显示的网页。点击这里返回主页。

第三个要的是图片展示，以及自带背景、标题、摘要的前后文章

Casper 模板
 据我观察，这个模板的图片，有时候大气好看，但有时候丑得不行
 背景图片还是挺重要的，如果能有高质量的图库（第三方、自己积累的都可以）
 能存在 Dropbox，然后连接 Bitcron，让它自己随机替换就好了
 甚至再精细一些，能指定单篇文章的图对应了哪些图片轮替


补充1
 在 MarkEditor 的网站教程里，提到了一个章节间智能跳转的代码，如下 

[显示的文字](另外章节的名字)
[显示的文字](另外章节的文件名)
[显示的问题](/this_is_url?title=另外章节的名字)

设置一下就能实现上一篇、下一篇的跳转了。只不过，这好麻烦啊……
 应该从模板里设置才对，实现自动化。

补充2 

<?php previous_post_link('上一篇: %link') ?>
<?php next_post_link('下一篇: %link') ?>

第四个要的是文章内部 引用部分的样式

Cho 模板
我喜欢这种大引号，显得很干净。

第五个要的是文章展示的 瀑布流

ColaChan 模板
首页显示的文章，一篇一篇拉下来会自动刷新，就像瀑布一样。
 不过这种有一个问题是，几乎不可能拉到底，一直会加载文章，这个可能会让人抓狂。
 右侧的小三角形，点击后可直达页面最顶端，这很方便。
 这个模板里面的搜索框挺好，本来是小小的，点击之后会放大。

第六个要的是动态球体标签云

动态的标签云（一个立体圆球），鼠标挪到哪里 哪里就能放大
 点击进去就能看见对应标签的文章，像一个立体的地图
 我是无意中看到一个人的博客里有这样的标签云的，链接已经忘记
 后来网上搜索找到了下面这些

还是没有那个大神的标签云厉害，我记得大神的标签云是纯色的、灰色、深灰色交叠
 还有线条，每一个词汇互相连接，超级厉害！

意外收获：
 1.Whxaxes 这个人挺厉害的， 3D 标签云的解析文章、Github 主页
 2.百度前端技术学院 有不少精品课，4月24日之后可以学一下，看能不能报下一期的
 3.jawil 在 Github 上总结了 掘金的 前端工程师文章资料

第七个要的是文章内部可以收放自如的小三角代码 √

就像赵凯的博客一样
 发过邮件问这位博主，收到了回复 ^_^
 他告诉我，这是 HTML 的 <details> 标签

附上 Markdown 的内容如下： 

<details><summary>我是题干</summary>
- 选项 A
- 选项 B
</details>

显示出来就是下面这样：

我是题干

  • 选项 A
  • 选项 B

第八个要的是 TOC 能跟在右侧浮动 √

TOC 我是一定要的，这样有两个明显的好处

  • 一是让人一目了然，整个文章内容的主体结构
  • 二是可以直接点击感兴趣的地方，能立刻跳转到那一段

我觉得将一个人写的文章从头看到尾的人不多，也没必要。
 大可挑自己感兴趣的看~
 就算只能为一个人节省时间，我也心满意足
 Classify 模板的 TOC 样式直接顶到最前，而且颜色过于浅淡，我倒是有点不喜欢
 我想要的是 始终在右侧飘着的 TOC，找到合适的我再贴过来吧。

更新咯：

Chrome 的插件：Small TOC 很满意！只是不用 Chrome 或者不懂翻墙的访客，就体会不到这种好处啦~推荐安装哦，拿来看 Github 跟 Blog，很实用！

不过这是从第三方插件入手，并不是从修改博客模板样式入手的，哎~ 得再研究研究
 TOC 主要是想拿来做读书笔记的展示，篇幅较长，看到 kmt007 的留言，确实可以利用 Bitcron 的Wiki，这样也挺好看的。

QAQ 求助：小白如何 DIY 博客模板，东拼西凑成想要的样子呢？

我想要的功能基本如上述，目的很明确了。
 但我现在的处境，就像是已经搬好了砌墙所需的砖块，也设想好了墙体要做成的样子。
 可是不懂怎么才能砌好墙……
 而且还奢望，能没有多余、冗杂的代码……（捂脸，我喜欢干净最简的空间）

P.S. 想要自己修改模板，会利用到哪些知识呢？我该怎么找到我需要的东西？问前端工程师？找 CSS？ Web？

#Bitcron #DIY #模板
@2017-04-10 19:06
Comments
Write a Comment
  • 依韵 reply
    2017-04-11 22:09:59

    我觉得你才厉害。我自己在搞，但是没有很具体的目标，也没有很多时间，一直在搁置。看你的这个有不少我可以照着做了。

  • kmt007 reply
    2017-04-12 10:31:23

    1. bitcron的next和fexo主题就是浮动toc样式的。如果你的文章很长，有很多标题，你可以在meta里写上 app: markdown（你可能必要在文章内加上返回首页的链接） 。参考：https://www.mkyos.com/post/notes/zhaji20170221

    2. classicfy模板（包括其他模板）首页可以设置显示字数，也可以设置显示全文。在 index.jade 里：

    newest_post.content.opening or newest_post.content.limit(180)

    修改为 newest_post.content 就可以了。

    3. Casper是ghost的默认模板，但我认为是很丑的设计，太浮夸了。

    4.非常佩服博主自学的尽头，但我觉得bitcron定制性不强，适合专注文字的人，博主不妨折腾下wordpress。在wordpress下，这些都不是问题。https://wordpress.com/themes/free

    5. 另外，时不时到博主这里来看有没有新文章啊。

  • 哈比 reply
    2017-04-17 17:49:21

    @kmt007

    1. 第一个技能 get，它是 wiki 的 Fit 目录结构~我喜欢！

    2. 我没找到在哪里修改 index.jade... www.liaoyuqin.com/template/status 进入之后倒是看到了它，但是不能编辑

    3. 哈哈，所以没有用~~ 我是想自由地搭配图片，(⊙v⊙) 现在这个模板，没几张图片，好素哦

    4. 不要~我就喜欢 Bitcron~

    5. 其实每天有很多想法，但是我写文章耗时太久，不能做到日更哦。我也常去你那里看的╭( ･ㅂ･)و ̑̑

  • kmt007 reply
    2017-04-18 09:08:51

    @哈比 你要在bitcron的后台打开文件管理器，找到template文件夹，里面有index.jdae啊。

  • Mr dot reply
    2017-09-03 18:40:47

    details 标签 在 Markdown 文件里直接用吗？

    我记得以前都能用的。今天再用却不行了

    • 哈比 reply
      2017-09-18 01:06:03

      @Mr dot, 可以用啊，我是在 MarkEditor 里编辑的，在预览页面和真实发布到网页上的文章，都能展开 details

  • 水八口 reply
    2017-10-18 12:03:00

    想要修改Bitcron的主题模板，要用到HTML、CSS和一部分JS，并且熟悉Bitcron的API。没有捷径，只能学啦。把W3Schools上的教程学一下，再看一下api.bitcron.com。

    最近我在写[Bitcron主题制作系列教程](https://blog.shuiba.co/bitcron-themes-making-tutorial)，可能能够帮助你多理解一些Bitcron主题模板文件的机制吧。

    • 哈比 reply
      2017-10-26 15:41:20

      @水八口 谢谢小姐姐！