vendor/shopware/storefront/Resources/views/storefront/component/account/register.html.twig line 1

Open in your IDE?
  1. {% block component_account_register %}
  2.     <div class="card register-card">
  3.         <div class="card-body">
  4.             {% block component_account_register_header %}
  5.                 {% if cardTitle %}
  6.                     <div class="card-title">
  7.                         {{ cardTitle }}
  8.                     </div>
  9.                 {% endif %}
  10.             {% endblock %}
  11.             {% block component_account_register_form %}
  12.                 <form action="{{ path('frontend.account.register.save') }}"
  13.                       class="register-form"
  14.                       method="post"
  15.                       data-form-csrf-handler="true"
  16.                       data-form-validation="true">
  17.                     {# @deprecated tag:v6.5.0 - Block component_account_register_form_csrf will be removed. #}
  18.                     {% block component_account_register_form_csrf %}
  19.                         {{ sw_csrf('frontend.account.register.save') }}
  20.                     {% endblock %}
  21.                     {% block component_account_register_redirect %}
  22.                         <input type="hidden"
  23.                                name="redirectTo"
  24.                                value="{{ redirectTo }}">
  25.                         <input type="hidden"
  26.                                name="redirectParameters"
  27.                                value="{{ redirectParameters }}">
  28.                     {% endblock %}
  29.                     {% block component_account_register_create_account %}
  30.                     {% if feature('FEATURE_NEXT_16236') %}
  31.                         <input type="hidden"
  32.                                name="createCustomerAccount"
  33.                                value="1">
  34.                     {% endif %}
  35.                     {% endblock %}
  36.                     {% block component_account_register_form_action %}
  37.                         <input type="hidden"
  38.                                name="errorRoute"
  39.                                value="frontend.account.register.page"/>
  40.                         <input type="hidden"
  41.                                name="errorParameters"
  42.                                value="{{ errorParameters }}">
  43.                     {% endblock %}
  44.                     {% block component_account_register_personal %}
  45.                         <div class="register-personal">
  46.                             {% block component_account_register_personal_fields %}
  47.                                 {% block component_account_register_personal_address_fields %}
  48.                                     {% sw_include '@Storefront/storefront/component/address/address-personal.html.twig' with {
  49.                                         'showBirthdayField': config('core.loginRegistration.showBirthdayField'),
  50.                                         'accountType': data.get('accountType')
  51.                                     } %}
  52.                                 {% endblock %}
  53.                                 {% block component_account_register_company_fields %}
  54.                                     {% sw_include '@Storefront/storefront/component/address/address-personal-company.html.twig' with {
  55.                                         'prefix': 'billingAddress',
  56.                                         'address': data.get('billingAddress')
  57.                                     } %}
  58.                                 {% endblock %}
  59.                                 {% set formGroupMail %}
  60.                                     {% block component_account_register_personal_mail %}
  61.                                         {% block component_account_register_personal_mail_label %}
  62.                                             <label class="form-label"
  63.                                                    for="personalMail">
  64.                                                 {{ "account.personalMailLabel"|trans|sw_sanitize }}{{ "general.required"|trans|sw_sanitize }}
  65.                                             </label>
  66.                                         {% endblock %}
  67.                                         {% block component_account_register_personal_mail_input %}
  68.                                             <input type="email"
  69.                                                    class="form-control{% if formViolations.getViolations('/email') is not empty %} is-invalid{% endif %}"
  70.                                                    autocomplete="section-personal email"
  71.                                                    id="personalMail"
  72.                                                    placeholder="{{ "account.personalMailPlaceholder"|trans|striptags }}"
  73.                                                    name="email"
  74.                                                    value="{{ data.get('email') }}"
  75.                                                    {% if config('core.loginRegistration.requireEmailConfirmation') %}
  76.                                                    data-form-validation-equal="personalMail"
  77.                                                    {% endif %}
  78.                                                    required="required">
  79.                                         {% endblock %}
  80.                                         {% block component_account_register_personal_mail_input_error %}
  81.                                             {% if formViolations.getViolations('/email') is not empty %}
  82.                                                 {% sw_include '@Storefront/storefront/utilities/form-violation.html.twig' with {
  83.                                                     violationPath: '/email'
  84.                                                 } %}
  85.                                             {% endif %}
  86.                                         {% endblock %}
  87.                                     {% endblock %}
  88.                                 {% endset %}
  89.                                 {% set formGroupMailConfirmation %}
  90.                                     {% block component_account_register_personal_mail_confirmation %}
  91.                                         {% block component_account_register_personal_mail_confirmation_label %}
  92.                                             <label class="form-label"
  93.                                                    for="personalMailConfirmation">
  94.                                                 {{ "account.personalMailConfirmationLabel"|trans|sw_sanitize }}{{ "general.required"|trans|sw_sanitize }}
  95.                                             </label>
  96.                                         {% endblock %}
  97.                                         {% block component_account_register_personal_mail_confirmation_input %}
  98.                                             <input type="email"
  99.                                                    class="form-control{% if formViolations.getViolations('/email') is not empty or formViolations.getViolations('/emailConfirmation') is not empty %} is-invalid{% endif %}"
  100.                                                    autocomplete="section-personal email"
  101.                                                    id="personalMailConfirmation"
  102.                                                    placeholder="{{ "account.personalMailConfirmationPlaceholder"|trans|striptags }}"
  103.                                                    name="emailConfirmation"
  104.                                                    value="{{ data.get('emailConfirmation') }}"
  105.                                                    data-form-validation-equal="personalMail"
  106.                                                    data-form-validation-equal-message="{{ "account.personalMailConfirmationInvalidMessage"|trans|striptags }}"
  107.                                                    required="required">
  108.                                         {% endblock %}
  109.                                         {% block component_account_register_personal_mail_confirmation_input_error %}
  110.                                             {% if formViolations.getViolations('/email') is not empty %}
  111.                                                 {% sw_include '@Storefront/storefront/utilities/form-violation.html.twig' with {
  112.                                                     violationPath: '/email'
  113.                                                 } %}
  114.                                             {% endif %}
  115.                                             {% if formViolations.getViolations('/emailConfirmation') is not empty %}
  116.                                                 {% sw_include '@Storefront/storefront/utilities/form-violation.html.twig' with {
  117.                                                     violationPath: '/emailConfirmation'
  118.                                                 } %}
  119.                                             {% endif %}
  120.                                         {% endblock %}
  121.                                     {% endblock %}
  122.                                 {% endset %}
  123.                                 {% set formGroupPassword %}
  124.                                     {% block component_account_register_personal_password %}
  125.                                         <span class="js-form-field-toggle-guest-mode">
  126.                                             {% block component_account_register_personal_password_label %}
  127.                                                 <label class="form-label"
  128.                                                        for="personalPassword">
  129.                                                     {{ "account.personalPasswordLabel"|trans|sw_sanitize }}{{ "general.required"|trans|sw_sanitize }}
  130.                                                 </label>
  131.                                             {% endblock %}
  132.                                             {% block component_account_register_personal_password_input %}
  133.                                                 <input type="password"
  134.                                                        class="form-control{% if formViolations.getViolations('/password') is not empty %} is-invalid{% endif %}"
  135.                                                        autocomplete="new-password"
  136.                                                        id="personalPassword"
  137.                                                        placeholder="{{ "account.personalPasswordPlaceholder"|trans|striptags }}"
  138.                                                        name="password"
  139.                                                        minlength="{{ config('core.loginRegistration.passwordMinLength') }}"
  140.                                                        {% if config('core.loginRegistration.requirePasswordConfirmation') %}
  141.                                                        data-form-validation-equal="newPassword"
  142.                                                        {% endif %}
  143.                                                        {% if config('core.loginRegistration.passwordMinLength') != 0 %}
  144.                                                        data-form-validation-length="{{ config('core.loginRegistration.passwordMinLength') }}"
  145.                                                        data-form-validation-length-message=" {{ "account.personalPasswordDescription"|trans({
  146.                                                            '%minLength%': config('core.loginRegistration.passwordMinLength')
  147.                                                        })|sw_sanitize }}"
  148.                                                        {% endif %}
  149.                                                        required="required">
  150.                                             {% endblock %}
  151.                                             {% block component_account_register_personal_password_description %}
  152.                                                 {% if config('core.loginRegistration.passwordMinLength') != 0 %}
  153.                                                     <small class="form-text js-validation-message"
  154.                                                            data-form-validation-length-text="true">
  155.                                                         {{ "account.personalPasswordDescription"|trans({
  156.                                                             '%minLength%': config('core.loginRegistration.passwordMinLength')
  157.                                                         })|sw_sanitize }}
  158.                                                     </small>
  159.                                                 {% endif %}
  160.                                             {% endblock %}
  161.                                             {% block component_account_register_personal_password_input_error %}
  162.                                                 {% if formViolations.getViolations('/password') is not empty %}
  163.                                                     {% sw_include '@Storefront/storefront/utilities/form-violation.html.twig' with {
  164.                                                         violationPath: '/password'
  165.                                                     } %}
  166.                                                 {% endif %}
  167.                                             {% endblock %}
  168.                                         </span>
  169.                                     {% endblock %}
  170.                                 {% endset %}
  171.                                 {% set formGroupPasswordConfirmation %}
  172.                                     {% block component_account_register_personal_password_confirmation %}
  173.                                         <span class="js-form-field-toggle-guest-mode">
  174.                                             {% block component_account_register_personal_password_confirmation_label %}
  175.                                                 <label class="form-label"
  176.                                                        for="personalPasswordConfirmation">
  177.                                                     {{ "account.personalPasswordConfirmationLabel"|trans|sw_sanitize }}{{ "general.required"|trans|sw_sanitize }}
  178.                                                 </label>
  179.                                             {% endblock %}
  180.                                             {% block component_account_register_personal_password_confirmation_input %}
  181.                                                 <input type="password"
  182.                                                        class="form-control{% if formViolations.getViolations('/password') is not empty or formViolations.getViolations('/passwordConfirmation') is not empty %} is-invalid{% endif %}"
  183.                                                        autocomplete="new-password"
  184.                                                        id="personalPasswordConfirmation"
  185.                                                        placeholder="{{ "account.personalPasswordConfirmationPlaceholder"|trans|striptags }}"
  186.                                                        name="passwordConfirmation"
  187.                                                        minlength="{{ config('core.loginRegistration.passwordMinLength') }}"
  188.                                                        data-form-validation-equal="newPassword"
  189.                                                        data-form-validation-equal-message="{{ "account.personalPasswordConfirmationInvalidMessage"|trans|striptags }}"
  190.                                                        required="required">
  191.                                             {% endblock %}
  192.                                             {% block component_account_register_personal_password_confirmation_input_error %}
  193.                                                 {% if formViolations.getViolations('/password') is not empty %}
  194.                                                     {% sw_include '@Storefront/storefront/utilities/form-violation.html.twig' with {
  195.                                                         violationPath: '/password'
  196.                                                     } %}
  197.                                                 {% endif %}
  198.                                                 {% if formViolations.getViolations('/passwordConfirmation') is not empty %}
  199.                                                     {% sw_include '@Storefront/storefront/utilities/form-violation.html.twig' with {
  200.                                                         violationPath: '/passwordConfirmation'
  201.                                                     } %}
  202.                                                 {% endif %}
  203.                                             {% endblock %}
  204.                                         </span>
  205.                                     {% endblock %}
  206.                                 {% endset %}
  207.                                 {% block component_account_register_personal_account_fields %}
  208.                                     <div class="{{ formRowClass }}">
  209.                                         <div class="form-group col-sm-6">
  210.                                             {{ formGroupMail }}
  211.                                         </div>
  212.                                         <div class="form-group col-sm-6">
  213.                                             {% if config('core.loginRegistration.requireEmailConfirmation') %}
  214.                                                 {{ formGroupMailConfirmation }}
  215.                                             {% elseif not config('core.loginRegistration.requirePasswordConfirmation') %}
  216.                                                 {{ formGroupPassword }}
  217.                                             {% endif %}
  218.                                         </div>
  219.                                         <div class="form-group col-sm-6">
  220.                                             {% if config('core.loginRegistration.requireEmailConfirmation') or config('core.loginRegistration.requirePasswordConfirmation') %}
  221.                                                 {{ formGroupPassword }}
  222.                                             {% endif %}
  223.                                         </div>
  224.                                         <div class="form-group col-sm-6">
  225.                                             {% if config('core.loginRegistration.requirePasswordConfirmation') %}
  226.                                                 {{ formGroupPasswordConfirmation }}
  227.                                             {% endif %}
  228.                                         </div>
  229.                                     </div>
  230.                                 {% endblock %}
  231.                             {% endblock %}
  232.                         </div>
  233.                     {% endblock %}
  234.                     {% block component_account_register_address %}
  235.                         <div class="register-address">
  236.                             {% block component_account_register_address_fields %}
  237.                                 {% block component_account_register_address_billing %}
  238.                                     <div class="register-billing">
  239.                                         {% block component_account_register_address_billing_header %}
  240.                                             <div class="card-title">
  241.                                                 {{ "account.registerAddressBillingHeader"|trans|sw_sanitize }}
  242.                                             </div>
  243.                                         {% endblock %}
  244.                                         {% block component_account_register_address_billing_fields %}
  245.                                             {% sw_include '@Storefront/storefront/component/address/address-form.html.twig' with {
  246.                                                 'prefix': 'billingAddress',
  247.                                                 'data': data.get('billingAddress'),
  248.                                                 'showNoShippingPostfix': true,
  249.                                             } %}
  250.                                         {% endblock %}
  251.                                     </div>
  252.                                 {% endblock %}
  253.                                 {% block component_account_register_address_different_shipping %}
  254.                                     <div>
  255.                                         {% block component_account_register_address_different_shipping_control %}
  256.                                             <div class="{{ formCheckboxWrapperClass }} register-different-shipping">
  257.                                                 {% block component_account_register_address_different_shipping_input %}
  258.                                                     <input type="checkbox"
  259.                                                            class="{{ formCheckInputClass }} js-different-shipping-checkbox"
  260.                                                            name="differentShippingAddress"
  261.                                                            value="1"
  262.                                                            id="differentShippingAddress"
  263.                                                            {% if data.get('differentShippingAddress') %}checked="checked"{% endif %}
  264.                                                            data-form-field-toggle="true"
  265.                                                            data-form-field-toggle-target=".js-form-field-toggle-shipping-address"
  266.                                                            data-form-field-toggle-value="true"
  267.                                                            data-form-field-toggle-trigger-nested="true">
  268.                                                 {% endblock %}
  269.                                                 {% block component_account_register_address_different_shipping_label %}
  270.                                                     <label class="custom-control-label no-validation"
  271.                                                            for="differentShippingAddress">
  272.                                                         {{ "account.registerDifferentShipping"|trans|sw_sanitize }}
  273.                                                     </label>
  274.                                                 {% endblock %}
  275.                                             </div>
  276.                                         {% endblock %}
  277.                                         {% block component_account_register_address_shipping %}
  278.                                             <div class="register-shipping js-form-field-toggle-shipping-address d-none">
  279.                                                 {% block component_account_register_address_shipping_header %}
  280.                                                     <div class="card-title">
  281.                                                         {{ "account.registerAddressShippingHeader"|trans|sw_sanitize }}
  282.                                                     </div>
  283.                                                 {% endblock %}
  284.                                                 {% block component_account_register_address_shipping_fields %}
  285.                                                     {% block component_account_register_address_shipping_fields_personal %}
  286.                                                         {% sw_include '@Storefront/storefront/component/address/address-personal.html.twig' with {
  287.                                                             'prefix': 'shippingAddress',
  288.                                                             'data': data.get('shippingAddress'),
  289.                                                             'hideCustomerTypeSelect': false,
  290.                                                             'customToggleTarget': true,
  291.                                                             'accountType': data.get('shippingAddress').get('accountType')
  292.                                                         } %}
  293.                                                     {% endblock %}
  294.                                                     {% block component_account_register_address_shipping_fields_company %}
  295.                                                         {% sw_include '@Storefront/storefront/component/address/address-personal-company.html.twig' with {
  296.                                                             'prefix': 'shippingAddress',
  297.                                                             'customToggleTarget': true,
  298.                                                             'address': data.get('shippingAddress')
  299.                                                         } %}
  300.                                                     {% endblock %}
  301.                                                     {% block component_account_register_address_shipping_fields_address %}
  302.                                                         {% sw_include '@Storefront/storefront/component/address/address-form.html.twig' with {
  303.                                                             'prefix': 'shippingAddress',
  304.                                                             'data': data.get('shippingAddress'),
  305.                                                             'showNoShippingPostfix': true,
  306.                                                             'disableNonShippableCountries': true,
  307.                                                         } %}
  308.                                                     {% endblock %}
  309.                                                 {% endblock %}
  310.                                             </div>
  311.                                         {% endblock %}
  312.                                     </div>
  313.                                 {% endblock %}
  314.                             {% endblock %}
  315.                         </div>
  316.                     {% endblock %}
  317.                     {% block component_account_register_captcha %}
  318.                         {% sw_include '@Storefront/storefront/component/captcha/base.html.twig' with { preCheck: true } %}
  319.                     {% endblock %}
  320.                     {% block component_account_register_privacy %}
  321.                         {% sw_include '@Storefront/storefront/component/privacy-notice.html.twig' %}
  322.                     {% endblock %}
  323.                     {% block component_account_register_required_fields %}
  324.                         <p class="register-required-info">
  325.                             {{ "general.requiredFields"|trans|sw_sanitize }}
  326.                         </p>
  327.                     {% endblock %}
  328.                     {% block component_account_register_submit %}
  329.                         <div class="register-submit">
  330.                             <button type="submit"
  331.                                     class="btn btn-primary btn-lg">
  332.                                 {{ "account.registerSubmit"|trans|sw_sanitize }}
  333.                             </button>
  334.                         </div>
  335.                     {% endblock %}
  336.                 </form>
  337.             {% endblock %}
  338.         </div>
  339.     </div>
  340. {% endblock %}