> ## Documentation Index
> Fetch the complete documentation index at: https://foliant-help.iforiti.com/llms.txt
> Use this file to discover all available pages before exploring further.

# 编辑模板代码

> 在代码编辑器中编辑模板的 Liquid、HTML 和 CSS，插入订单字段，使用变量参考并修复代码错误。

代码编辑器让您完全掌控模板。模板由 HTML 和 CSS 以及 Liquid 组成，Liquid 是 Shopify 使用的同一种模板语言：`{{ order_name }}` 会打印订单名称，`{% for line_item in line_items %}` 会为每个商品重复一次。Foliant 的订单变量与 Shopify Order Printer 的一致，因此为其编写的模板大多可以直接使用。所有套餐都提供代码编辑器。

## 打开代码编辑器

在编辑器中打开模板，然后点击**代码**标签。代码模板会直接在这里打开。对于可视化模板，您首先会看到编译后的代码；点击**编辑代码**即可修改。请参阅[在可视化和代码模式之间切换](https://foliant-help.iforiti.com/cn/template-editor/visual-and-code-modes.md)。

左侧窗格有三个标签：

| 标签 | 显示内容 |
| - | - |
| **代码** | 模板代码，带语法高亮。当前行和列显示在底部。 |
| **Liquid 变量** | 您可以使用的变量和过滤器，按组排列（常规变量、行项目详情、客户详情…），并提供**搜索参考**。 |
| **元字段** | 如何打印订单、客户、产品和多属性的元字段。请参阅[模板中的元字段](https://foliant-help.iforiti.com/cn/template-editor/metafields.md)。 |

右侧窗格是实时预览。您停止输入后不久，它就会更新。

## 插入字段

1. 将光标放在字段要插入的位置。
2. 点击**插入字段**。
3. 在**搜索字段**中搜索字段（例如“tracking”或“SKU”），然后点击它。

Foliant 会在光标处插入对应的 Liquid，例如 `{{ shipping_address.city }}`。行项目字段（如 `{{ line_item.sku }}`）只能在行项目循环内使用：要插入循环本身，请插入**行项目**。

## 搜索代码

点击**插入字段**旁边的搜索按钮（或在代码中按 ⌘F / Ctrl+F），即可在模板中查找文本。

## 代码错误

编辑器会在您输入时检查代码，并在边栏中标出问题：

* **错误**会阻止您保存并暂停预览。未闭合的 `{{` 或 `{%` 属于错误。错误会列在编辑器上方的**代码错误**横幅中，每项都带有**跳转到该行**。
* **警告**指出可能有误但不会阻止保存的内容，例如未知的 Liquid 过滤器、标签或对象，未知的 HTML 标签或 CSS 属性，或未闭合的 HTML 标签。

保存时，Foliant 也会检查模板：Liquid 必须可解析，HTML 标签必须成对，内联 SVG 只能包含绘图元素。如有问题，保存会失败，并显示**更新失败**横幅，列出最多五个问题，并在已知时注明行号。

如果模板已保存但预览无法渲染，横幅会显示 Liquid 的提示信息，并在已知时显示行号。

## 编写优质模板

* 金额以分为单位：请始终使用金额过滤器打印，例如 `{{ total_price | money }}`。请参阅[模板中的金额和币种](https://foliant-help.iforiti.com/cn/template-editor/liquid-money-and-currency.md)。
* 对客户输入的文本（如备注和地址）使用 `| escape`：`{{ note | escape }}`。
* 使用 `{{ 'subtotal' | t }}` 让文字跟随文档语言。请参阅[日期、语言和翻译](https://foliant-help.iforiti.com/cn/template-editor/liquid-dates-and-languages.md)。
* 使用 Foliant 内置的增值税代码片段：`{% include 'vat_breakdown' %}` 打印增值税明细表，`{% include 'legal_notes' %}` 打印法律说明（反向征税、出口、IOSS…）。

## 须知

* 如果带编号的模板（发票、贷项通知单或报价单）没有在任何位置打印 `document_number`，Foliant 会在文档末尾添加一小行显示编号。请参阅[模板中的文档编号](https://foliant-help.iforiti.com/cn/template-editor/liquid-document-numbers.md)。
* 代码模板的页码和重复表头设置位于模板设置页面的**页面布局**下。
* 要从 Shopify Order Printer 或 Order Printer Pro 迁移模板，请在“模板”页面使用**导入模板**。请参阅[从 Order Printer 导入模板](https://foliant-help.iforiti.com/cn/templates/import-from-order-printer.md)。

## 相关文章

* [订单对象和常用变量](https://foliant-help.iforiti.com/cn/template-editor/liquid-order-variables.md)
* [Liquid 过滤器](https://foliant-help.iforiti.com/cn/template-editor/liquid-filters.md)
* [在可视化和代码模式之间切换](https://foliant-help.iforiti.com/cn/template-editor/visual-and-code-modes.md)
* [预览、纸张尺寸和缩放](https://foliant-help.iforiti.com/cn/template-editor/preview-paper-and-zoom.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.