SlideShare ist ein Scribd-Unternehmen logo
1 von 36
Downloaden Sie, um offline zu lesen
EPAYTW 
金流串接實作教學 
使用pockii (CTBC Bank) 
"5IJOLJO7J[ 
1SPEVDU 
4FSJFT
在開始之前... 
請快速瀏覽後 
再決定是否進行操作
實作教學:串接pockii 
https://www.pockii.com/
申請pockii帳號-1 
打開瀏覽器連結至pockii (https://www.pockii.com/)
申請pockii帳號-2 
新使用者,點選註冊pockii帳戶 
點選註冊
申請pockii帳號-3 
點選「⽴立即註冊」 
選擇「一般會員」或「法人會員」帳戶類型。以下示範「一般會員」操作流程
申請pockii帳號-4.1 
⼀一個⾝身分證,僅能註冊⼀一個帳⼾戶 
填寫註冊資訊。 所有資料務必填寫真實資料,以免無法驗證款項。
申請PayPal帳號-4.2 
完成相關認證 
填寫註冊資訊。 所有資料務必填寫真實資料,以免無法驗證款項。
申請PayPal帳號-5 
點選「收款」 
pockii登入主畫面,完成帳戶申請。
製作付款按鈕 
• 在pockii帳⼾戶中將欲銷售的商品,以「網站收銀機」建檔管理,產⽣生「付款按鈕」。 
• 顧客點擊「付款按鈕」便可開始付費結帳,⽀支付的款項將匯⼊入您的pockii帳⼾戶。 
• 若欲提領款項pockii,您必須申請進⾏行「實名驗證」並「綁定帳號」 
,請詳⾒見pockii使⽤用說明- 
https://www.pockii.com/mvc/faq/qa_realName_Idx 
https://www.pockii.com/mvc/faq/qa_withdraw_Idx
製作付款按鈕 
在開始之前,您所需知道的事情... 
pockii提供兩種付款按鈕。 
1. 「簡易收款」 
顧客針對單⼀一商品,進⾏行購買與付款。顧客須有pockii帳⼾戶。 
2. 「訂購單」 
結帳⾴頁⾯面是⼀一張訂購單,可設定多種商品與⾦金額,顧客最後⼀一次結 
帳。可⽤用pockii, ATM, 信⽤用卡, 銀⾏行帳⼾戶,銀聯卡收款(以下⽰示範)
訂購單 
以訂購單⽅方式呈現結帳畫⾯面,可選購多種商品 
(以下⽰示範)
製作「訂購單」按鈕-1 
點選「網站收銀機」 
請登入pockii,從主畫面點選「收款」
製作「訂購單」按鈕-2 
點選「新增網站收銀機」 
點選「新增網站收銀機」
製作「訂購單」按鈕-3 
輸⼊入「商品名稱」 
選擇「訂購單」 
可輸⼊入訂購單說明 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-4 
輸⼊入「商品名稱」輸⼊入「訂購資訊」 
如有相似的商品資訊,可點選複製。 
例如:相機有多種顏⾊色可供選擇 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-5 
如有相似的商品資訊,可點選複製。 
例如:相機有多種顏⾊色可供選擇 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-6 
⼀一張訂購單有多種商品時, 
點選「新增⼀一筆」。可輸⼊入另⼀一項商品 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-7 
⼀一張訂購單可⽀支援多種商品販售 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-8 
設定運費,點選「新增⼀一筆」 
*不設定代表免運費 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-9 
設定運費,點選「新增⼀一筆」 
*不設定代表免運費 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-10 
設定各種物流⽅方式的運費 
設定另⼀一種物流的運費 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-11 
輸入「訂購單」相關資訊 
設定多種物流運費
製作「訂購單」按鈕-12 
設定顧客可選⽤用的收款⽅方式 
完成後,點選「下⼀一步」 
輸入「訂購單」相關資訊
製作「訂購單」按鈕-14 
「訂購單」預覽畫面 
預覽無誤後,按下 
「確認送出」
製作「訂購單」按鈕-15 
結帳按鈕的HTML 
程式代碼 
「訂購單」結帳按鈕
將「訂購單」按鈕代碼嵌入在網頁中 -1 
簡易範例網頁 
貼上「訂購單」的程式代碼 
開啟編輯器,將複製的程式代碼,貼到body.../body之中, 
想要顯示付款按鈕的位置。
將「立即購」按鈕代碼嵌入在網頁中 -2 
「訂購單按鈕」 
檢視網頁以及「付款按鈕」 
簡易範例網頁
使用「訂購單」按鈕-1 
簡易範例網頁 
點選「⾺馬上付款」 
點選「馬上付款」的按鈕
使用「立即購」按鈕-2 
導引至pockii的結帳畫面 
訂購單之 
商品資訊 
(讓顧客選擇)
使用「立即購」按鈕-3 
導引至pockii的結帳畫面 
完成後 
按下確認送出
使用「立即購」按鈕-4.1 
結帳⾦金額過⼤大時,系統出現提⽰示。 
*顧客必須申請且登⼊入pockii 
*請聯絡pockii以取得進⼀一步訊息 
導引至pockii的結帳畫面
使用「立即購」按鈕-4.2 
結帳⾦金額較⼩小時 
顧客可選擇⽤用 pockii付款 
或選擇信⽤用卡、ATM(不需pockii帳⼾戶) 
*請聯繫pockii以取得進⼀一步資訊 
導引至pockii的結帳畫面
使用「立即購」按鈕-5 
導引至pockii的結帳畫面 
填寫訂購資訊
關於實名驗證&提領帳戶 
請聯繫pockii以取得進一步資訊 
https://www.pockii.com/mvc/faq/qa_index
SEE POSSIBILITIES, ThinkinViz 
www.thinkinviz.com

Weitere ähnliche Inhalte

Mehr von Yu-Hsien Fang

2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)
2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)
2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)Yu-Hsien Fang
 
設計思維 Design Thinking (Workshop - material)
設計思維 Design Thinking (Workshop - material)設計思維 Design Thinking (Workshop - material)
設計思維 Design Thinking (Workshop - material)Yu-Hsien Fang
 
Business Model Innovation (Workshop - Business Model Canvas)
Business Model Innovation (Workshop - Business Model Canvas)Business Model Innovation (Workshop - Business Model Canvas)
Business Model Innovation (Workshop - Business Model Canvas)Yu-Hsien Fang
 
電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)
電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)
電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)Yu-Hsien Fang
 
電商網站開發 - 應用Weebly (Part 2 金流串接)
電商網站開發 - 應用Weebly (Part 2 金流串接)電商網站開發 - 應用Weebly (Part 2 金流串接)
電商網站開發 - 應用Weebly (Part 2 金流串接)Yu-Hsien Fang
 
行銷思維 Marketing Thinking: A check list to design basic marketing campaign.
行銷思維 Marketing Thinking: A check list to design basic marketing campaign.行銷思維 Marketing Thinking: A check list to design basic marketing campaign.
行銷思維 Marketing Thinking: A check list to design basic marketing campaign.Yu-Hsien Fang
 
電商網站開發 - 應用Weebly (Part 1 基礎)
電商網站開發 - 應用Weebly (Part 1 基礎)電商網站開發 - 應用Weebly (Part 1 基礎)
電商網站開發 - 應用Weebly (Part 1 基礎)Yu-Hsien Fang
 
[Ver. 1003] app m commerce
[Ver. 1003] app m commerce[Ver. 1003] app m commerce
[Ver. 1003] app m commerceYu-Hsien Fang
 

Mehr von Yu-Hsien Fang (8)

2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)
2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)
2016/12/10 HourOfCode 主辦心得/計畫 簡報 (by scratch-tw.org)
 
設計思維 Design Thinking (Workshop - material)
設計思維 Design Thinking (Workshop - material)設計思維 Design Thinking (Workshop - material)
設計思維 Design Thinking (Workshop - material)
 
Business Model Innovation (Workshop - Business Model Canvas)
Business Model Innovation (Workshop - Business Model Canvas)Business Model Innovation (Workshop - Business Model Canvas)
Business Model Innovation (Workshop - Business Model Canvas)
 
電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)
電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)
電商網站開發 - 應用Weebly (Part 3 QRcode與其他服務)
 
電商網站開發 - 應用Weebly (Part 2 金流串接)
電商網站開發 - 應用Weebly (Part 2 金流串接)電商網站開發 - 應用Weebly (Part 2 金流串接)
電商網站開發 - 應用Weebly (Part 2 金流串接)
 
行銷思維 Marketing Thinking: A check list to design basic marketing campaign.
行銷思維 Marketing Thinking: A check list to design basic marketing campaign.行銷思維 Marketing Thinking: A check list to design basic marketing campaign.
行銷思維 Marketing Thinking: A check list to design basic marketing campaign.
 
電商網站開發 - 應用Weebly (Part 1 基礎)
電商網站開發 - 應用Weebly (Part 1 基礎)電商網站開發 - 應用Weebly (Part 1 基礎)
電商網站開發 - 應用Weebly (Part 1 基礎)
 
[Ver. 1003] app m commerce
[Ver. 1003] app m commerce[Ver. 1003] app m commerce
[Ver. 1003] app m commerce
 

Kürzlich hochgeladen

哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制
哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制
哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制jakepaige317
 
educ6506presentationtc3302771-240427173057-06a46de5.pptx
educ6506presentationtc3302771-240427173057-06a46de5.pptxeduc6506presentationtc3302771-240427173057-06a46de5.pptx
educ6506presentationtc3302771-240427173057-06a46de5.pptxmekosin001123
 
泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书
泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书
泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书jakepaige317
 
EDUC6506_ClassPresentation_TC330277 (1).pptx
EDUC6506_ClassPresentation_TC330277 (1).pptxEDUC6506_ClassPresentation_TC330277 (1).pptx
EDUC6506_ClassPresentation_TC330277 (1).pptxmekosin001123
 
1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...
1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...
1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...黑客 接单【TG/微信qoqoqdqd】
 
EDUC6506(001)_ClassPresentation_2_TC330277 (1).pptx
EDUC6506(001)_ClassPresentation_2_TC330277 (1).pptxEDUC6506(001)_ClassPresentation_2_TC330277 (1).pptx
EDUC6506(001)_ClassPresentation_2_TC330277 (1).pptxmekosin001123
 

Kürzlich hochgeladen (6)

哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制
哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制
哪里可以购买日本筑波学院大学学位记/做个假的文凭可认证吗/仿制日本大学毕业证/意大利语CELI证书定制
 
educ6506presentationtc3302771-240427173057-06a46de5.pptx
educ6506presentationtc3302771-240427173057-06a46de5.pptxeduc6506presentationtc3302771-240427173057-06a46de5.pptx
educ6506presentationtc3302771-240427173057-06a46de5.pptx
 
泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书
泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书
泽兰应用科学大学毕业证制作/定制国外大学录取通知书/购买一个假的建国科技大学硕士学位证书
 
EDUC6506_ClassPresentation_TC330277 (1).pptx
EDUC6506_ClassPresentation_TC330277 (1).pptxEDUC6506_ClassPresentation_TC330277 (1).pptx
EDUC6506_ClassPresentation_TC330277 (1).pptx
 
1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...
1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...
1.🎉“入侵大学入学考试中心修改成绩”来袭!ALEVEL替考大揭秘,轻松搞定考试成绩! 💥你还在为无法进入大学招生系统而烦恼吗?想知道如何通过技术手段更改...
 
EDUC6506(001)_ClassPresentation_2_TC330277 (1).pptx
EDUC6506(001)_ClassPresentation_2_TC330277 (1).pptxEDUC6506(001)_ClassPresentation_2_TC330277 (1).pptx
EDUC6506(001)_ClassPresentation_2_TC330277 (1).pptx
 

E commerce 金流串接實作教學 (pockii)