Aggiungere un campo extra al prodotto con variazioni in Woocommerce

15 ago 2017, 12:51:48
Visualizzazioni: 27.6K
Voti: 9

Sto seguendo questo tutorial su come aggiungere un campo extra alle variazioni dei miei prodotti.

Ho solo bisogno di aggiungere un campo di testo aggiuntivo. La parte admin funziona bene - il campo viene mostrato e salvato/aggiornato, tuttavia, la pagina del singolo prodotto non funziona - il campo non viene visualizzato.

Quindi nel mio functions.php ho aggiunto:

add_action( 'woocommerce_product_after_variable_attributes', 'variation_settings_fields', 10, 3 );

add_action( 'woocommerce_save_product_variation', 'save_variation_settings_fields', 10, 2 );

function variation_settings_fields( $loop, $variation_data, $variation ) {
    woocommerce_wp_text_input( 
        array( 
            'id'          => '_text_field[' . $variation->ID . ']', 
            'label'       => __( 'Qualche etichetta', 'woocommerce' ), 
            'placeholder' => '',
            'desc_tip'    => 'true',
            'description' => __( 'Qualche descrizione.', 'woocommerce' ),
            'value'       => get_post_meta( $variation->ID, '_text_field', true )
        )
    );
}

function save_variation_settings_fields( $post_id ) {
    $text_field = $_POST['_text_field'][ $post_id ];
    if( ! empty( $text_field ) ) {
        update_post_meta( $post_id, '_text_field', esc_attr( $text_field );
    }
}

add_filter( 'woocommerce_available_variation', 'load_variation_settings_fields' );

function load_variation_settings_fields( $variations ) {

    $variations['text_field'] = get_post_meta( $variations[ 'variation_id' ], '_text_field', true );

    return $variations;
}

E in plugins/plugins/woocommerce/templates/single-product/add-to-cart/variation.php ho aggiunto (il tema non ha un proprio variation.php):

<div class="woocommerce-variation-custom-text-field">
    {{{ data.variation.text_field }}}
</div>

Come posso visualizzare il campo personalizzato nella pagina del singolo prodotto?

Grazie

Aggiornamento: Se ispeziono la pagina del singolo prodotto, lo script è presente:

<script type="text/template" id="tmpl-variation-template">
    <div class="woocommerce-variation-description">
        {{{ data.variation.variation_description }}}
    </div>

    <div class="woocommerce-variation-price">
        {{{ data.variation.price_html }}}
    </div>

   <div class="woocommerce-variation-custom-text-field">
        {{{ data.variation.text_field }}}
    </div>

    <div class="woocommerce-variation-availability">
        {{{ data.variation.availability_html }}}
    </div>
</script>

Il tema è belise.

Aggiornamento: Sto guardando il file functions.php personalizzato del tema per woocommerce (belise/inc/woocommerce/functions.php) e la logica sembra essere lì.

/**
 * Descrizione della pagina del negozio woocommerce-Price-amount amount sui prodotti in archivio
 */
function belise_woocommerce_template_single_excerpt() {
    global $post;

    if ( ! $post->post_excerpt ) {
        return;
    }
    ?>
    <div class="woocommerce-Price-amount amountption" itemprop="woocommerce-Price-amount amountption">

        <!-- se aggiungo <p>test</p> viene stampato nella pagina del prodotto -->
        <!-- vorrei che l'elemento del campo personalizzato fosse stampato qui -->

        <?php echo apply_filters( 'woocommerce_short_woocommerce-Price-amount amountption', $post->post_excerpt ); ?>
    </div><?php
}

Risposta - La prima soluzione di @ClemC funziona, il campo non si visualizzava a causa della cache del browser.

0
Tutte le risposte alla domanda 1
11
23

Per un riferimento serio, vedi come WC stesso aggiunge il textarea variable_description alle variazioni qui.

Notiamo diversi problemi (potenziali) nella tua implementazione del campo di testo.

  • Manca il name name...
  • La stringa id non ha una struttura corretta, ha invece la struttura del name...
  • Il id o il name non sono gli stessi del tuo template...

Quindi, prendendo come riferimento l'implementazione del textarea variable_description di WC, implementiamo il nostro campo di testo in questo modo:

add_action( 'woocommerce_product_after_variable_attributes', 'variation_settings_fields', 10, 3 );
add_action( 'woocommerce_save_product_variation', 'save_variation_settings_fields', 10, 2 );
add_filter( 'woocommerce_available_variation', 'load_variation_settings_fields' );

function variation_settings_fields( $loop, $variation_data, $variation ) {
    woocommerce_wp_text_input(
        array(
            'id'            => "my_text_field{$loop}",
            'name'          => "my_text_field[{$loop}]",
            'value'         => get_post_meta( $variation->ID, 'my_text_field', true ),
            'label'         => __( 'Etichetta personalizzata', 'woocommerce' ),
            'desc_tip'      => true,
            'description'   => __( 'Descrizione personalizzata.', 'woocommerce' ),
            'wrapper_class' => 'form-row form-row-full',
        )
    );
}

function save_variation_settings_fields( $variation_id, $loop ) {
    $text_field = $_POST['my_text_field'][ $loop ];

    if ( ! empty( $text_field ) ) {
        update_post_meta( $variation_id, 'my_text_field', esc_attr( $text_field ));
    }
}

function load_variation_settings_fields( $variation ) {     
    $variation['my_text_field'] = get_post_meta( $variation[ 'variation_id' ], 'my_text_field', true );

    return $variation;
}

Ora, nel template che deve avere il seguente percorso:

yourtheme/woocommerce/single-product/add-to-‌​cart/variation.php

Aggiungi questo:

<div class="random-class woocommerce-variation-custom-text-field">
    {{{ data.variation.my_text_field }}}
</div>

MODIFICA:

Se vuoi visualizzare il tuo campo personalizzato nel modo "classico":

<div class="woocommerce-variation-custom-text-field">
    <p><?php echo esc_html( get_post_meta( $post->ID, 'my_text_field', true ) ); ?></p>
</div>
21 ago 2017 13:28:37
Commenti

I commenti non sono per discussioni estese; questa conversazione è stata spostata nella chat.

Howdy_McGee Howdy_McGee
23 ago 2017 21:17:05

@ClemC vedi l'aggiornamento.

Vucko Vucko
26 ago 2017 11:44:55

@Vucko vedi l'aggiornamento.

ClemC ClemC
26 ago 2017 12:53:49

Stampa il div e il p, ma il p è vuoto.

Vucko Vucko
26 ago 2017 12:55:49

var_dump(get_post_meta( $post->ID, 'my_text_field', true )) restituisce string(0) "" anche se il mio campo personalizzato ha una stringa salvata.

Vucko Vucko
26 ago 2017 13:02:36

Penso sia a causa del $post->ID che non è una variazione e quindi per il quale non hai inserito un valore 'my_text_field'. Devi davvero essere all'interno del loop delle variazioni. Da dove provi a stampare il meta field, sembra che lo STESSO meta field sarà presente per tutte le variazioni e il prodotto principale stesso, non è quello che vuoi. Il campo di testo deve essere visualizzato solo per la sua variazione.

ClemC ClemC
26 ago 2017 13:04:02

Non hai molte altre scelte oltre a farlo con il nostro primo approccio. Ti suggerirei di andare nella chat room per risolvere il tuo caso.

ClemC ClemC
26 ago 2017 13:05:35

Continuiamo questa discussione nella chat.

Vucko Vucko
26 ago 2017 13:06:10

Fantastico, grazie @ClemC - un piccolo problema: sono in grado di modificare il testo del campo e salvarlo nuovamente, tuttavia se cancello tutti i contenuti e poi salvo, sembra che non venga salvato?

dungey_140 dungey_140
5 ago 2019 13:22:31

Ah, basta rimuovere if ( ! empty( $field ) ) {} e funziona. Ci sono degli svantaggi nel farlo?

dungey_140 dungey_140
5 ago 2019 13:27:53

Dopo aver seguito un blog probabilmente lo stesso dell'op poiché aveva lo stesso codice, ti ritrovi con lo stesso problema.. Se quei blog potessero rileggere i loro codici non saremmo in questa situazione

Tofandel Tofandel
14 set 2021 20:06:30
Mostra i restanti 6 commenti