<label for="{{ formId }}-phone">{{ 'contact.form.phone' | t }}</label>
<input type="tel" id="{{ formId }}-phone" name="contact[{{ 'contact.form.phone' | t }}]" pattern="[0-9\-]*" value="{% if form[phone] %}{{ form[phone] }}{% elsif customer %}{{ customer.phone }}{% endif %}">
<!--关注微信公众号「Shopify插件服务」-->
<label for="{{ formId }}-order">{{ 'contact.form.order' | t }}</label>
<input type="text" id="{{ formId }}-order" name="contact[{{ 'contact.form.order' | t }}]" value="{% if form[order] %}{{ form[order] }}{% elsif customer %}{{ customer.order }}{% endif %}">
这里代码简单解释一下
里面contact.form.phone里面的phone是我们定义的一个内容的名字，你可以自定义任何内容，bepei.com都可以。但是改了的话，后面其他phone也要全部改成bepei.com，相信有一点html基础的人都知道吧。
pattern="[0-9\-]*"这个是一个参数校验，通过正则表达式来让用户输入的内容全部都是符合要求的。比如这里0-9就是必须输入全是数字。正则表达式还有很多用法。有机会再讲解一下。
到这里点击保存以后，页面上就会有相应的表单出来了。
但是这里会有一个错误translation missing: zh-CN.contact.form.order，意思是在ZH-CN这个语言包里面，没有找到order。很简单，只需要修改一下语言包就行。
同样在代码里面，找到Locales这个文件夹，里面找到zh-CN.json这个文件，在如下位置，增加你自定义的名字即可。比如我自定义的是order，那我增加的就是order。保存发布即可。
如下图，订单编号已经显示出来了。
提交一个资料，看是否能接收到邮件。
有任何问题，欢迎联系我，也可以评论留言。
做应用开发，只要涉及到前台页面的展示，HTML 代码是跑不掉的。插入 HTML 代码本身是一件很简单的事情，Shopify 插件的开发跟其他系统开发有一些不一样，因为每一个 Shopify 店铺都有不同的模板，我们也没法去更改 Shopify 独立站店铺的模板代码。今天就来讲一下，怎么向插件怎么去影响页面的展现。
以下内容是接着上一篇《Shopify插件开发基础篇-获取店铺信息》。如果不知道下面变量都是怎么来的，建议先阅读前一篇文章，或者给我留言也行。
首先，一个 Shopify 独立站可能会安装多个模板，所以我们需要获取到站点的模板列表。
$shopApi = $shop->api();
$themes = $shop->api()->rest('GET', '/admin/api/2021-01/themes.json');
dump($themes);
细心的同学会发现上面有一个2021-01，这其实是 Shopify 的一个接口版本，它是接口地址的一部分。
如下图所示 themes数组里面就是当前我测试店铺的模板。
第一步，在开始撸码之前，我们先要获取应用的 API 秘钥
第二步，撸码这件事我一贯的原则是不重复造轮子，工具在无明显缺陷情况下，一定使用第三方工具。所以我们当然用第三方的工具。
这里我是用的是 PHP 语言的 Laravel 框架进行开发。如果你也是使用 PHP 语言但是其他框架，可以在 https://packagist.org/?query=shopify搜索相应的工具来辅助开发。
composer require osiset/laravel-shopify
（更多…）
