如何使用 WooCommerce 建立遊船預訂和船隻租賃商店
已發表: 2021-08-19想像一下像馬爾代夫或意大利的阿馬爾菲海岸這樣的地方。 當您想到它們時，會立即出現在您腦海中的一件事是什麼？ 對，一望無際的大海和風景秀麗的海洋。 許多遊客會喜歡它們，這就是船、皮划艇、遊艇等水上交通工具如此受歡迎的原因！ 一個可以接受提前預訂遊船的在線預訂商店不僅是您當地觀眾的正確選擇，也是國際遊客的最佳選擇。 今天，讓我們學習使用 WooCommerce 建立一個在線遊船預訂和船隻租賃商店。
如何使用 WooCommerce 建立在線遊船預訂商店？
第一步是開始使用 WordPress 網站。 在此之後，您可以在其上安裝 WooCommerce 插件。 我們還將 Storefront 主題添加到我們的網站。 完成後，我們可以開始將我們的遊船預訂和船隻添加為 WooCommerce 產品。 如果 Storefront 不是您想要的，我們也可以推薦Astra 。 Astra WordPress 主題旨在與 WooCommerce 無縫協作，並提供您在租賃商店中尋找的速度、靈活性和功能。
將產品添加到您的商店
為了將您的產品添加到商店，您必須轉到Dashboard > Products > Add New ，如下所示：
現在，您可以在此處輸入您的遊船預訂的每一個細節。 例如，我們將我們的遊船名稱添加為Copenhagen Canal Boat Tour 。 我們還將為其添加一個產品類別，即'Boat Tour' 。
在右側，您會找到“發布”按鈕，它將在我們的商店中發布我們的產品。 在我們點擊它之前，我們將向下滾動一點以輸入我們產品的價格，並對其進行簡要描述，如下所示：
我們還將為我們的產品添加一個圖像，如下所示：
我們的乘船遊覽作為產品已準備就緒，因此我們將單擊“發布”按鈕。 以下是它在前端的顯示方式：
為預訂添加額外的必填字段
現在，我們想知道成人人數、兒童人數以及他們將參加乘船遊覽的接送目的地。 因此，我們將在前端添加一些額外的產品輸入字段，以獲取有關所有這些詳細信息的信息。
為此，我們將使用 WooCommerce 插件的產品輸入字段。
單個商店的價格為 39 美元/年，它將為您提供自定義各種輸入字段類型的能力，例如文本、文本區域、選擇、複選框、電子郵件、電話、日期選擇器、時間選擇器等！
在您安裝插件並激活其許可證後，我們將轉到我們剛剛創建的產品的編輯頁面。 當我們向下滾動時，我們會發現一個新的元框來添加我們的 Prdocut 輸入字段，其標題為'Product Input Fields Total Number' 。 在這裡，我們可以添加我們想要的產品輸入字段的數量。 例如，我們希望添加 3 個新的輸入字段，因此我們將我們的 Total Product Input Fields 選擇為 3，如下所示：
在這裡完成後，我們可以單擊“更新”按鈕。 在此之後，將出現我們的三個不同的產品輸入字段。 讓我們對它們進行更改。
我們希望添加的第一個產品輸入字段是預訂乘船遊覽的成人人數。 因此，在顯示“產品輸入字段#1 ”的元框中，我們將輸入我們的詳細信息。 我們將首先通過選中啟用框來啟用該字段。
接下來，在字段類型下，我們將選擇“數字” ，因為我們希望我們的客戶選擇一個數字。 我們將通過選中“必填”框將此字段設為必填。 最後，在標題下，我們將輸入“成人人數”。 你可以在這裡看到所有這些：
繼續前進，我們希望對我們的領域進行一些限制。 因此，在輸入限制部分下，我們將添加最小值1，因為我們希望我們的客戶選擇至少 1 位成人的預訂。 此外，我們將最大值設置為 30，這意味著可以一次性為 30 位成人預訂，但不能超出此範圍。
我們還希望為客戶選擇的輸入字段添加額外的價格。 因此，我們將通過勾選其複選框來啟用定價選項。 在Condition下，我們將選擇'Based on Number and Quantity' ，因為我們希望通過結合兩者來計算總價。 最後，我們將價格增加到 15 美元。
以下是我們添加這些設置後元框的顯示方式：
這意味著總價格將根據選擇的數量和客戶選擇的成人人數來計算。
與我們為“成人”輸入字段填充設置的方式類似，我們將為“兒童”輸入字段執行此操作。 因此，在“產品輸入字段 #2 ”中，我們將這樣輸入我們的詳細信息：
請務必注意，我們將最小值留空，因為許多客戶可能不會為兒童預訂座位。
最後，對於我們的第三個輸入字段，即“產品輸入字段 #3 ”，我們希望知道我們將從哪裡挑選客戶。 因此，對於此輸入字段，我們將類型選擇為“單選” ，因為我們希望在產品頁面上提供單選按鈕選項。 接下來，在Title下，我們將添加“Pick Up” ，如下所示：
接下來，我們將添加
配置完所有這些設置後，我們將再次單擊“更新”按鈕。
前端顯示
以下是我們的輸入字段在前端的顯示方式：
當客戶選擇他們的選項時，我們的設置將如何工作：
現在，繼續前進，我們需要我們的客戶能夠選擇日期和時間，以準確了解哪個旅遊適合他們的可用性。 我們有兩種解決方案！
解決方案 A
為此，我們可以添加更多兩個產品輸入字段，其中一個輸入字段類型是Datepicker ，而另一個是Timepicker 。 我們的 Datepicker 輸入字段將是Product Input Field #4以及一些常見設置，我們將擁有如下所示的 Datepicker 類型設置：
另一方面，我們的 Timepicker Input 字段將是Product Input Field #5 & 這裡是它的 Type 設置：
您可以為這兩個字段配置所需的特定類型設置。
前端顯示
完成後，前端將如下所示：
如果您從小規模起步並且可以確保在客戶選擇的確切時間和日期創建乘船遊覽，此解決方案可能對您有用。 但是如果您在某些預訂後尋找可以幫助您阻止日期的東西，添加船員或導遊作為資源，確保預訂時間自動調整到您客戶的時區等等，那麼您可以看看我們的第二個解決方案。
解決方案 B – 為 WooCommerce 插件使用預訂和預約插件
我們的 WooCommerce 預訂和預約插件可以將您的網站轉變為功能齊全的預訂業務。 它非常靈活，並具有廣泛的功能和自定義功能。 對於單個站點，費用為 119 美元/年。 所以，讓我們開始使用插件。
下載並激活插件後，您可以進入我們產品的編輯頁面。 然後您可以向下滾動以找到 Booking 元框，如下所示：
首先，我們將啟用預訂並選擇我們的預訂類型。 Booking & Appointment 插件提供不同類型的預訂，例如單日預訂、固定日期和時間預訂、多個日期和時間預訂、基於持續時間的預訂等。
對於我們的乘船遊覽，我們將使用“固定時間”預訂類型。
接下來，我們將轉到可用性選項卡，我們將在那裡看到的第一個設置是提前預訂期（以小時為單位） 。 此設置將允許我們輸入預訂的提前通知期。 例如，我們將輸入 12，因為我們希望僅在預訂日期前 12 小時完成此乘船遊覽的預訂。
繼續，選擇日期字段將讓我們添加從當前日期開始的預訂的最大天數。 我們將添加365 ，因為我們希望在客戶進行預訂時顯示一年的日期。
因為，我們希望我們的預訂在所有日子都可用，所以我們將保持所有日子Bookable 。 我們將所有這些天的最大預訂量設置為120 ，因為更進一步，我們還將為我們的時間段設置最大預訂量，即單日 30 個預訂量。 因此，這些設置每週都會在我們的網站上提供。
如果您願意，您可以在這些不同的日子為預訂添加不同的價格，但目前我們不會這樣做。 您可以通過啟用按日期/月份設置可用性來根據特定日期或月份提供預訂日期。 目前，我們不會啟用此設置。
相反，我們將繼續通過單擊“添加新時間段”來添加我們的時間段，如下所示：
我們希望為一周中的所有日子設置特定的時間段，因此在 Weekday 字段下，我們將選擇All 。
接下來，我們將在From和To字段下添加時間段的時間。 我們還將輸入我們接受的這些時間段的最大預訂量。
我們希望我們的時間段為上午 11 點到下午 12 點、下午 12 點到下午 1 點、下午 3 點到下午 4 點，最後是下午 4 點到下午 5 點。 所以我們將像這樣輸入詳細信息：
完成後不要忘記點擊保存更改！
如果您希望通過 Google 日曆保留您的預訂標籤，那麼您可以按照以下步驟集成插件。 然後，您可以轉到預訂元框下的集成選項卡，然後單擊 Google Calendar Sync，如下所示：
啟用集成模式並單擊Save Changes 。 完成後，您可以單擊編輯產品頁面的更新按鈕。
現在，我們希望更改預訂日期和預訂時間字段的名稱。 為此，我們將轉到儀表板 > 預訂 > 設置 > 標籤和消息，我們將在其中更改以下字段：
我們將使用出發日期而不是開始日期，而不是預訂時間，我們將使用出發時間：
我們將對產品頁面上的標籤和結帳頁面上的標籤進行此更改並保存我們的設置：
接下來，我們希望為我們的國際觀眾啟用時區轉換功能。 因此，我們將轉到儀表板 > 預訂 > 設置 > 常規設置。
我們還希望讓我們的客戶編輯他們的遊船預訂並重新安排他們。 我們將向下滾動並勾選它們的複選框，如下所示：
最後，我們將點擊保存設置並瞧！ 我們完成了。
前端顯示
以下是我們的遊船之旅將如何出現在前端：
當我們點擊出發日期時，內聯日曆的外觀如下：
在此之後，我們選擇了預訂日期為2021 年 8 月 18 日。 由於我們已將最大預訂量設置為 120，因此許多預訂量將可用，如下所示：
然後，我們將從下拉列表中選擇我們的時間。 我們使用的時間段是11:00 AM 到 12:00 PM 。 選擇後，該特定時間段的最大預訂數量將顯示為 30：
我們將像這樣填寫其他詳細信息：
然後，我們將轉到購物車頁面：
如您所見，客戶將看到“編輯預訂”按鈕。 他們也可以在結帳頁面上看到它，如下所示：
如果您的客戶點擊它，他們將可以查看這些設置，他們可以輕鬆地編輯他們的預訂日期和時間：
一旦他們下訂單，他們的訂單接收頁面將如下所示：
如果客戶轉到他們的帳戶，那麼他們可以通過轉到“訂單”部分並選擇他們的預訂來重新安排他們的預訂。 一次，它被點擊，這裡會出現：
如果您的客戶單擊“重新安排預訂”按鈕，他們將可以查看這些設置：
以類似的方式，您可以添加更多遊覽作為產品並配置適合您的必要設置。
如何使用 WooCommerce 建立在線船隻租賃預訂商店？
現在，讓我們將我們的船添加到我們的網站以供出租。 就像我們之前做的那樣，我們將首先添加我們的產品。 我們將輸入所有必要的詳細信息，例如名稱、價格、產品圖片等，然後發布我們的產品。
然後，我們將下載並激活用於 WooCommerce 的預訂和預約插件的租賃系統插件。 這是一個預訂和預約插件插件，它將為您提供專門用於租賃業務的設置。 您可以以每年 79 美元的價格購買一家商店。 您甚至可以購買更高的計劃，例如五家商店的一個- 149 美元或無限商店的一個- 249 美元。
現在，我們將轉到產品的編輯頁面並轉到預訂元框。 選擇其中的常規選項卡並啟用此產品的預訂。 這次我們的預訂類型將是多晚，這最適合出租。
這一次，我們還將看到一個名為“允許出售和出租”的新設置，我們將啟用它。 接下來，我們將選擇“租金”選項。 我們還將勾選預訂資源複選框，因為這一次我們希望將船員添加到我們的船隻租賃中。
接下來，我們將轉到可用性選項卡，我們將選擇的日期數保留為 30，將任何日期的最大預訂數保留為 10。在這裡，星期一將不可預訂。
現在我們將通過轉到“資源”選項卡來添加我們的資源。 資源是我們出租船時可以包括的那些物品或人員。
我們將在標籤字段下輸入“船員”。 對於Resources are ，我們將選擇下拉選項“Chosen by Customer”。 我們的客戶在租用我們的船時可以選擇他們可以選擇的資源。
接下來，我們將單擊“添加/鏈接資源”到我們的新資源。
我們將添加兩個新資源。 一個將被命名為“專業船長” ，而另一個將被命名為“沒有專業船長” 。 我們還將為這些資源添加價格。
但是，我們建議您不要將自己局限於為資源添加價格。 那是因為 WooCommerce 的 Booking & Appointment 插件也讓您能夠輸入每個資源的可用性。
這意味著，您可以通過從Booking > Resources轉到該資源的編輯頁面，根據日期範圍、特定日期、特定時間、天數等配置它們的可用性。
您也可以簡單地單擊垃圾箱圖標旁邊的按鈕。 這會將您重定向到該資源的編輯頁面。 目前，我們將簡單地堅持為每種資源添加價格。
我們希望在達到鎖定後的開始日期前 2 天禁用。 因此，我們將轉到“租賃設置”選項卡並將“預訂前幾天的開始日期”字段設置為 2。
我們將Book later days of end date 字段設置為 5。這是因為我們希望在達到鎖定後的 End date 之後禁用 5 天
我們還將啟用每日固定費用設置。 我們不希望允許當天預訂來租我們的船。 所以，我們會讓它保持原樣。
完成後，我們可以保存我們的設置。
在前端，我們希望更改 Check-out Date 標籤，因此我們將轉到Booking > Labels & Messages ，在Check-out Date字段下，我們將為所有頁面輸入 Return Date。
前端顯示
最後，我們可以在前端看到我們的產品，如下所示：
如您所見，標籤已更改，我們的資源也已添加。 當客戶嘗試選擇資源時，他們將在下拉列表中查看這兩個資源。
當他們嘗試預訂出發日期時，他們將可以查看內聯日曆。 因為這是我們的設置，所以星期一將無法預訂。
例如，我們決定以 8 月 24 日為出發日期。 我們的返回日期是 8 月 26 日。 加上我們的總價格如下所示：
單擊立即預訂後，客戶可以進入購物車頁面。 這是所有細節將再次出現的地方。 客戶甚至會在結賬過程中獲得“編輯預訂”選項。
最後，您的客戶的結帳頁面將如下所示！
通過這種方式，您可以添加不同的船隻作為產品並創建一個頁面，其中包含您的船隻租賃類別中包含的船隻！
結論
當您經營一家乘船遊覽和船隻租賃公司時，您有很多事情需要管理——船隻維護、旅遊預訂或門票銷售、人員配備問題等等。 必要的工具可以幫助您以更順暢、高效和專業的方式開展業務。
通過我們的 Booking & Appointment 和 Product Input Fields 插件以及我們的租賃系統插件，您將能夠簡化您的業務並創建一個成功的在線乘船遊覽和乘船租賃商店。