Nodejs NodeBB V2MM

NodeBB 2: 定制主题

Posted by River Young on 2016-10-27

skins

也许你只是想简单的更换按钮或字体的颜色， 那么你可以使用 NodeBB 提供的皮肤。
NodeBB 的前端基于 twitter 的 Bootstrap 开发，Bootstrap 强大的社区力量提供了很多漂亮的皮肤可以选择。
Alt text

widgets

NodeBB 的主题可以包含很多 widgets area, widgets 其实是由一个个的功能模块组成，比如 recent posts, hot topics 等等，当然也可以自定义 HTML, 后台可以选择将其添加在某些页面上的某些定义好的区域，比如 主页的 footer, categories 页面的 sidebar 等等。
V2MM 就是通过这种方法在网站上添加 global footer 的。其中包含版权声明和友情链接等。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div class="text-center text-muted"  style="margin-top: 50px;">
    <div class="row">
        <span class="small">
            &copy; Copyright
            <strong>{config.siteTitle}</strong>
            <span> - <a href="https://github.com/revir/nodebb-theme-v2mm" target="_blank">theme v2mm</a></span>
            <span>- Built with Love v{config.version}</span>
        </span>
    </div>
    <div class="row">
        <em>
            Wake up, you need to make money.
        </em>
    </div>
    <div class="row">
        <a href="https://www.inog.site" target="_blank">INOG</a>
        ,
        <a href="http://blog.riverrun.xyz" target="_blank">River's blog</a>
        ,
        <a href="http://www.leyafo.com" target="_blank">Leyafo's blog</a>
        ,
        <a href="http://blog.cycleuser.org" target="_blank">Cycleuser</a>
    </div>
</div>

效果如下：
Alt text

Theme

主题是 NodeBB 的插件，在 nodebb 的插件管理器中搜索是已 nodebb-theme 作为前缀的插件。其实它的实现方式完全和插件是一样，不同的是多了一个 theme.json 和 theme.less 的配置。

theme.json 定义主题名称，目录结构等。有趣的是还可以指定 baseTheme, 这样如果你的主题没有支持某些 templates, 将会 rollback 回 baseTheme。 默认的 baseTheme 是 persona。

Theme 的开发也要 plugin.json 来指定 hooks， scripts, libraries 等。请参考开发文档。

V2MM Theme

V2MM 是我创建的一个自由职业者论坛，使用的是我自己创建的 v2mm theme， 已开源，欢迎加入 V2MM, 一起讨论学习。

FRIENDS