@@ -5,7 +5,8 @@ Ordering and checkout
55Odoo eCommerce provides several options to organize the ordering and checkout process. It offers
66different :ref: `order button <ecommerce/checkout/order-buttons >` options and sequential
77:ref: `checkout steps <ecommerce/checkout/steps >`, some of which support additional features. The
8- related buttons and checkout pages can be customized using the website editor.
8+ related buttons and checkout pages can be customized using the :doc: `website editor
9+ <../website/web_design>`.
910
1011.. _ecommerce/checkout/order-buttons :
1112
@@ -14,10 +15,9 @@ Order buttons
1415
1516To customize the ordering process in Odoo eCommerce, you can:
1617
17- - change the :ref: `Add to Cart <ecommerce/checkout/add-to-cart >` button's behavior,
18- - replace it with a :ref: `customized <ecommerce/checkout/prevent-sale >` button,
19- - add a :ref: `Buy now <ecommerce/checkout/buy-now >` button, and
20- - add an :ref: `Order again <ecommerce/checkout/re-order >` button to the customer portal.
18+ - change the :ref: `Add to Cart <ecommerce/checkout/add-to-cart >` button's behavior;
19+ - replace it with a :ref: `customized <ecommerce/checkout/prevent-sale >` button;
20+ - add a :ref: `Buy now <ecommerce/checkout/buy-now >` button.
2121
2222.. _ecommerce/checkout/add-to-cart :
2323
@@ -29,17 +29,12 @@ Default add to cart behavior
2929
3030When clicking the :guilabel: `Add to cart ` button, different actions can be triggered. To configure
3131them, go to :menuselection: `Website --> Configuration --> Settings `, scroll down to the
32- :guilabel: `Shop - Checkout Process ` section, and select one of the following options:
32+ :guilabel: `eCommerce ` section, and select one of the following options for the
33+ :guilabel: `Add to cart ` feature:
3334
34- - :guilabel: `Stay on Product Page `: The customer remains on the product's page.
35+ - :guilabel: `Stay on Product Page `: The customer can choose if they want to :guilabel: `Add
36+ to cart ` and continue shopping or :guilabel: `Go to the Checkout `.
3537- :guilabel: `Go to cart `: The customer is immediately redirected to the cart.
36- - :guilabel: `Let the user decide (dialog) `: The customer can choose if they want to go to the cart
37- (:guilabel: `Proceed to Checkout `) or if they prefer to stay on the product page
38- (:guilabel: `Continue Shopping `).
39-
40- .. note ::
41- This dialog box always appears regardless of the configuration to suggest :doc: `optional products
42- <products/cross_upselling>`, if any.
4338
4439.. _ecommerce/checkout/prevent-sale :
4540
@@ -53,9 +48,9 @@ redirects users to the default contact form.
5348 Removing the ability to add products to the cart is often used by businesses that want to display
5449 an online catalog but cannot share prices publicly (e.g., to offer custom or variable pricing).
5550
56- To do so, go to :menuselection: `Website --> Configuration --> Settings `. Under the :guilabel: ` Shop -
57- Products ` section, tick :guilabel: `Prevent Sale of Zero Priced Product `. A new :guilabel: ` Button
58- url ` field appears to enter a redirect URL.
51+ To do so, go to :menuselection: `Website --> Configuration --> Settings `. Under the
52+ :guilabel: ` eCommerce ` section, enable :guilabel: `Prevent Sale of Zero Priced Product `, and enter
53+ the redirect URL in the :guilabel: ` Button URL` field .
5954
6055Then, for all products that should display the :guilabel: `Contact Us ` button, set their price to
6156`0 ` using the product form or a :doc: `pricelist <../../sales/sales/products_prices/prices/pricing >`.
@@ -84,74 +79,76 @@ section, and configure the following:
8479
8580.. note ::
8681 - If the product has variants, either choose one or leave the option on :guilabel: `Visitor's
87- Choice `, which prompts the customer to select a variant and then to :guilabel: `Proceed to
88- Checkout ` or :guilabel: `Continue Shopping `.
82+ Choice `, which prompts the customer to select a variant and then :guilabel: `Add to Cart ` and
83+ continue shopping or :guilabel: `Go to Checkout `.
8984 - The default :guilabel: `Add to Cart ` button does not offer those options, but its label can be
9085 changed.
9186
9287.. tip ::
93- While in :guilabel: ` Edit ` mode , it is also possible to show or hide the :icon: `fa-shopping-cart `
88+ In the website editor , it is also possible to show or hide the :icon: `fa-shopping-cart `
9489 (:guilabel: `cart `) icon in the page's header. Click the header and then the
9590 :icon: `fa-shopping-cart ` (:guilabel: `cart `) button next to the :guilabel: `Show Empty ` option
96- under the :guilabel: `Customize ` tab.
91+ under the :guilabel: `Style ` tab.
9792
9893.. _ecommerce/checkout/buy-now :
9994
10095Buy now
10196-------
10297
103- To let customers choose to go to the :ref: `review order <ecommerce/checkout/review_order >` step
104- directly, you can add an additional :guilabel: `Buy now ` button. To do so, go to
105- :menuselection: `Website --> Configuration --> Settings `. Under the :guilabel: `Shop - Checkout
106- Process ` section, tick the :guilabel: `Buy Now ` feature.
107-
108- .. tip ::
109- Alternatively, enable the feature by going to any product's page while in :guilabel: `Edit ` mode
110- and, in the :guilabel: `Customize ` tab, clicking the :icon: `fa-bolt ` :guilabel: `Buy Now ` button
111- next to the :guilabel: `Cart ` options.
98+ To let customers choose to go to the :ref: `Order summary <ecommerce/checkout/review_order >` step
99+ directly, you can add an additional :guilabel: `Buy now ` button. To do so, go to any product's page,
100+ open the website editor, go to the :guilabel: `Style ` tab, and click the :icon: `fa-bolt `
101+ :guilabel: `Buy Now ` button next to the :guilabel: `Purchase Options `.
112102
113103.. image :: checkout/cart-buy-now.png
114104 :alt: Buy now button
115105
116- .. _ecommerce/checkout/re-order :
106+ .. _ecommerce/checkout/reorder :
117107
118- Re-order from portal
119- --------------------
108+ Reorder products from a previous order
109+ --------------------------------------
120110
121- You can let customers re-order items from previous sales orders from their customer portal using the
122- :guilabel: `Order Again ` button. To add it, go to :menuselection: `Website --> Configuration -->
123- Settings `. Under the :guilabel: `Shop - Checkout Process ` section, tick the :guilabel: `Re-order From
124- Portal ` feature.
111+ Customers can reorder items from a previous sales order:
125112
126- .. image :: checkout/order-again-button.png
127- :alt: Re-order button
113+ - from their customer portal, using the :guilabel: `Order Again ` button. All products from the
114+ selected order are automatically added to the cart, and customers can then :guilabel: `Remove ` any
115+ items they don't want to reorder.
116+
117+ .. image :: checkout/order-again-button.png
118+ :alt: Reorder button
119+
120+ - from the cart, by clicking :guilabel: `Quick reorder ` at the :ref: `Order summary step
121+ <ecommerce/checkout/review_order>`. Customers can then adjust quantities as needed and click the
122+ :icon: `fa-cart-plus ` :guilabel: `(cart) ` button next to the product(s) they want to reorder.
123+
124+ .. image :: checkout/cart-quick-reorder.png
125+ :alt: Quick reorder button
128126
129127.. _ecommerce/checkout/policy :
130128
131129Checkout policy
132130===============
133131
134132To allow customers to checkout as guests or force them to sign in/create an account, go to
135- :menuselection: `Website --> Configuration --> Settings `, scroll down to the :guilabel: `Shop -
136- Checkout Process ` section, and configure the :guilabel: `Sign in/up at checkout ` setting. The
137- following options are available:
133+ :menuselection: `Website --> Configuration --> Settings `, scroll down to the :guilabel: `eCommerce `
134+ section, and configure the :guilabel: `Sign in/up at checkout ` setting. The following options are
135+ available:
138136
139137- :guilabel: `Optional `: Customers can check out as guests and register later via the order
140138 confirmation email to track their order.
141- - :guilabel: `Disabled (buy as guest) `: Customers can checkout as guests without creating an account.
142- - :guilabel: `Mandatory (no guest checkout) `: Customers must sign in or create an account at the
143- :ref: ` Review Order <ecommerce/checkout/review_order >` step to complete their purchase.
139+ - :guilabel: `Disabled `: Customers can checkout as guests without creating an account.
140+ - :guilabel: `Mandatory `: Customers must sign in or create an account at the :ref: ` Order summary
141+ <ecommerce/checkout/review_order>` step to complete their purchase.
144142
145143B2B access management
146144---------------------
147145
148146To restrict checkout to selected B2B customers:
149147
150- #. Go to :menuselection: `Website --> Configuration --> Settings `, and in the :guilabel: `Shop -
151- Checkout Process ` section, enable the :ref: `Mandatory (no guest checkout)
152- <ecommerce/checkout/policy>` option.
153- #. Scroll down to the :guilabel: `Privacy ` section, go to :guilabel: `Customer Account `, and select
154- :guilabel: `On invitation `.
148+ #. Go to :menuselection: `Website --> Configuration --> Settings `, and in the :guilabel: `eCommerce `
149+ section, enable the :ref: `Mandatory <ecommerce/checkout/policy >` option.
150+ #. In the :guilabel: `General ` section of the settings, set the :guilabel: `Customer Account ` option
151+ to :guilabel: `On invitation `.
155152#. Go to :menuselection: `Website --> eCommerce --> Customers `, switch to the :guilabel: `List ` view,
156153 and select the customers you wish to grant access to your :doc: `portal
157154 <../../general/users/portal>`.
@@ -180,30 +177,31 @@ Checkout steps
180177
181178During the checkout process, customers are taken through the following steps:
182179
183- - :ref: `Review order <ecommerce/checkout/review_order >`
184- - :ref: `Delivery <ecommerce/checkout/delivery >`
180+ - :ref: `Order summary <ecommerce/checkout/review_order >`
181+ - :ref: `Address and delivery <ecommerce/checkout/delivery >`
185182- :ref: `Extra info (if enabled) <ecommerce/checkout/extra_step >`
186183- :ref: `Payment <ecommerce/checkout/payment >`
187184- :ref: `Order confirmation <ecommerce/checkout/order_confirmation >`
188185
189186.. _ecommerce/checkout/customize_steps :
190187
191188Each step can be customized using the website editor by adding :doc: `building blocks
192- <../website/web_design/building_blocks>` or opening the :guilabel: `Customize ` tab to enable various
189+ <../website/web_design/building_blocks>` or opening the :guilabel: `Style ` tab to enable various
193190checkout options.
194191
195192.. note ::
196193 Content added through building blocks is **specific ** to each step.
197194
198195.. _ecommerce/checkout/review_order :
199196
200- Review order
201- ------------
197+ Order summary
198+ -------------
202199
203- The :guilabel: `Review Order ` step allows customers to see the items they added to their cart, adjust
204- quantities, or :guilabel: `Remove ` products. Information related to the product prices and taxes
205- applied are also displayed. Customers can then click the :guilabel: `Checkout ` button to continue to
206- the :ref: `Delivery <ecommerce/checkout/delivery >` step.
200+ The :guilabel: `Order summary ` step allows customers to see the items they added to their cart,
201+ adjust quantities, :guilabel: `Remove ` products, and :ref: `reorder products from a previous order
202+ <ecommerce/checkout/reorder>`. Information related to the product prices and
203+ taxes applied are also displayed. Customers can then click the :guilabel: `Checkout ` button to
204+ continue to the :ref: `Address and delivery <ecommerce/checkout/delivery >` step.
207205
208206Open the website editor to :ref: `enable <ecommerce/checkout/customize_steps >` checkout options such
209207as:
226224
227225.. _ecommerce/checkout/delivery :
228226
229- Delivery
230- --------
227+ Address and delivery
228+ --------------------
231229
232230Once they have reviewed their order:
233231
@@ -244,8 +242,8 @@ addresses are identical), and click :guilabel:`Confirm` to proceed to the next s
244242 :guilabel: `VAT ` and :guilabel: `Company name ` fields by toggling the :guilabel: `Show B2B Fields `
245243 option in the website editor.
246244 - You can add a checkbox for users without an account to sign up for a newsletter. To do so, go
247- to :menuselection: `Website --> Configuration --> Settings `. Under the :guilabel: ` Shop -
248- Checkout Process ` section, enable the :guilabel: `Newsletter ` feature and select a
245+ to :menuselection: `Website --> Configuration --> Settings `, scroll down to the
246+ :guilabel: ` eCommerce ` section, enable the :guilabel: `Newsletter ` feature, and select a
249247 :guilabel: `Newsletter List `.
250248
251249.. _ecommerce/checkout/extra_step :
@@ -259,29 +257,47 @@ information through an online form, which is then included in the :ref:`sales or
259257Step ` option in the website editor. The form can be :ref: `customized <website/building_blocks/form >`
260258as needed.
261259
262- .. tip ::
263- Alternatively, go to :menuselection: `Website --> Configuration --> Settings `, scroll to the
264- :guilabel: `Shop - Checkout Process ` section, enable :guilabel: `Extra Step During Checkout `, and
265- click :guilabel: `Save `. Click :icon: `fa-arrow-right ` :guilabel: `Configure Form ` to customize it.
266-
267260.. _ecommerce/checkout/payment :
268261
269262Payment
270263-------
271264
272- At the :guilabel: `Payment ` step, customers :guilabel: `Choose a payment method `, enter their payment
273- details, and click :guilabel: `Pay now `.
265+ At the :guilabel: `Payment ` step, customers can :guilabel: `Choose a payment method `, enter their
266+ payment details, and click :guilabel: `Pay now `.
274267
275- You can require customers to agree to your :doc: `terms and conditions
276- <../.. /finance/accounting/customer_invoices/terms_conditions>` before payment . To :ref: ` enable
277- <ecommerce/checkout/customize_steps>` this option, go to the website editor and toggle the
278- :guilabel: ` Accept Terms & Conditions ` feature .
268+ To make payment methods available to customers, configure and enable one or more :doc: `payment
269+ provider(s) </applications /finance/payment_providers>` . To do so, go to :menuselection: ` Website -->
270+ Configuration --> Payment Providers `, :guilabel: ` Activate ` the relevant payment provider(s), and
271+ :ref: ` configure < payment_providers/add_new >` them .
279272
280273.. tip ::
281- Enable the :ref: `developer mode <developer-mode >` and click the :icon: `fa-bug ` (:guilabel: `bug `)
282- icon to display an :ref: `availability <payment_providers/availability >` report for payment
283- providers and payment methods, which helps diagnose potential availability issues on the payment
284- form.
274+ The options displayed at checkout depend on the active payment providers, as well as the
275+ :ref: `customer’s country and currency <payment_providers/currencies_countries >`, and, optionally,
276+ the :ref: `maximum amount <payment_providers/maximum_amount >` set for the provider.
277+
278+ To display an :ref: `availability <payment_providers/availability >` report for payment
279+ providers and payment methods and help diagnose potential availability issues on the payment
280+ form, enable the :ref: `developer mode <developer-mode >` and click the :icon: `fa-bug `
281+ (:guilabel: `bug `) icon.
282+
283+ Terms and conditions
284+ ~~~~~~~~~~~~~~~~~~~~
285+
286+ To require customers to agree to the :doc: `terms and conditions
287+ <../../finance/accounting/customer_invoices/terms_conditions>` before payment, open the website
288+ editor and toggle the :guilabel: `Accept Terms ` switch in the :guilabel: `Style ` tab.
289+
290+ eWallets and gift cards
291+ ~~~~~~~~~~~~~~~~~~~~~~~
292+
293+ Customers can pay with an eWallet or gift card during checkout. To enable these options, go to
294+ :menuselection: `Website --> Configuration --> Settings ` and enable :menuselection: `Discounts,
295+ Loyalty & Gift Card ` in the :guilabel: `eCommerce ` section. Then, go to :menuselection: `Website -->
296+ eCommerce --> Gift cards & eWallet ` and :doc: `create a gift card and/or eWallet program
297+ </applications/sales/sales/products_prices/ewallets_giftcards>`.
298+
299+ .. image :: checkout/payments-ewallets-giftcards.png
300+ :alt: Enter gift card code to process checkout
285301
286302.. _ecommerce/checkout/order_confirmation :
287303
0 commit comments