cancel
Showing results for 
Search instead for 
Did you mean: 

Ordem dos campos do checkout no magento 2

Ordem dos campos do checkout no magento 2

Olá!

 

Estou com problemas na ordenação dos campos de endereço do checkout, atualmente o usuário preenche Rua, Número, Complemento, Bairro ai depois o CEP e como estou utilizando o ViaCep acaba ficando sem lógica o usuário preencher tudo pra depois a API sobrescrever o que foi digitado.

Tentei alterar o SortOrder no cart_index_index.xml mas não tive resultado nenhum.

 

Se alguém puder me ajudar fico agradecido.

3 REPLIES 3

Re: Ordem dos campos do checkout no magento 2

Como vc resolveu isso?

Re: Ordem dos campos do checkout no magento 2

Re: Ordem dos campos do checkout no magento 2

Olá @victor_wurthman 

 

XML

 

Você pode criar um módulo ou fazer a customização em seu tema. Via módulo você pode criar essa customização abaixo.

 

app/code/Rafaelcg/Checkout/view/frontend/layout/checkout_index_index.xml

 

<?xml version="1.0"?>

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="shipping-step" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="shippingAddress" xsi:type="array">
                                                    <item name="component" xsi:type="string">Rafaelcg_Checkout/js/view/shipping</item>
                                                    <item name="children" xsi:type="array">
                                                        <item name="shipping-address-fieldset" xsi:type="array">
                                                            <item name="children" xsi:type="array">
                                                                <item name="lastname" xsi:type="array">
                                                                    <item name="sortOrder" xsi:type="string">20</item>
                                                                </item>
                                                                <item name="firstname" xsi:type="array">
                                                                    <item name="sortOrder" xsi:type="string">21</item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

 Como pode ver podemos definir a sortOrder dos campos que queremos mudar.

 

Plugin

 

Você também pode criar um plugin para o método abaixo e fazer a customização do atributo sortOrder.

 

\Magento\Checkout\Block\Checkout\LayoutProcessor:Smiley Tonguerocess

 

public function aroundProcess($subject, \Closure $proceed, $jsLayout){

    $jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']
    ['children']['shippingAddress']['children']['shipping-address-fieldset']
    ['children']['lastname']['sortOrder'] = 20;
    ......

    $customJsLayout = $proceed($jsLayout);

    return $customJsLayout;
}

 

 Referências: