Leanote官方博客

很多朋友都反应为什么leanote笔记里的markdown预览效果和博客的效果不同, 这, 说来话长, 都怪life, 他没时间升级. 还好他昨天通宵把这个问题解决了. 以后别怪他了(当然有问题还是得怪他的).

新的解析器与笔记内的markdown解析器一样, 支持Latex公式, 流程图, Toc.

Leanote博客主题全部都升级, 可以通过重新安装主题使用该功能.

如果你自定义了主题, 那么通过简单的修改就可以快速升级, 方法:

编辑主题的post.html, 在相应代码修改成:

{{if $.post.IsMarkdown }}
<script src="http://leanote.com/public/libs/md2html/md2html.js"></script>
<script>
var content = $.trim($("#markdownContent textarea").val());
md2Html(content, $("#content"), function(html) {
    $("pre").addClass("prettyprint linenums");
    prettyPrint();
    initNav();
    weixin();
});
</script>
<!-- 不是markdown -->
{{else}}
<script>
$(function() {
	initNav();
	weixin();
});
</script>
{{end}}

核心代码为:

1. 首先加载 http://leanote.com/public/libs/md2html/md2html.js 

2. 然后调用 md2Html方法将markdown文本渲染到#content中.

<script src="http://leanote.com/public/libs/md2html/md2html.js"></script>
<script>
var content = $.trim($("#markdownContent textarea").val());
md2Html(content, $("#content"), function(html) {});
</script>

想要看效果? 这里有最全的markdown效果展示

leanote博客模板的语法是golang模板语法, golang模板语法简洁, 很快就会上手, 大家可以参考leanote自带的主题模板.

一些最基本的用法:

• 输出: {{$.blogInfo.UserId}} 表示输出blogInfo.UserId变量, 比如 <span>{{$.blogInfo.UserId}}</span>
• 判断: {{if $.blogInfo.OpendComment}} 为真的处理 {{else}} 为假为处理 {{end}}
• range循环: {{range $.posts}} {{.Title}} {{end}} range循环输出所有文章标题
• 调用函数: {{$.post.CreatedTime|datetime}} 使用datetime函数来模式化时间, 会输出类似 2014-11-5 12:33:22 的数据

关于golang模板更多信息请查看 "golang模板语法帮助"

模板组织结构

标准的leanote主题模板组织结构如下, 其中header.html, footer.html, paging.html, share_comment.html, highlight.html 这些仅供其它模板引用, 可以不需要.

• theme.json 主题配置 [必须]
• header.html 头部模板, 供其它模板引用
• footer.html 底部模板, 供其它模板引用
• index.html 首页 [必须]
• cate.html 分类页 [必须]
• post.html 文章详情页 [必须]
• archive.html 归档页 [必须]
• single.html 单页 [必须]
• share_comment.html 分享与评论页, 供post.html引用
• highlight.html 代码高亮页, 供其它页面引用, index, cate, search, tag_posts, post
• paging.html 分页, 供其它模板引用
• tags.html 标签列表页 [必须]
• tag_posts.html 标签文章页 [必须]
• 404.html 错误页 [必须]
• style.css 样式
• images/ 图片文件夹
• images/screenshot.png 主题预览图

公用变量

公用变量表示在每个页面都可以使用的变量