透過 Dreamweaver UltraDev 和 PayPal 快速拓展電子商務


作者:Joel Martinez 與 Ray West (www.basic-ultradev.com)

本文說明如何使用免費的伺服器行為整合 UltraDev 和PayPal,以解決三個線上銷售的常見問題。PayPal 擴充套件伺服器行為係由 Shore Computers 的 Mike Ahern 提供 (http://www.shorecomp.com/ultradev/paypal/default.asp)。此套裝軟軟為免費提供,但是如果你使用他的產品,我們希望你透過 PayPal 系統提供捐款。

即使沒有此伺服器行為套件,只要你具備 HTML 的知識就可以使用 PayPal 購物車。如果你會剪下並貼上文字,即使沒有此擴充套件,你也能輕鬆地利用此功能。不過,此套件完全與 UltraDev 結合,可為你提供容易上手的用戶介面。以下三個範例將教導你如何在三種常見類型的交易中使用 PayPal 系統:
  • 購買單件物品使你能夠在拍賣類型的設定中銷售單件物品。
  • 簡易購物車使你能夠設定在單筆 PayPal 交易中購買多件物品。
  • 這套資料庫導向的購物車使你能夠設定存貨系統,可以從資料庫機動地管理該系統並將該系統傳送到你的頁面。

使用 PayPal 建立電子商務網站


使用 PayPal 建立電子商務網站應該是最容易實施的解決方案。對於預算吃緊的專案而言,此方式能夠縮短開發時間,因此極具吸引力。當然,這中間也有一定的取捨。由於所有動態購物車都在快顯視窗中進行,而不能在購物車上包含你的標誌,因此自訂的空間相對有限。儘管如此,因為大多數的網站不需要能完整自訂的用戶介面,所以使用此系統仍可享有極大的好處。由 PayPal 製作的慣用介面能讓消費者提高信心。

這是一個擴充套件,其中有許多伺服器行為,每種行為具有略微不同的功能,但是,這些伺服器行為之間仍有部分的共通點。
  • PayPal 電子郵件 - 每個伺服器行為都會要求你輸入用於 PayPal 帳戶的電子郵件,如果你要透過你的帳戶開展業務,你一定要選擇商業帳戶。
  • 靜態/動態欄位 — 幾乎每種伺服器行為都使用欄位,允許你從 UltraDev 資料繫結視窗選擇物品或使用靜態值。你只需要記住:使用靜態值必須用雙引號。(即 "5.00")
  • 款項 — 所有金額欄位必須用 "xx.xx"格式。如果你從資料繫結面板為其中一個欄位分配值,請確保使用上述格式。你可以使用 UltraDev 的內建功能為此值指定一個格式配置。

圖 1:資料繫結面板指定貨幣格式。
  • URL 欄位 — 有些伺服器行為會要求你提供標誌 URL,或在交易處理後引導用戶前往的位址。你必須使用絕對 URL,亦即必須納入 http://www.你的網域.com。
伺服器行為

此套件提供以下的伺服器行為,可讓你與 PayPal 功能連接介面。
  1. 單次購買行為
    套用至圖片或文字時,此伺服器行為會建立一個連結,直接通往 PayPal 結帳畫面。該行為功能可讓你建立諸如「立即購!」的連結。對於僅出售單一產品或服務的網站而言,此功能十分便利。
  2. 你的購物車行為
    如果你決定使用其他購物車解決方案(例如,UltraCart II),你仍然能夠使用 PayPal 提供的服務接受產品的付款。你唯一需要提供的資料(PayPal ID 和部分 URL 除外)就是訂單號碼和總銷售金額。此項資料在收集上十分容易,而且只需傳輸至簡易的用戶介面即可。
  3. 新增物品到購物車行為
    這應是可獲得最大效益的伺服器行為。新增物品到購物車行為能輕易地與物品的資料庫顯示畫面整合,讓客戶能在購物時將物品加到購物車中。無論何時按下已產生的連結,將會出現快顯視窗整齊地顯示你購物車中的內容。用戶之後可從此畫面進行結帳,並於結帳時登入 PayPal 帳戶或輸入付款資料。
  4. 檢視購物車行為
    與「新增物品到購物車」行為共用,若按一下「檢視購物車」伺服器行為產生的連結會出現快顯視窗,顯示你購物車中的內容。你唯一需要提供的資料是你的 PayPal 電子郵件 ID。
  5. 捐款行為
    此伺服器行為產生的連結會將用戶帶入一個畫面,用戶可在該處使用自己的 PayPal 帳戶付款給你。這個方法可以讓銷售共用軟體人士或者非營利性組織受益,因為這個方法使你能夠從你的網站接受款項,而不用受特定的購買行為約束。
  6. 訂閱行為
    提供以訂閱方式存取內容的網站將受惠於 PayPal 所提供的這項獨特服務。註冊訂閱服務的用戶將收到 PayPal 所寄的定時定額每月結單。款項直接存入你的 PayPal 帳戶,每次付款你都會收到一封電子郵件通知,讓你知道用戶續訂。此伺服器行為產生的連結會顯示快顯視窗,要求用戶輸入付款資料。

PayPal 套件的實用應用軟體


有兩種一般的方案涵蓋了目前網路中的多數電子商務方案方案。單次購買近似於拍賣模型,亦即賣家僅提供單一物品,物品售出即告完成。購物車模型則涉及銷售多件物品,或是物品的多份副本。下面三個範例分別是:使用 PayPal 服務提供單件物品銷售、使用「PayPal 購物車」的購物車以及使用第三方購物車的購物車,與 PayPal 連接介面。

我們建立了一個示範網站,網站位於 http://www.codecube.net/teksales/。請參考示範網站,查看本文列舉的範例。


圖 2:teksales 示範網站


「請給我一個」— 單件物品銷售


若你有一件物品要銷售,可利用單次購買伺服器行為。eBay 會員拍賣時都採用這項功能收款。如果你的網站銷售的物品不止一件,則適用其他行為。但如果是二手物品或收藏品的單品銷售,單次購買伺服器行為便是迅速好用的選擇。

想像一下,你已經擁有現今最熱門的摩托車,Ducati Monster S4Fogarty。有一天,當你正在路上奔馳,突然間有人變換車道闖入你的正前方。你的生命處於千鈞一髮的生死關頭,之後你每次騎乘時就覺得心驚膽顫,最後你再也受不了了。於是你決定在你的網站上把車賣掉。你可在 Ultradev 上迅速設計好,將其張貼到你的網站上。


圖 3:Ducati 銷售網站...預先 SB

在你的想像中,人們會在郵件信箱前排隊,搶著要將買下這部街頭火箭的款項寄給你,可惜這種情況並沒有發生。這種情況可歸咎於各種原因。可能是因為價格高於大家所能負擔的範圍。

使用單次購買伺服器行為

使用單次購買伺服器行為非常簡單。你的網頁設計完成後,只需要選擇頁面上的物件作為購買按鈕。你可以選擇使用「購買」的圖片,或是傳遞類似資料的一些文字。反白物件並套用伺服器行為。你可以在 PayPal > PayPal「單次購買」下的伺服器行為調色盤中,找到單次購買伺服器行為。



圖 4: pp_SinglePurchase

填寫伺服器行為介面的欄位,然後就完成了。當用戶點選該行為產生的連結時,即會顯示包含收款資料的快顯視窗,讓用戶進行結帳程序。你將從 PayPal 接收到已完成銷售的確認資料,然後你就可以著手將你的摩托車裝箱,放入當地郵局的包裝中。


「每個都來兩樣」— 簡易購物車


單次購買銷售在當今的網路交易中占很大的比重,特別是在線上拍賣的風潮盛行之後。但是,如果網站要長久經營,則會面臨到其他問題。他們經常刊登各類物品,希望客戶能從存貨中購買多種物品並重複購買。

言歸正傳,我們繼續來討論你這位賣摩托車的後起之秀。你的 Ducati 銷售使你意識到摩托車相關商品有巨大需求,所以你決定建立線上業務,提供此類商品。新的 PayPal 線上支付方案使你的業務蓬勃發展。你透過網站轉售摩托車使你獲得了可觀的利潤,但你並不滿足,你開始銷售一些與摩托車相關的產品,例如頭盔和護目鏡。這是很簡單的概念,但是你無法繼續使用相同的解決方法。你每週逛沃爾瑪的時候,會將一罐去污劑與牛奶和雞蛋一同放入購物車,這時,你突然意識到該怎麼做了。你也需要一輛購物車。

簡而言之,線上購物車讓你的訪客能在一次交易中購買多種物品。當客戶在瀏覽網站選購商品時,購物車可以使用工作階段變數、Cookie 和資料庫等方式「記住」你挑選的物品。客戶決定結帳時,他們只需輸入付款資料即可訂購所需的全部物品。

使用 PayPal 購物車

使用購物車伺服器行為與單次購買行為非常類似。但是,由於此行為是用於購物車,因此有多個明顯的不同點。首先,購物車提供客戶選擇特定物品數量的選項,如兩對手套或三個皮褲修補包。另外,執行按下購買按鈕的操作就可將物品加到購物車,方便用戶繼續購物,不需要立即輸入付款資料。

若要在你的物品中套用伺服器行為,只需反白你頁面上的物件或文字,然後在伺服器行為面板中的「PayPal」>「PayPal 新增物品到購物車」選擇「加到購物車伺服器行為」。在你的網站上對每件物品重複進行以上操作。



建立的連結會在 PayPal 購物車系統上出現新的快顯視窗,顯示你新增的每個物品。如果你按一下同樣物品兩次,數量就會增加一倍。這是此情況下客戶比較喜歡的方法,因為購物者購買產品時希望儘可能減少動手次數。因此,即使你讓客戶少按幾下滑鼠,他們也會很高興,而客戶心情一好,就會購買更多的物品。

透過資料庫導向的購物車使用 PayPal


前述範例是非常好的練習,有時候你會遇到類似的情況,這個時候,你只需要非常基本的 PayPal 功能即可。但是,若要發揮本擴充套件的完整能力,則需要搭配資料庫導向的庫存解決方案。使用資料庫管理產品時,你必須先需要花點時間進行開發,但是在減輕後續維護和管理負擔上的好處絕對值回票價。如果建構方式正確,你網站的運作就會像自動導航般,不需你費心。

資料表結構

建立此類網站最耗時的部分就在資料庫本身。實際整合 PayPal 購物系統並不麻煩。針對此處的討論,我們將採用上層/下層 — 主要/詳細資料結構進行。整個網路中 99% 的資料庫使用此資料庫結構。如果你需要有關此專案資料庫部分的說明,這個網站上許多資源都可為你提供協助。

對於上層表格中的每一列,在下層表格中都有 0 到多列的對應,在電子商務網站的環境中,這表示我們將把類別表格作為主表,而產品表格作為子表。部分資料隸屬特定類別的範例:

TV 類別
- Sony 20"
- RCA 19"
- Magnavox 32"

VCR 類別
- Panasonic 雙磁頭 (Two Head)
- Samsung 四磁頭 (Four Head)

首先要用下列欄位定義「類別」表格:
  • catID - 自動編號
  • catName - 文字
你可以看到,主表格通常不需要包含許多資料,因為主表格只是組合管理子表格中的眾多列。此表中可能包含的其他資料如下:
  • 延伸說明
  • 類別圖片
  • 表示此類別目前是否有效的作用欄位
此表格可以用於列出你網站上所有物品類別的頁面。客戶可以選擇類別,並查看每一類別中的產品詳細資料。

接下來,我們需要產品表格。產品表格用來記載個別產品的資料,因此必須設有「新增物品到購物車行為」對應項目的欄位。
  • itemID - 自動編號
  • catID - 數字
  • itemName - 文字
  • amount - 貨幣
  • shipping - 貨幣
  • handling - 貨幣
如果你不使用某些欄位(例如,不收運費和處理費),你可以填入 0。

和類別表格一樣,為求簡潔,我們儘量少用欄位。其他可用欄位:
  • 新增日期
  • 有效
  • 頁面外觀

圖 6: tekDB_relationship
兩表的關係示意圖

建立資料庫結構後,請將測試資料填入表格中。此資料稍後可替換為產品資料。首先,建立數個類別。



圖 7: tekDB_catTableContents

請注意,任何類別都只是下層產品的邏輯容器。設定產品表格中 "catID" 數字欄位的產品類別 "catID" 後,即可建立類別表格與特定產品的關係。你也可建立更為複雜的表格結構以處理多種類別的產品,但現在先不作介紹。


圖 8: tekDB_ProductTableContents


顯示資料

一旦資料庫擁有你可以使用的資料,下一步就是將這些資料放到網頁上。本示範只有兩頁:顯示所有類別供用戶選擇的主要頁面,以及顯示所選類別中全部物品的詳細資料頁面。

首先建立一個用戶介面的 HTML 表格。使用 2 x 2 大小的表格即可。第一列是簡單的標題,顯示下方欄中的內容;第二列是保存紀錄集輸出的地方。建立選自表格中類別名稱和 ID 的紀錄集。

將類別名稱從資料來源面板拖至第二列的第一欄。第二欄為「檢視」連結。

若要建立檢視連結,首先反白文字並使用屬性檢查器找出顯示產品的頁面。按一下資料夾圖示,你會看見你網站內現有頁面的清單。選擇產品頁面,然後按一下對話方塊下方的「參數」按鈕。在「參數」視窗中,你可以建立一個名為 catID(在產品紀錄集中用於篩選)的 URL 參數,並透過使用閃電圖示選擇 catID 欄位,以從資料庫指定數值。現在按一下類別的「檢視」,相應的 ID 就會傳到 URL 字串的產品紀錄集中,因此只有此類別中的產品會顯示在從頁中。一旦完成上述過程,你可以將重複的區域伺服器行為新增到第二列中。

現在類別頁面已順利完成,下一步是建立詳細資料頁面。我們知道進入此頁面的用戶皆來自類別頁面,因此在查詢字串中會有 catID。因此我們先建立一個擁有表格中所有欄位的紀錄集,並從利用 request(「catID」)的查詢字串所產生的值來篩選 catID。


圖 9: tekDB_categoryRS

此表格的用戶介面擁有完全相同的配置(除了多出價格欄之外)。將物品名稱拖到第一欄,價格拖至第二欄,然後在第三欄中輸入「加入購物車中」。反白「加到購物車」文字,然後在「伺服器行為」浮動視窗中選擇「加到購物車伺服器行為」。用戶介面大部分欄位的文字方塊旁皆有小型的閃電圖示。這些標誌使你可以透過在「資料來源」視窗中建立的紀錄集,以資料庫中的欄位填入這些欄位。請為伺服器行為的個別對應項目選擇資料庫欄位。完成之後,你可以將重複的區域新增到第二列。在執行階段中將產品填入資料庫的頁面時,每一「加到購物車」執行個體即可附加適當資料。每件按下滑鼠購買的物品將使用你輸入的資料更新購物車。現在,無需編輯你的 HTML 頁面,即可在資料庫中對物品進行維護。


圖 10: tekDB_Addtocart

全部到此結束。客戶現在可以瀏覽你的物品類別,選擇要購買的物品然後完成交易。PayPal 套件的特點之一為應用軟體開發迅速,使其成為絕佳的電子商務幫手。其他購物車系統則需要漫長的時間進行開發,而且無法徹底解決收款的問題。本段示範為使用 Dreamweaver UltraDev 及 PayPal 擴充套件在一個小時內完成。

本文章節錄自 Ray West、Tom Muck 和 Joel Martinez 合撰新書「UltraDev 電子商務概念:下一步」。如需了解有關 UltraDev 和電子商務的更多資料,請到 www.basic-ultradev.com 查看 Basic UltraDev。在網站中可找到關於我們的書籍、教學課程以及擴充套件資料,能讓你大大提高網路開發能力。

免責聲明:上述內容不是由 PayPal, Inc. 或其任何合作夥伴、子公司提供,而是由每篇文章各自的作者提供。本文章可能含有錯誤,PayPal 不為其內容背書或提供支援。PayPal 建議你如有疑問,或者想了解有關技術支援、擔保或授權使用的資料,請與文章的作者直接聯絡。如果你選擇相信這些文章的內容,請自行承擔風險。若你因相信此內容而導致任何錯誤、傷害或者其他損壞(包括任何偶然的、特別的、間接的或者衍生的損壞),PayPal 概不負責。PayPal 明示排除所有關於本內容,以及使用本內容之保證。