În acest articol, vom implementa un cod care permite adăugarea unui câmp personalizat în pagina de editare a produsului în WooCommerce. Acest câmp va marca produsele al căror preț este calculat pe metru liniar, iar eticheta va fi afișată automat pe pagina produsului.

Funcționalitățile codului

1. Adaugă un câmp personalizat în pagina de editare a produsului pentru a specifica dacă prețul este pe metru liniar.
2. Salvează această opțiune atunci când produsul este actualizat.
3. Afișează eticheta „/ metru liniar” lângă preț, pe pagina produsului, dacă opțiunea este activată.
4. Stilizează eticheta pentru a se integra vizual cu restul paginii.

Codul complet

Adaugă următorul cod în fișierul functions.php al temei tale active sau într-un plugin personalizat:

// Adaugă câmpul personalizat în pagina de editare a produsului
add_action('woocommerce_product_options_general_product_data', 'add_linear_meter_label_field');
function add_linear_meter_label_field() {
    woocommerce_wp_checkbox( array(
        'id' => '_linear_meter_label',
        'label' => __('Preț pe metru liniar', 'woocommerce'),
        'description' => __('Bifează dacă prețul este pe metru liniar.', 'woocommerce'),
    ));
}

// Salvează câmpul personalizat
add_action('woocommerce_process_product_meta', 'save_linear_meter_label_field');
function save_linear_meter_label_field($post_id) {
    $linear_meter_label = isset($_POST['_linear_meter_label']) ? 'yes' : 'no';
    update_post_meta($post_id, '_linear_meter_label', $linear_meter_label);
}

// Afișează eticheta "pe metru liniar" pe pagina produsului
add_filter('woocommerce_get_price_html', 'display_linear_meter_label', 10, 2);
function display_linear_meter_label($price, $product) {
    $linear_meter_label = get_post_meta($product->get_id(), '_linear_meter_label', true);
    if ($linear_meter_label === 'yes') {
        $price .= ' <span class="linear-meter-label">/ metru liniar</span>';
    }
    return $price;
}

// Stilizează eticheta "pe metru liniar"
add_action('wp_head', 'add_linear_meter_label_styles');
function add_linear_meter_label_styles() {
    echo '<style>
        .linear-meter-label {
            font-size: 0.9em;
            color: #555;
        }
    </style>';
}

Explicația codului

1. Adăugarea câmpului personalizat
   • Folosim acțiunea woocommerce_product_options_general_product_data pentru a adăuga o casetă de bifat în pagina de editare a produsului.
   • Câmpul personalizat este creat cu ajutorul funcției woocommerce_wp_checkbox.
2. Salvarea câmpului personalizat
   • Acțiunea woocommerce_process_product_meta salvează valoarea câmpului personalizat în meta datele produsului folosind update_post_meta.
3. Afișarea etichetei pe pagina produsului
   • Filtrul woocommerce_get_price_html verifică dacă opțiunea este activată pentru produsul curent și adaugă textul „/ metru liniar” lângă preț.
4. Stilizarea etichetei
   • Stilurile CSS sunt adăugate dinamic folosind acțiunea wp_head pentru a asigura o integrare estetică.

Rezultat

După implementarea acestui cod, vei putea bifa opțiunea „/ metru liniar” pentru produsele relevante. Această etichetă va apărea automat pe pagina produsului, oferind utilizatorilor mai multe informații despre unitatea de măsură a prețului.

Concluzie

Acest cod este util pentru magazinele online care vând produse la metru liniar (cum ar fi textile, cabluri sau materiale de construcție). Implementarea acestuia ajută la clarificarea prețului pentru clienți, îmbunătățind astfel experiența utilizatorilor.