Aggiungi una descrizione ai metodi di spedizione

INFORMAZIONI SULLO SNIPPET

Con questo frammento di codice, avrai la possibilità di inserire una descrizione per i metodi di spedizione che stai utilizzando nel tuo e-commerce. Queste descrizioni saranno visualizzate attraverso dei tooltip sia nel carrello che nella pagina di checkout, garantendo un’esperienza d’acquisto migliore.

Per garantire il corretto funzionamento di questo snippet, è necessario l’utilizzo di un’icona di Font Awesome. Assicurati che siano abilitate sul tuo sito; in caso contrario, utilizza questo frammento di codice.

PHP
/*
* Snippet Name:     Aggiungi una descrizione ai metodi di spedizione.
* Snippet Author:   Matteo De Maria
* Version:          1.0.0
*/

// Crea un filtro per ciascun metodo di spedizione.
add_action( 'init', 'dmm_init', 100 );
function dmm_init() {
	$shipping_methods = WC()->shipping->get_shipping_methods();
	foreach ( $shipping_methods as $id => $shipping_method ) {
		add_filter( "woocommerce_shipping_instance_form_fields_$id", 'dmm_create_shipping_method_description_field' );
	}
}

// Crea un campo descrizione personalizzato nell'editor del metodo di spedizione.
function dmm_create_shipping_method_description_field( $fields ) {
	$new_fields = array(
		'description' => array(
			'title' => 'Descrizione',
			'type'  => 'textarea',
			'css'   => 'width: 100%;',
		),
	);
	$keys  = array_keys( $fields );
	$index = array_search( 'title', $keys, true );
	$pos   = false === $index ? count( $fields ) : $index + 1;
	return array_merge( array_slice( $fields, 0, $pos ), $new_fields, array_slice( $fields, $pos ) );
}

// Crea il campo descrizione come meta.
add_filter( 'woocommerce_shipping_method_add_rate_args', 'dmm_create_description_as_meta', 10, 2 );
function dmm_create_description_as_meta( $args, $method ) {
	$args['meta_data']['description'] = htmlentities( $method->get_option( 'description' ) );
	return $args;
}

// Visualizza il tooltip accanto al titolo del metodo di spedizione.
add_action( 'woocommerce_after_shipping_rate', 'dmm_output_shipping_method_tooltips', 10 );
function dmm_output_shipping_method_tooltips( $method ) {
	$meta_data = $method->get_meta_data();
	if ( array_key_exists( 'description', $meta_data ) ) {
		$description = apply_filters( 'dmm_description_output', html_entity_decode( $meta_data['description'] ), $method );
		if ($description) {
			$html = '<div class="tooltip"> <i class="fa fa-question-circle" style="color: #E8363C;" aria-hidden="true"></i><span class="tooltiptext">' .  wp_kses( $description, wp_kses_allowed_html( 'post' ) ) . '</span></div>';
			echo apply_filters( 'dmm_description_output_html', $html, $description, $method  );
		}
	}
}

// Stile del tooltip
add_action('wp_head', 'dmm_tooltip_css');
function dmm_tooltip_css() { ?>
	<style>
		.tooltip {
			position: relative;
			display: inline-block;
			float:right;			/* Cambia questo in left se desideri che il tooltip appaia prima del nome del metodo di spedizione */
			text-align:right;		/* Cambia questo in left se desideri che il tooltip appaia prima del nome del metodo di spedizione */
		}
		.tooltip .tooltiptext {
			display:inline-block;
			text-indent:0;
			visibility: hidden;
			width: 150px;
			background-color: #2d2d2d;
			color: white;
			text-align: center;
			border-radius: 3px;
			padding: 15px;
			position: absolute;
			z-index: 1;
			bottom: 100%;
			left: 50%;
			margin-left: -68px;
			font-size: 12px;
			line-height:1.5;
		}
		.tooltip .tooltiptext::after {
			content: "";
			position: absolute;
			top: 100%;
			left: 50%;
			margin-left: -5px;
			border-width: 5px;
			border-style: solid;
			border-color: #2d2d2d transparent transparent transparent;
		}
		.tooltip:hover .tooltiptext {
			visibility: visible;
		}
	</style>
<?php
}

Copia il codice nel file functions.php del tuo tema child attivo o utilizza il plugin Code Snippets.

Lascia un commento

I commenti non pertinenti allo snippet o offensivi non verranno approvati.

Se desideri condividere del codice, per favore fallo in questo modo: [php]il tuo codice[/php].

L'indirizzo email non verrà pubblicato. I campi obbligatori sono contrassegnati con *

DMM WEB DESIGN
Questo sito utilizza cookie tecnici e di profilazione. Cliccando su accetta si autorizzano tutti i cookie di profilazione. Cliccando su rifiuta o la X si rifiutano tutti i cookie di profilazione. Cliccando su personalizza è possibile selezionare quali cookie di profilazione attivare.