HowTo: Display custom names for order item states on the Storefront

Edit on GitHub

For the order items states on the Storefront, it is not always appropriate to display the states as they are in the state machine, as they do not make much sense for Buyers. For example, for the OMS confirmed state, you might want to display this sate as, for example, waiting for shipment for the Storefront users.

To display custom order states on the Storefront, do the following:

  1. In your project, go to /config/Zed/oms and open the .XML file of the payment method or sub-process you want to change the order states on the Storefront for. For example, let’s take the default Spryker DummyPayment01.xml.
  2. Specify the display value of the necessary state, as you want it on the Storefront. In the following example, the display value of the confirmed OMS sate is set to waiting for shipment:

config/Zed/oms/DummyPayment01.xml

?xml version="1.0"?>
<statemachine
        xmlns="spryker:oms-01"
        xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:schemaLocation="spryker:oms-01 http://static.spryker.com/oms-01.xsd">

    <process name="DummyPayment01" main="true">
    <subprocesses>
        <process>DummyRefund</process>
        <process>DummyReturn</process>
        <process>DummyInvoice</process>
        <process>CreateGiftCard</process>
    </subprocesses>

    <states>
       ...
        <state name="confirmed" reserved="true" display="waiting for shipment">
            <flag>cancellable</flag>
        </state>
Info

You can have the same display values for different OMS states.

  1. In Back Office, go to Administration > Glossary.
  2. In the LIST OF TRANSLATIONS table, in the NAME column, find the state name as you specified for the display parameter—for example, waiting for shipment.
  3. Provide the new glossary keys, that is, translations of the state:
    1. In the ACTIONS column, click Edit. The Edit Translation page opens.
    2. For the available locales, enter translations and click Save. The Overview of Translation page opens, where you can see the translations of the order state for the Storefront.

On the Storefront, on the Order Overview and Order History pages, customers can see the states that correspond to the values of the display parameter you set in XML files of the respective payment methods and sub-processes.

Info

If you delete the display parameter with its value, the OMS state, the one specified in the state name parameter, is displayed on the Storefront.