选中文字转图片

具体请参考 《什么是 “选中文字转图片”》 中的介绍。

其基本的原理为：

1. 选中的文字经过基本的处理后，将变量传入模板
2. 由模板渲染为 HTML 页面
3. HTML 页面保存为图片

而“选中文字转图片”的模板文件后缀为 .html，其语法为 Jinja2。

自定义模板所在位置

Step1, 在顶部菜单中， 插件 --> 文本转图片
Step2，在 step1 中打开的弹窗中，右上角有 templates 的按钮，点击即可

自定义模板文件名的特别说明： 如果以 _system 结尾，表示此为系统默认的模板，但当前的模板跟系统默认模板是不一致的(已更新、或用户已重新定义)。

构建 Interface

在自定义模板中，如果头部有 <meta name="interface"> 类型的，则会参与窗口中界面的构建。
具体可以参考 Screenshot on Device.html、getpricetag.com Cover.html、Simple Text & Image.html的源码。

注意:

1. 必须是校验合格的 JSON 格式！！！
2. interface 的 JSON 数据是一个 list 类型
3. 元素设置的每一项中，key 最终会成为当前模板被调用的 变量名。

模板文件中的 header 属性

模板文件，本质上是 html 文件，在 HTML 源码中，header 的一些属性可以决定最终图片的一些宽高、背景色。

<meta name="width" content="550">
<meta name="min_height" content="300">
<meta name="background" content="#fcfcfc">

在 HTML 的 header 部分，一般都建议增加如上几个对应 name 的 meta，其含义如下:

• width: 表示图片的宽
• min_height: 表示导出图片需要保证的最小高度
• background: 如果图片达不到最小高度，会以这个颜色填充头尾以达到最小高度

另外，header 中支持另外一个特殊的属性，为 image_type，如果 image_type 为 png，则会影响插入编辑区域图片的类型。一般情况下不明显，不建议启用。

模板接收到的变量

1，上面提到的 interface，如果有设定，则会产生对应的变量；
2，用于转义图片的文字本身，会被(独立)作为 Markdown 解析为 HTML，如果头部有 metadata 的声明，也会产生对应的变量；
3，其它固定变量。

模板接收的一些固定变量

模板中除了可以使用 metadata 声明的变量之外，还有一些固定的变量:

• html: 选中文本以 Markdown 语法最终解析后的 HTML 内容
• content: 同 html
• text: 将 html 再度转为普通文本，可以去除图片等内容
• text_lines: 一个列表，每个元素为非空的文本组成
• simple_dict: text中每行如果是 key: value 的格式，将其转为一个字典格式的数据
• plain_html: 将 text 再度转为 HTML
• images: 图片的列表，每个元素都有 src 这个属性，表示图片的 URL
• words: 选中文本的字数
• background: 界面设定中的颜色，一般用作图片的背景色填充(如果有需要的话)

建议的自定义步骤

1，先使用静态的(HTML)页面完成效果的实现；
2，再转为 Jinja 的模板语法，按需调用 images、text、text_lines 这些参数；
3，最好可以参考现有的模板，变量的调用和活用的形式相对来说，还是有限的。