Un element esențial al unei experiențe de cumpărare bune este ușurința cu care clienții pot naviga între paginile produselor și pagina de checkout. Un buton „Continuă cumpărăturile” pe pagina de checkout poate încuraja clienții să adauge mai multe produse în coș înainte de a finaliza comanda, îmbunătățind astfel vânzările magazinului tău.

În acest articol, îți voi arăta cum să adaugi un buton „Continuă cumpărăturile” în pagina de checkout a WooCommerce folosind un simplu cod PHP. Vom explora două metode pentru a adăuga acest cod în magazinul tău WordPress:

1. Adăugarea codului direct în fișierul functions.php.
2. Folosirea pluginului Code Snippets.

Metoda 1: Adăugarea Codului Direct în fișierul functions.php

1. Deschide fișierul functions.php al temei tale:
   • Mergi la Aparanță > Editor de teme.
   • Selectează tema activă și deschide fișierul functions.php.
2. Adaugă următorul cod în fișierul functions.php:

<?php

// Add "Continue shopping" button in Woocommerce checkout page
add_action( 'woocommerce_before_checkout_form', 'continue_shopping_button' );
function continue_shopping_button() {
    $shop_page_url = get_permalink( wc_get_page_id( 'shop' ) ); // Înlocuiește funcția cu cea nouă
    echo '<div class="woocommerce-info">';
    echo ' <a href="'.$shop_page_url.'" class="button">Mergi la magazin →</a> Ai uitat sa comanzi ceva?';
    echo '</div>';
}

3. Salvează fișierul functions.php: După ce ai adăugat codul, salvează fișierul.

Metoda 2: Adăugarea Butonului folosind Pluginul Code Snippets

Dacă preferi să folosești pluginul Code Snippets (pentru o gestionare mai ușoară și mai sigură a codului personalizat), urmează acești pași:

1. Instalează și activează pluginul Code Snippets:
   • Mergi la Plugins > Add New în panoul de administrare WordPress.
   • Căută „Code Snippets” și apasă Install Now, apoi Activate.
2. Adaugă un nou snippet:
   • Mergi la Snippets > Add New.
   • Adaugă următorul cod:

Poți folosi același cod ca mai sus, exact cum este prezentat, pentru a adăuga butonul „Continuă cumpărăturile” pe pagina de checkout.

3. Salvează și activează snippetul: Apasă Save Changes and Activate pentru a salva și activa codul.

Personalizarea stilului butonului

Dacă dorești să personalizezi stilul butonului, poți adăuga un CSS suplimentar. Iată un exemplu de CSS care poate fi adăugat în Personalizare > CSS suplimentar sau în fișierul style.css al temei tale:

.woocommerce-info a.button {
    background-color: #28a745; /* Culoare de fundal verde */
    color: white;               /* Culoare text alb */
    padding: 10px 20px;         /* Spațiu în jurul butonului */
    font-size: 16px;            /* Mărimea textului */
    text-decoration: none;      /* Elimină sublinierea */
    border-radius: 5px;         /* Colțuri rotunjite */
}

.woocommerce-info a.button:hover {
    background-color: #218838; /* Culoare mai închisă la hover */
}

Acest CSS va face butonul mai atrăgător și va schimba culoarea de fundal la trecerea cu mouse-ul.

Concluzie

Adăugarea unui buton „Continuă cumpărăturile” pe pagina de checkout este o modalitate simplă, dar eficientă, de a îmbunătăți experiența utilizatorului și de a încuraja clienții să adauge mai multe produse în coș înainte de a finaliza comanda. Acum ai două metode prin care poți adăuga acest buton în magazinul tău WooCommerce: direct în fișierul functions.php sau folosind pluginul Code Snippets, fiecare având avantajele sale.