创建Shopify订单号查询（track order）页面

Shopify店铺如何设置Page让用户查询追踪订单？

从而实现用户输入卖家给的订单号，买家能够实时追踪订单，而不用跳转到第三方查询。

效果类似下方：

前言

设置shopify用户查询订单，都需要通过https://www.17track.net/en 网站，该网站支持查询全球 1500 多家承运商和 120 多家航空公司。

本文有两种创建shopify店铺订单号查询页面的方法：

一种是通过shopify的APP，需要付费。

另外一种是通过代码，免费的。

方法一：通过APP-收费

APP名字叫17TRACK Order Tracking，有14天的免费试用。

该APP收费如下：

安装好APP，只需要遵循APP的指导安装即可，不同的费用解锁不同的服务内容。

方法二：通过代码-收费

我更推荐通过代码自己创建，毕竟免费，难度也不大。

1. 在shopify后台创建一个page: Track My order

1. 按照下方点击，将编辑区转成html编辑格式：

1. 将以下代码复制进“内容”中

复制以下代码：

<div style=”margin-top: 100px; margin-bottom: 100px;”><!–Tracking number input box.–> <input class=”Form__Input” type=”text” placeholder=”Enter your number” id=”YQNum” maxlength=”50″ style=”width: 100%; height: 57px;”> <!–The button is used to call script method.–> <input class=”Button” style=”background: #000; border-radius: 0; width: 100%; height: 50px; margin-left: 0px; color: #fff;” type=”button” value=”TRACK” onclick=”doTrack()”> <!–Container to display the tracking result.–>

<div id=”YQContainer”></div>

<!–Script code can be put in the bottom of the page, wait until the page is loaded then execute.–> <script type=”text/javascript” src=”//www.17track.net/externalcall.js”></script> <script type=”text/javascript”>// <![CDATA[function doTrack() {

var num = document.getElementById(“YQNum”).value;

if(num===””){

alert(“Enter your number.”);

return;

}

YQV5.trackSingle({

//Required, Specify the container ID of the carrier content.

YQ_ContainerId:”YQContainer”,

//Optional, specify tracking result height, max height 800px, default is 560px.

YQ_Height:560,

//Optional, select carrier, default to auto identify.

YQ_Fc:”0″,

//Optional, specify UI language, default language is automatically detected based on the browser settings.

YQ_Lang:”en”,

//Required, specify the number needed to be tracked.

YQ_Num:num

});

}

// ]]></script></div>

1. 最后保存，同时点击“查看页面”，效果如下，创建完成

最后

根据上面的操作，用户在框内输入订单号，就可以直接追踪到物流信息，而不用跳转到第三方。

赶快动手用起来吧！

给自己的shopify独立站也安装一个！