Modificare i campi di checkout in WooCommerce

Mattepuffo's logo
Modificare i campi di checkout in WooCommerce

Modificare i campi di checkout in WooCommerce

Su un sito sviluppato con Wordpress e WooCommerce ho l'esigenza di modificare la pagina di checkout, andando a rimuovere / modificare alcuni campi.

Volendo possiamo evitare di sovrascrivere la pagina standard, usando i filtri di WooCommerce.

Vediamo un paio di esempi; il codice va inserito nel functions.php del vostro tema, evitate di usare quello standard!

Qui sotto il codice PHP per modificare il campo delle note e rimuovere la ragione sociale:

function custom_override_checkout_fields($fields) {
    $fields['order']['order_comments']['placeholder'] = 'Note ordine';
    unset($fields['billing']['billing_company']);
    return $fields;
}

add_filter('woocommerce_checkout_fields', 'custom_override_checkout_fields');

Qui sotto invece impostiamo che l'indirizzo uno non è obbligatorio:

function custom_override_default_address_fields($address_fields) {
    $address_fields['address_1']['required'] = false;
    return $address_fields;
}

add_filter('woocommerce_default_address_fields', 'custom_override_default_address_fields');

Basterà aggiornare la pagina di checkout.

Qui sotto trovate, in formato JSON, tutti i campi del form:

{
  "billing": {
    "billing_first_name": {
      "label": "Nome",
      "required": true,
      "class": [
        "form-row-first"
      ],
      "autocomplete": "given-name",
      "priority": 10
    },
    "billing_last_name": {
      "label": "Cognome",
      "required": true,
      "class": [
        "form-row-last"
      ],
      "autocomplete": "family-name",
      "priority": 20
    },
    "billing_country": {
      "type": "country",
      "label": "Stato",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field",
        "update_totals_on_change"
      ],
      "autocomplete": "country",
      "priority": 40
    },
    "billing_address_1": {
      "label": "Via e numero",
      "placeholder": "Via/Piazza e Numero Civico",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "autocomplete": "address-line1",
      "priority": 50
    },
    "billing_address_2": {
      "placeholder": "Appartamento, suite, unitu00e0, etc. (opzionale)",
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "autocomplete": "address-line2",
      "priority": 60,
      "required": false,
      "label": "Appartamento, suite, unitu00e0, etc. (opzionale)",
      "label_class": "screen-reader-text"
    },
    "billing_postcode": {
      "label": "C.A.P.",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "validate": [
        "postcode"
      ],
      "autocomplete": "postal-code",
      "priority": 65
    },
    "billing_city": {
      "label": "Cittu00e0",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "autocomplete": "address-level2",
      "priority": 70
    },
    "billing_state": {
      "type": "state",
      "label": "Provincia",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "validate": [
        "state"
      ],
      "autocomplete": "address-level1",
      "priority": 80,
      "country_field": "billing_country",
      "country": "IT"
    },
    "billing_phone": {
      "label": "Telefono",
      "required": true,
      "type": "tel",
      "class": [
        "form-row-wide"
      ],
      "validate": [
        "phone"
      ],
      "autocomplete": "tel",
      "priority": 100
    },
    "billing_email": {
      "label": "Indirizzo email",
      "required": true,
      "type": "email",
      "class": [
        "form-row-wide"
      ],
      "validate": [
        "email"
      ],
      "autocomplete": "email username",
      "priority": 110
    }
  },
  "shipping": {
    "shipping_first_name": {
      "label": "Nome",
      "required": true,
      "class": [
        "form-row-first"
      ],
      "autocomplete": "given-name",
      "priority": 10
    },
    "shipping_last_name": {
      "label": "Cognome",
      "required": true,
      "class": [
        "form-row-last"
      ],
      "autocomplete": "family-name",
      "priority": 20
    },
    "shipping_company": {
      "label": "Nome della societu00e0",
      "class": [
        "form-row-wide"
      ],
      "autocomplete": "organization",
      "priority": 30,
      "required": false
    },
    "shipping_country": {
      "type": "country",
      "label": "Stato",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field",
        "update_totals_on_change"
      ],
      "autocomplete": "country",
      "priority": 40
    },
    "shipping_address_1": {
      "label": "Via e numero",
      "placeholder": "Via/Piazza e Numero Civico",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "autocomplete": "address-line1",
      "priority": 50
    },
    "shipping_address_2": {
      "placeholder": "Appartamento, suite, unitu00e0, etc. (opzionale)",
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "autocomplete": "address-line2",
      "priority": 60,
      "required": false,
      "label": "Appartamento, suite, unitu00e0, etc. (opzionale)",
      "label_class": "screen-reader-text"
    },
    "shipping_postcode": {
      "label": "C.A.P.",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "validate": [
        "postcode"
      ],
      "autocomplete": "postal-code",
      "priority": 65
    },
    "shipping_city": {
      "label": "Cittu00e0",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "autocomplete": "address-level2",
      "priority": 70
    },
    "shipping_state": {
      "type": "state",
      "label": "Provincia",
      "required": true,
      "class": [
        "form-row-wide",
        "address-field"
      ],
      "validate": [
        "state"
      ],
      "autocomplete": "address-level1",
      "priority": 80,
      "country_field": "shipping_country",
      "country": "IT"
    }
  },
  "account": [],
  "order": {
    "order_comments": {
      "type": "textarea",
      "class": [
        "notes"
      ],
      "label": "Note sull'ordine",
      "placeholder": "My new placeholder"
    }
  }
}

Cosi potete vedere come richiamare i campi che vi servono.

Qui invece un ottimo link alla documentazione con esempi: WooCommerce tutorial.

Enjoy!


Condividi

Commentami!