Shopify联系页面表单增加栏位方法
注意:Shopify联系页面表单效果因为主题不同形式可能不同
增加1个国家country栏位为例
路径:后台-Online Store-Themes-Edit code编辑主题代码
直接搜索 contact找到相关页面(不同主题文件位置不同)
找到控制的文件,参考上面的复制然后修改成想加的栏位名称country(修改文件之前先做好备份)
注意类型不同(输入类型 数字类型 邮件类型)
添加完前台出现报错(还需要再修改一个文件)
Locales文件夹中
代码中搜索下contact,添加栏位label
前台显示正常。
要下把某个栏位设置 为必填项 <input type= 需要增加 required
<div class=”form-group”>
<label for=”inputName”>{{ ‘contact.form.phone_label’ | t }}</label>
<input type=”tel” name=”contact[phone]” pattern=”[0-9\-]*” class=”form-control” id=”inputSubject” placeholder=”{{ ‘contact.form_field.phone’ | t }}” value=”{% if form[phone] %}{{ form[phone] }}{% elsif customer %}{{ customer.phone }}{% endif %}” required>
</div>
前台lable也需要给客户注意标注上必填星号
前台效果增加了※,如果不填写点击提交按钮会提示填写此栏位。
如果嫌麻烦可以使用APP,不过现在APP都是收费的,仅仅是提供免费版,当然功能必然会进行限制。
插件名称:
Pify Form Builder‑Contact Form
插件地址:
https://apps.shopify.com/pify-form-builder
免费版不限制提交次数,限制栏位数量和表单个数,提交联系一般都是为了客户少填写栏位尽快联系,这个就能满足要求(注意有些APP免费版限制的是提交次数)
如果为了省钱选择免费版注意擦亮眼,这种都不需要尝试。
插件演示: