説明例
In this example we display a minimal custom bookings flow. Following booking confirmation, in addition to the standard confirmation email, we also send a confirmation SMS to the customer’s phone.
Twilio Integration
To send custom SMSs from our Wix site, we integrated with the Twilio service. You’ll need to create an account with Twilio and install their npm package on your site.
Secrets Manager
Once you’ve created a Twilio account, you’ll need to locate the account's SID and auth token, and store it in the Secrets Manager. Add the following secrets:
accountSID: Twilio account SID
authToken: Twilio auth token
fromPhone: Phone number you received from Twilio
どのように構築したか
ページ要素
We added the following page elements to our site:
Dropdowns for choosing the service and slot
Inputs for entering contact details, including phone number and email
Checkbox for site visitors to agree to receive an SMS
Book button for booking the service
Text elements for success and error messages
Database Collections
We used the following database collections in our site:
Bookings/Services collection: This built-in collection is automatically added to your site when you install the Wix Bookings app. We query this collection to get a list of available services.
bookedServices collection: We store the name, phone number, and number of times an SMS was sent in this collection. We use this to enforce the limit of 3 SMSs per site visitor.
ページコード
Load the services into the dropdown.
When a service is selected, load the first 3 free slots into the time dropdown.
When a site visitor fills in the form and clicks the Book button, validate the inputs, check SMS availability (less than 3 messages were sent), and checkout the booking.
When the booking is confirmed, the onBookingConfirmed event triggers delivery of the confirmation SMS.
関連例
これは役に立ったか?
|
ご意見ありがとう!
ブロック・オフ・タイム
ブッキングスタッフのカレンダーに、まとまった時間を記入する。
上級
予約 給与計算機
各スタッフの予約と収益を計算し、表示します。
上級