Una voce di menu a pulsante è un elemento della navigazione che mantiene la struttura di una normale voce di menu, ma viene stilizzato e percepito come un vero pulsante. Serve a dare maggiore evidenza ad un’azione importante migliorando la gerarchia visiva e guidando l’utente verso la conversione. Alcuni temi sviluppati per WordPress prevedono questa opzione; se non è presente questo articolo mostra la procedura per ottenere tale effetto mediante l’integrazione di codice CSS.

Caratteristiche principali

Iniziamo la procedura inserendo nella voce di menu che desideriamo evidenziare la classe menu-evidenziato, successivamnte inseriremo nella sezione del tema dedicata all’integrazione di codice CSS, una tra le configurazioni proposte negli esempi seguenti con lo scopo di ottenere effetti differenti.

Evidenziazione di base

/* Evidenziazione di base */
.menu-evidenziato > a {
    background: #ffcc00;
    color: #000;
    padding: 10px 18px;
    border-radius: 6px;
    font-weight: 600;
    transition: 0.25s ease;
}

.menu-evidenziato > a:hover {
    background: #e6b800;
    color: #000;
}

Bordo elegante

.menu-evidenziato > a {
    border: 2px solid #0073e6;
    padding: 8px 14px;
    border-radius: 4px;
}

Effetto “pill button”

.menu-evidenziato > a {
    background: #6a00ff;
    color: #fff;
    padding: 10px 22px;
    border-radius: 30px;
}

Gradiente

.menu-evidenziato > a {
    background: linear-gradient(135deg, #00c6ff, #0072ff);
    color: #fff;
    padding: 10px 20px;
    border-radius: 8px;
}

L'articolo Voce di menu a pulsante proviene da Realizzazione di siti web a Pordenone.

Per vendere corsi online usando Gravity Forms Product Add‑ons for WooCommerce, il flusso ideale è costruire il corso come prodotto WooCommerce e usare Gravity Forms per gestire iscrizione, varianti, onboarding e pricing dinamico. L’add‑on permette di collegare un form avanzato a qualsiasi prodotto, con logiche condizionali, campi prezzo, user input e configurazioni complesse. Gravity Forms non è una piattaforma e‑learning, ma è perfetto come motore di vendita ed onboarding personalizzato. WooCommerce viene trasformato nel sistema di pagamento e Gravity Forms nel sistema di configurazione e raccolta di dati avanzata.

Cosa permette di fare Gravity Forms Product Add‑Ons

• Collegare un form Gravity Forms ad un prodotto WooCommerce.
• Usare logiche condizionali, campi prezzo, user input price, pricing dinamico.
• Impedire duplicati nel carrello: ogni configurazione è trattata come unica.
• Mostrare prezzi personalizzati.
• Creare prodotti altamente configurabili.

Struttura del sistema di vendita

• Il prodotto WooCommerce con l’opzione “Gravity Form” e la selezione del form.
  
  
  

  

• Il prezzo del prodotto potrà essere gestito da Gravity Forms.
• L’inventario sarà gestito da WooCommerce.

Il form di iscrizione con Gravity Forms

• Nome, e-mail, telefono.
• Scelta della modalità: online od in presenza.
• Scelta della data o della sessione.
• Materiali, tutoraggio e certificazioni.
• Codice Fiscale.
• Upload dei documenti personali.
• Condizioni di vendita e Privacy Policy.

Plugin da installare

• Gravity Forms.
• User Registration.
• Gravity Forms Product Add-ons for WooCommerce.
• Altri eventali Add-ons di Gravity Forms per gestire i Gateway di Pagamento od altre funzionalità.

L'articolo Vendere corsi online con Gravity Forms proviene da Realizzazione di siti web a Pordenone.

UN ESEMPIO DI PERSONALIZZAZIONE PER IL TEMA IMPREZA

HTML

<div class="cf7-row">
  <div class="cf7-col">
    [text* your-name placeholder "Nome e Cognome *"]
  </div>

  <div class="cf7-col">
    [email* your-email placeholder "E-mail *"]
  </div>
</div>

<div class="cf7-row">
  <div class="cf7-col">
    [text* your-subject placeholder "Oggetto *"]
  </div>

  <div class="cf7-col">
    [text your-company placeholder "Azienda"]
  </div>
</div>

[textarea* your-message placeholder "Messaggio *"]

[acceptance acceptance-419] Acconsento al trattamento dei dati personali comunicati. * [/acceptance]

[submit "Invia"]

CSS

/* Wrapper righe */
.wpcf7 form .cf7-row {
  display: flex;
  gap: 25px;
  margin-bottom: 20px;
}

/* Colonne */
.wpcf7 form .cf7-col {
  flex: 1;
}

/* Campi al 100% */
.wpcf7 form .cf7-col input,
.wpcf7 form .cf7-col select,
.wpcf7 form .cf7-col textarea {
  width: 100%;
}

/* Responsive */
@media (max-width: 768px) {
  .wpcf7 form .cf7-row {
    flex-direction: column;
  }
}

/* Impreza-like (facoltativo) */
.wpcf7 form .cf7-row {
  align-items: flex-start;
}

.wpcf7 form .cf7-col .wpcf7-form-control-wrap {
  display: block;
  width: 100%;
}

UN ESEMPIO DI PERSONALIZZAZIONE PER IL TEMA ZEPHYR

HTML

<div class="cf7-row">
  <div class="cf7-col">
    [text* your-name placeholder "Nome e Cognome *"]
  </div>

  <div class="cf7-col">
    [email* your-email placeholder "E-mail *"]
  </div>
</div>

<div class="cf7-row">
  <div class="cf7-col">
    [text* your-subject placeholder "Oggetto *"]
  </div>

  <div class="cf7-col">
    [text your-company placeholder "Azienda"]
  </div>
</div>

[textarea* your-message placeholder "Messaggio"]

[acceptance acceptance-765] Acconsento al trattamento dei dati personali comunicati. * [/acceptance]

[submit "Invia"]

CSS

/* Layout base */
.cf7-row {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}

.cf7-col {
  flex: 1;
}

/* Campi full width */
.wpcf7 textarea {
  width: 100%;
}

/* Responsive */
@media (max-width: 768px) {
  .cf7-row {
    flex-direction: column;
  }
}

L'articolo Contact Form 7 su due colonne con Impreza & Zephyr proviene da Realizzazione di siti web a Pordenone.

Possiamo risolvere il problema senza l’utilizzo di un plugin, inserendo all’interno del file functions.php, del tema utilizzato il codice seguente:

// Cambia il logo nella pagina di login.
function custom_login_logo() { ?>
    <style type="text/css">
        #login h1 a {
            background-image: url('url del logo') !important;
            background-size: contain !important;
            width: px !important;
            height: px !important;
        }
    </style>
<?php }
add_action('login_head', 'custom_login_logo');

L'articolo Modifica il logo nella pagina di login proviene da Realizzazione di siti web a Pordenone.

1 – Video MP4 responsive con AutoPlay ed anteprima senza controlli. Ideale per presentazioni a “tutto schermo”.

HTML

<div class="video-wrap"><video poster="/path/anteprima.jpg" 
preload="metadata" autoplay="autoplay" 
loop="loop" muted="" width="100%" height="100%">
<source src="/path/video.mp4" type="video/mp4" />
Il tuo browser non supporta il video HTML5.
</video></div>

CSS

.video-wrap {
  position: relative;
  width: 100%;
  margin: 0 auto;
}
.video-wrap::before {
  content: "";
  display: block;
  padding-top: 56.25%; /* 16:9; usa 75% per 4:3 */
}
.video-wrap video {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover; /* o 'contain' se preferisci no crop */
}

2 – Video MP4 responsive con controlli senza anteprima. Ideale per essere inserito all’interno di un contenuto.

HTML

<div class="video-responsive">
<video controls>
<source src="/path/video.mp4" type="video/mp4">
Il tuo browser non supporta il video HTML5.
</video></div>

CSS

.video-responsive {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    overflow: hidden;
}
.video-responsive video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

3 – Video MP4 responsive con controlli ed anteprima. Ideale per essere inserito all’interno di un contenuto.

HTML

<div class="video-wrap">
<video controls preload="metadata" poster="/path/anteprima.jpg">
<source src="/path/video.mp4" type="video/mp4">
Il tuo browser non supporta il video HTML5.
</video></div>

CSS

.video-wrap {
  position: relative;
  width: 100%;
  max-width: 960px; /* opzionale: limita la larghezza */
  margin: 0 auto;
}
.video-wrap::before {
  content: "";
  display: block;
  padding-top: 56.25%; /* 16:9; usa 75% per 4:3 */
}
.video-wrap video {
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover; /* o 'contain' se preferisci no crop */
}

L'articolo Inserire un video MP4 su WordPress senza usare plugin proviene da Realizzazione di siti web a Pordenone.

Alcuni utenti di Windows hanno riscontrato problematiche di varia natura dopo l’installazione degli aggiornamenti qualitativi di Windows 10, inoltre, gli aggiornamenti che non sono andati a buon fine, mostrano nella cronologia di Windows Update la dicitura “Non riuscito”. Questo articolo propone un metodo semplice per eliminare la suddetta cronologia e bloccare gli aggiornamenti non riusciti, che si proporrebbero nuovamente dopo la scansione di Windows Update. Per ottimizzare questa procedura, prima di iniziare, si consiglia di disattivare gli aggiornamenti automatici.

Accediamo ai servizi di sistema:

Interrompiamo il servizio “Windows Update”:

Dopo aver effetuato queste due procedure, accediamo a percorso: C:\Windows\SoftwareDistribution\DataStore. All’interno della cartella “Datastore” eliminiamo il file “DataStore.edb”, la cartella “Logs” e riavviamo il sistema. Ora se ritorniamo su Windows Update noteremo che la cronologia è stata eliminata; tuttavia se verifichiamo la disponibilità di nuovi aggiornamenti, quelli che precentemente non erano andati a buon fine verranno riproposti. Per risovere questo problema, prima di ricercare gli aggiornamenti, è possibile utilizzare il software “Show or hide updates“, prodotto da “Microsoft Corporation”, per nascondere quelli indesiderati.

Scarica Show or hide updates

L'articolo Eliminare la cronologia degli aggiornamenti di Windows 10 proviene da Realizzazione di siti web a Pordenone.

Possiamo risolvere il problema senza l’utilizzo di un plugin, inserendo all’interno del file functions.php, del tema utilizzato il codice seguente:

add_action( 'template_redirect', 'eb_add_gift_in_cart' );
function eb_add_gift_in_cart() {
    if (is_admin()) return; 
    if (WC()->cart->is_empty()) return;
  
    // ID del prodotto o dei prodotti con lo stesso regalo abbinato. 
    $product_bought_ids = array(ID1, ID2, ID3, ID4);
    
    // ID del prodotto da in omaggio. 
    $product_gifted_id = ID;
    
    $product_bought_in_cart = false;
    $product_gifted_in_cart = false;
    
    foreach( WC()->cart->get_cart() as $key => $val ) {
        $_product = $val['data'];
    
        foreach( $product_bought_ids as $k => $v ) {
            if($v == $_product->id ) {
                $product_bought_in_cart = true;
            }
        }
        
        if( $product_gifted_id == $_product->id ) {
            $product_gifted_in_cart = true;
        }
    }

    if ( !$product_bought_in_cart ) {
        if ( $product_gifted_in_cart ) {
            foreach ( WC()->cart->get_cart() as $cart_item_key => $cart_item ) {
                if ( $cart_item['product_id'] == $product_gifted_id ) {
                    WC()->cart->remove_cart_item( $cart_item_key );
                }
            }
        }
    } else {
        if ( !$product_gifted_in_cart ) {
            WC()->cart->add_to_cart( $product_gifted_id );
        }
    }
}

Il prodotto in omaggio va impostato come “nascosto” e con prezzo pari a zero.

L'articolo Omaggio abbinato all’ordine di un prodotto proviene da Realizzazione di siti web a Pordenone.

add_action('woocommerce_checkout_before_terms_and_conditions', 'checkout_additional_checkboxes');
function checkout_additional_checkboxes( ){
    $checkbox1_text = __( "Campo personalizzato 1", "woocommerce" );
    $checkbox2_text = __( "Campo personalizzato 2", "woocommerce" );
    ?>
<p class="form-row custom-checkboxes">
        <label class="woocommerce-form__label checkbox custom-one">
            <input type="checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" name="custom_one" > <span><?php echo  $checkbox1_text; ?></span> <span class="required">*</span>
        </label>
        <label class="woocommerce-form__label checkbox custom-two">
            <input type="checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" name="custom_two" > <span><?php echo  $checkbox2_text; ?></span> <span class="required">*</span>
        </label>

<?php
}

Per rendere obbligatori i campi personalizzati, inseriamo all’interno del file functions.php, del tema utilizzato, il codice seguente:

add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');
function my_custom_checkout_field_process() {
    // Check if set, if its not set add an error.
    if ( ! $_POST['custom_one'] )
        wc_add_notice( __( 'Devi accettare "Campo personalizzato 1".' ), 'error' );
    if ( ! $_POST['custom_two'] )
        wc_add_notice( __( 'Devi accettare "Campo personalizzato 2".' ), 'error' );
}

Questo secondo esempio mostra come creare un campo personalizzato facoltativo. Inseriamo all’interno del file functions.php, del tema utilizzato, il codice seguente:

add_action('woocommerce_checkout_before_terms_and_conditions', 'checkout_additional_checkboxes');
function checkout_additional_checkboxes( ){
    $checkbox1_text = __( "Campo personalizzato", "woocommerce" );
    ?>
    <p class="form-row custom-checkboxes">
        <label class="woocommerce-form__label checkbox custom-one">
            <input type="checkbox" class="woocommerce-form__input woocommerce-form__input-checkbox input-checkbox" name="custom_one" > <span><?php echo  $checkbox1_text; ?></span>
        </label>
    </p>
    <?php
}

L'articolo Aggiungere check boxes personalizzati nel checkout proviene da Realizzazione di siti web a Pordenone.

add_action( 'woocommerce_before_cart', 'eb_sconto_automatico_carrello' );
function eb_sconto_automatico_carrello() {
	$coupon_code = 'codice promozionale';
	if ( WC()->cart->has_discount( $coupon_code ) ) return;
	if ( WC()->cart->cart_contents_total >= 60 ) {
		WC()->cart->add_discount( $coupon_code );
		wc_print_notices();
	}
}

Questa procedura, testata con il tema “Darna”, realizzato da “G5Theme”, potrebbe non essere compatibile con tutti i temi sviluppati per WordPress.

L'articolo Sconto automatico nel carrello proviene da Realizzazione di siti web a Pordenone.

function eb_remove_out_of_stock_product_button( $html, $product, $args ) {
    if ( ! $product->is_in_stock() && ! $product->backorders_allowed() ) {
		return '';
    }

	return $html;
}
add_filter( 'woocommerce_loop_add_to_cart_link', 'eb_remove_out_of_stock_product_button', 10, 3 );

L'articolo Nascondi “aggiungi al carrello” nella pagina dello shop se il prodotto è esaurito proviene da Realizzazione di siti web a Pordenone.