[IMP] website/ecommerce: update catalog page

content/applications/sales/sales/products_prices/products/variants.rst

@@ -28,24 +28,16 @@ within the Odoo *Sales* application.
    other similar records in Odoo.
 
 .. seealso::
-   :ref:`ecommerce/products/product-variants`
+   :ref:`Product variants in the eCommerce <ecommerce/categories_variants/product-variants>`
 
 Configuration
 =============
 
-To use product variants, the *Variants* setting **must** be activated in the Odoo *Sales*
-application.
+To use product variants, go to :menuselection:`Sales --> Configuration --> Settings`, then enable
+the :guilabel:`Variants` feature in the :guilabel:`Product Catalog` section, and click
+:guilabel:`Save` at the top of the :guilabel:`Settings` page.
 
-To do that, go to :menuselection:`Sales app --> Configuration --> Settings`, and locate the
-:guilabel:`Product Catalog` section at the top of the page.
-
-In that section, check the box to enable the :guilabel:`Variants` feature.
-
-.. image:: variants/activating-variants-setting.png
-   :align: center
-   :alt: Activating product variants on the Settings page of the Odoo Sales application.
-
-Then, click :guilabel:`Save` at the top of the :guilabel:`Settings` page.
+.. _products/variants/attributes:
 
 Attributes
 ==========
@@ -61,7 +53,6 @@ To create a new attribute from the :guilabel:`Attributes` page, click :guilabel:
 reveals a blank attributes form that can be customized and configured in a number of ways.
 
 .. image:: variants/attribute-creation.png
-   :align: center
    :alt: A blank attribute creation form in the Odoo Sales application.
 
 First, create an :guilabel:`Attribute Name`, such as `Color` or `Size`.
@@ -70,71 +61,71 @@ Next, select one of the options from the :guilabel:`Display Type` field. The :gu
 Type` determines how this product is shown on the online store, *Point of Sale* dashboard, and
 *Product Configurator*.
 
-The :guilabel:`Display Type` options are:
+The following :guilabel:`Display Type` options are available:
 
-- :guilabel:`Pills`: options appear as selectable buttons on the product page of the online store.
-- :guilabel:`Color`: options appear as small, colored squares, which reflect any HTML color codes
-- :guilabel:`Radio`: options appear in a bullet-style list on the product page of the online store.
-- :guilabel:`Select`: options appear in a drop-down menu on the product page of the online store.
-  set, on the product page of the online store.
-- :guilabel:`Multi-checkbox (option)`: options appear as selectable checkboxes on the product page
-  of the online store. This allows customers to choose options for themselves and is good choice for
-  highly customizable products.
+.. tabs::
 
-.. image:: variants/display-types.png
-   :align: center
-   :alt: Display Types on Product Configurator on the online store in Odoo.
+   .. tab:: :guilabel:`Pills`
 
-The :guilabel:`Variant Creation Mode` field informs Odoo when to automatically create a new variant
-once an attribute is added to a product.
+      Options appear as selectable buttons.
 
-.. note::
-   The :guilabel:`Variant Creation Mode` field **must** be set to :guilabel:`Never (option)` in
-   order for the :guilabel:`Multi-checkbox (option)` to work properly as the :guilabel:`Display
-   Type`.
+      .. image:: variants/pills-display-type.png
+         :alt: Pills display type
 
-- :guilabel:`Instantly`: creates all possible variants as soon as attributes and values are added to
-  a product template.
-- :guilabel:`Dynamically`: creates variants **only** when corresponding attributes and values are
-  added to a sales order.
-- :guilabel:`Never (option)`: never automatically creates variants.
+   .. tab:: :guilabel:`Color`
 
-.. warning::
-   Once added to a product, an attribute's :guilabel:`Variants Creation Mode` cannot be edited.
+      Options appear as small, colored circles; the colors can be defined using any HTML color code.
 
-The :guilabel:`eCommerce Filter Visibility` field determines whether or not these attribute options
-are visible to the customer on the front-end, as they shop on the online store.
+      .. image:: variants/color-display-type.png
+         :alt: Pills display type
 
-- :guilabel:`Visible`: the attribute values are visible to customers on the front-end.
-- :guilabel:`Hidden`: the attribute values are hidden from customers on the front-end.
+   .. tab:: :guilabel:`Radio`
 
-Lastly, in the optional :guilabel:`eCommerce Category` field, select a category from a drop-down
-menu to group similar attributes under the same section for added specificity and organization.
+      Options appear as radio buttons.
 
-.. note::
-   To view the details related to the attribute category selected, click the internal link
-   :icon:`fa-arrow-right` :guilabel:`(right arrow)` icon to the far-right of the
-   :guilabel:`eCommerce Category` field, once an option has been selected. Doing so reveals that
-   attribute category's detail form.
+      .. image:: variants/radio-display-type.png
+         :alt: Pills display type
 
-   .. image:: variants/attribute-category-internal-link.png
-      :align: center
-      :alt: A standard attribute category detail page accessible via its internal link arrow icon.
+   .. tab:: :guilabel:`Select`
 
-   Here, the :guilabel:`Category Name` and :guilabel:`Sequence` is displayed at the top. Followed by
-   :guilabel:`Related Attributes` associated with the category. These attributes can be
-   dragged-and-dropped into a desirable order of priority.
+      Options appear in a drop-down menu.
 
-   Attributes can be directly added to the category, as well, by clicking :guilabel:`Add a line`.
+      .. image:: variants/select-display-type.png
+         :alt: Pills display type
 
-.. tip::
-   To create an attribute category directly from this field, start typing the name of the new
-   category, then select either :guilabel:`Create` or :guilabel:`Create and edit...` from the
-   drop-down menu that appears.
+   .. tab:: :guilabel:`Image`
+
+      Options appear as images.
 
-   Clicking :guilabel:`Create` creates the category, which can be modified later. Clicking
-   :guilabel:`Create and edit...` creates the category and reveals a :guilabel:`Create Category`
-   pop-up window, in which the new attribute category can be configured and customized.
+      .. image:: variants/image-display-type.png
+         :alt: Pills display type
+
+   .. tab:: :guilabel:`Multi-checkbox`
+
+      Options appear as selectable checkboxes. This allows customers to choose multiple options,
+      e.g., to add extras to food orders or highly customizable products.
+
+      .. image:: variants/multi-checkbox-display-type.png
+         :alt: Pills display type
+
+The :guilabel:`Variant Creation` field determines if/when a new variant is automatically created
+once an attribute is added to a product.
+
+.. important::
+   If the attribute's :guilabel:`Display Type` is :guilabel:`Multi-checkbox`, you **must** set the
+   :guilabel:`Variant Creation` field to :guilabel:`Never`.
+
+- :guilabel:`Instantly`: creates all possible variants as soon as attributes and values are added to
+  a product template.
+- :guilabel:`Dynamically`: creates variants **only** when corresponding attributes and values are
+  added to a sales order.
+- :guilabel:`Never`: prevents automatic creation of variants.
+
+.. warning::
+   Once added to a product, an attribute's :guilabel:`Variants Creation` mode cannot be edited.
+
+.. seealso::
+   :ref:`Ecommerce-specific settings for attributes <ecommerce/categories_variants/attributes>`
 
 Attribute values
 ----------------
@@ -170,12 +161,12 @@ Or, choose a specific color by clicking the *dropper* icon, and selecting a desi
 currently clickable on the screen.
 
 Businesses can attach images to product variant attribute values for customers to view on an
-eCommerce webite. To do so, click the :icon:`fa-camera` :guilabel:`(camera)` icon, then click the
+eCommerce website. To do so, click the :icon:`fa-camera` :guilabel:`(camera)` icon, then click the
 :icon:`fa-pencil` :guilabel:`(pencil)` icon and select an image from your local drive. This image
-will appear as a color option on the ecommerce product page.
+will appear as a color option for the relevant product.
 
-.. image:: variants/ecommerce-pattern-option.png
-   :alt: Pattern as color option on the ecommerce page.
+.. image:: variants/pattern-display.png
+   :alt: Pattern as color option.
 
 .. tip::
    Attributes can also be created directly from the product template by adding a new line and typing
@@ -258,6 +249,8 @@ In the :guilabel:`Exclude for` field, different :guilabel:`Product Templates` an
 :guilabel:`Attribute Values` can be added. When added, this specific attribute value will be
 excluded from those specific products.
 
+.. _products/variants/variants-smart-button:
+
 Variants smart button
 ---------------------
 

content/applications/websites/ecommerce.rst

@@ -36,8 +36,8 @@ customer accounts, and monitor your performance.
       :target: ecommerce/order_handling
       :large:
 
-      Handle all business documents related to your eCommerce orders: sales orders, delivery orders,
-      invoices, and legal requirements.
+      Handle all business documents related to your e-commerce orders: sales orders, delivery
+      orders, invoices, and legal requirements.
 
    .. card:: Customer accounts
       :target: ecommerce/customer_accounts
@@ -49,7 +49,7 @@ customer accounts, and monitor your performance.
    .. card:: Performance management
       :target: ecommerce/performance
 
-      Analyze sales data to evaluate your eCommerce performance.
+      Analyze sales data to evaluate your e-commerce performance.
 
    .. card:: Google Merchant Center
       :target: ecommerce/google_merchant_center

content/applications/websites/ecommerce/b2b_b2c.rst

@@ -16,7 +16,7 @@ While B2C businesses sell directly to the end consumer with a :ref:`tax-included
 <ecommerce-price-management-tax-display>` price, B2B businesses usually :ref:`exclude taxes
 <ecommerce-price-management-tax-display>` and may even prefer to hide prices altogether, showcasing
 only their products instead.
-To configure a B2B-specific ecommerce shop, make sure the :ref:`Tax-Excluded
+To configure a B2B-specific online shop, make sure the :ref:`Tax-Excluded
 <ecommerce/prices/taxes>` option is enabled, and complete the configuration to :ref:`hide the
 pricing <ecommerce/prices/hide-prices>`.
 

content/applications/websites/ecommerce/customer_accounts.rst

@@ -2,7 +2,7 @@
 Customer accounts
 =================
 
-Using customer accounts for an ecommerce shop enables you to :ref:`manage customers
+Using customer accounts for an e-commerce enables you to :ref:`manage customers
 <ecommerce/customer_accounts/account-creation>`, control access to the :ref:`shop
 <ecommerce/customer_accounts/shop-access>`, the :ref:`checkout
 <ecommerce/customer_accounts/checkout-access>`, or the :ref:`customer portal <portal/access>`,

content/applications/websites/ecommerce/google_merchant_center.rst

@@ -2,7 +2,7 @@
 Google Merchant Center
 ======================
 
-Google Merchant Center is a tool that allows ecommerce retailers to manage and submit product
+Google Merchant Center is a tool that allows e-commerce retailers to manage and submit product
 data to Google. It serves as a central hub to upload and maintain product details, such as images,
 prices, and descriptions so that products can appear across Google's platforms.
 
@@ -19,7 +19,7 @@ prices, and descriptions so that products can appear across Google's platforms.
 Google Merchant Center setup
 ============================
 
-To connect your ecommerce with the :abbr:`GMC (Google Merchant Center)` platform, proceed as
+To connect your e-commerce with the :abbr:`GMC (Google Merchant Center)` platform, proceed as
 follows:
 
 #. Create or sign in to a Google account using the following link:
@@ -70,7 +70,7 @@ Linking Odoo to GMC
 #. Click :guilabel:`Manage feeds`.
 #. In the :guilabel:`Product Feeds` pop-up window, select a :ref:`pricelist
    <ecommerce/prices/pricelists>`, a :ref:`language <language/add>` and :ref:`categories
-   <ecommerce/catalog/categories>`, and :guilabel:`Save`.
+   <ecommerce/categories_variants/categories>`, and :guilabel:`Save`.
 
    .. note::
       You must first enable the corresponding :doc:`language </applications/general/users/language>`

content/applications/websites/ecommerce/order_handling.rst

@@ -2,7 +2,7 @@
 Order handling
 ==============
 
-When a customer orders on your eCommerce, there are **three** record types required to be handle in
+When a customer orders on your e-commerce, there are **three** record types required to be handle in
 Odoo:
 
 - :ref:`Sales orders <handling/sales>`;
@@ -18,10 +18,10 @@ Order and payment status
 ------------------------
 
 The first step when a customer adds a product to his cart is the creation of a quotation. Orders can
-be managed either from the **Website** or :doc:`Sales </applications/sales/sales>` app. eCommerce
+be managed either from the **Website** or :doc:`Sales </applications/sales/sales>` app. E-commerce
 orders can automatically be assigned to a specific sales team by going to :menuselection:`Website
 --> Configuration --> Settings`. In the **Shop - Checkout Process** section, select a
-:guilabel:`Sales Team` or :guilabel:`Salesperson` to handle eCommerce orders.
+:guilabel:`Sales Team` or :guilabel:`Salesperson` to handle e-commerce orders.
 
 .. image:: order_handling/handling-salesteam.png
    :align: center
@@ -39,7 +39,7 @@ order goes through a different status:
 
 .. image:: order_handling/handling-status.png
    :align: center
-   :alt: Statuses of eCommerce orders
+   :alt: Statuses of e-commerce orders
 
 Abandoned cart
 --------------
@@ -66,7 +66,7 @@ Delivery flow
 Once a quotation has been confirmed, a delivery order is automatically created. The next step is to
 process this delivery.
 
-Packing eCommerce orders usually requires picking the product, preparing the packaging, printing the
+Packing e-commerce orders usually requires picking the product, preparing the packaging, printing the
 shipping label(s) and shipping to the customer. Depending on the number of orders, strategy, or
 resources, those steps can be considered as one or multiple actions in Odoo.
 
@@ -103,7 +103,7 @@ payment provider needs to be enabled first.
 Invoice and legal requirements
 ==============================
 
-The final step of an ecommerce order is to generate the invoice and send it to the customer.
+The final step of an e-commerce order is to generate the invoice and send it to the customer.
 Depending on your needs, an invoice can either be generated automatically or on demand of the
 customer. This process can be automated if (and when) the online payment is :ref:`confirmed
 <handling/sales>`.

content/applications/websites/ecommerce/performance.rst

@@ -2,19 +2,20 @@
 Performance management
 ======================
 
-Odoo integrates a variety of tools to analyze and improve the performance of your eCommerce
+Odoo integrates a variety of tools to analyze and improve the performance of your e-commerce
 website.
 
 Data monitoring
 ===============
 
-**Website** allows monitoring and analysis of the sales performance of your eCommerce. To access the
-**reporting view**, go to :menuselection:`Website --> Reporting --> eCommerce`. This dashboard helps
-you monitor everything related to sales, such as sales performance per product, category, day, etc.
+**Website** allows monitoring and analysis of the sales performance of your e-commerce. To access
+the **reporting view**, go to :menuselection:`Website --> Reporting --> eCommerce`. This dashboard
+helps you monitor everything related to sales, such as sales performance per product, category, day,
+etc.
 
 .. image:: performance/reporting.png
    :align: center
-   :alt: Performance reporting of eCommerce
+   :alt: Performance reporting of e-commerce
 
 By clicking :guilabel:`Measures`, you can select the type of measurement used, such as: