Cum să editați pagina de mulțumire WooCommerce în mod programatic

Doriți să personalizați pagina Mulțumiri din magazinul dvs.? În acest ghid, vă vom arăta diferite moduri de a edita pagina de mulțumire WooCommerce în mod programatic .

De ce ar trebui să personalizați pagina de mulțumire WooCommerce?

Pagina Mulțumiri este pagina pe care o văd utilizatorii după ce finalizează o comandă . În mod implicit, pur și simplu mulțumește cumpărătorilor pentru achiziție și oferă informații de bază despre comandă, cum ar fi numărul comenzii, articolele achiziționate, prețul, metoda de plată și așa mai departe. Nu este nimic în neregulă în asta, dar poți folosi mult mai bine această pagină.

Pagina Mulțumiri este adesea trecută cu vederea, dar poate fi extrem de puternică. Rețineți că toți cumpărătorii dvs. îl vor vedea după ce plasează o comandă, așa că este o oportunitate excelentă de a vinde sau de a oferi informații utile clienților dvs. Personalizând pagina de mulțumire, puteți oferi o experiență mult mai bună după cumpărare cumpărătorilor dvs.

Dacă cineva vede pagina ta de mulțumire, este pentru că a plasat o comandă din magazinul tău. Asta înseamnă că au încredere în tine (cel puțin suficientă pentru a cumpăra de la tine). După cum probabil știți, este mult mai ușor să vinzi cuiva care a cumpărat deja de la tine decât clienților noi. Chiar dacă scopul tău principal ar putea să nu fie să vinzi ceva, poți depune eforturi pentru a transforma acel cumpărător într-un client care revine.

De exemplu, puteți edita pagina Mulțumiri și puteți adăuga ghiduri utile, link-uri de recomandare pe care utilizatorii le pot distribui pentru a obține o recompensă, oferte exclusive, reduceri la achiziții viitoare și multe altele.

Există mai multe moduri prin care puteți personaliza pagina de mulțumire pentru a îmbunătăți UX și pentru a-i face pe clienți să revină în magazinul dvs. În secțiunea următoare, vă vom arăta diferite metode de a edita pagina de mulțumire WooCommerce în mod programatic .

Cum să editați pagina de mulțumire WooCommerce în mod programatic: 2 metode

Există două moduri principale de a edita pagina de mulțumire în mod programatic în WooCommerce :

1. Folosind cârlige
2. Suprascrierea fișierelor șablon

În plus, puteți combina ambele metode în funcție de fiecare cerință specifică.

Să aruncăm o privire mai atentă la ambele sensuri.

NOTĂ : Deoarece vom edita câteva fișiere de bază, înainte de a începe, vă recomandăm să creați o copie de rezervă completă a site-ului dvs. și să instalați o temă copil. Dacă nu sunteți sigur cum să o faceți, consultați acest ghid pentru a crea unul sau pentru a utiliza oricare dintre aceste plugin-uri.

1) Personalizați pagina de mulțumire folosind cârlige

Pentru a rula hook-uri WooCommerce, vom lucra pe fișierul functions.php al temei copil. Avem nevoie de acest fișier pentru a-l suprascrie pe cel din tema părinte.

Unele dintre cârligele pe care WooCommerce le oferă lucrări pe pagina de mulțumire, cum ar fi woocommerce_before_thankyou și woocommerce_thankyou . În plus, puteți edita titlul și conținutul cu cârlige de filtrare, cum ar fi woocommerce_endpoint_order-received_title și woocommerce_thankyou_order_received_text .

Pentru a utiliza oricare dintre aceste cârlige, veți declanșa fiecare dintre ele adăugând următorul fragment la fișierul functions.php al temei copil:

 add_action('woocommerce_before_thankyou','QuadLayers_before_thankyou');
funcția QuadLayers_before_thankyou(){
    ecou „TEST”;
}

Cârligele de filtrare funcționează într-un mod similar, dar trebuie să returneze o valoare. Filtrul „woocommerce_before_thankyou” va edita titlul paginii de mulțumire după cum urmează:

 add_filter( 'woocommerce_endpoint_order-received_title', 'QuadLayers_thank_you_title'); 
funcția QuadLayers_thank_you_title( $old_title){ 
     returnează „Ești minunat!”; 
}

2) Editați fișierele șablon de suprascriere a paginii de mulțumire

O altă modalitate de a edita pagina de mulțumire WooCommerce în mod programatic este prin suprascrierea fișierelor șablon. Este de remarcat faptul că suprascrierea fișierelor șablon vă oferă multă flexibilitate, dar când suprascrieți un fișier șablon, cârligele care funcționează pe acel fișier nu vor mai funcționa.

Pentru a suprascrie fișierele șablon, trebuie să copiați fișierul thankyou.php situat în folderul de șabloane de plugin WC și să lipiți fișierul cu același nume în folderul WooCommerce al temei dvs. pentru copil, inclusiv subdosarul de finalizare, după cum urmează:

Pentru a afla mai multe despre cum să personalizați fișierele șablon în WooCommerce, consultați acest ghid.

După aceea, veți putea edita liber fișierul thankyou.php al temei copilului și îl veți suprascrie pe cel implicit.

Exemple de scripturi pentru a edita pagina de mulțumire WooCommerce în mod programatic

În această secțiune, vă vom arăta diferite scripturi pe care le puteți utiliza pentru a vă edita pagina de mulțumire WooCommerce în mod programatic. Pentru acest tutorial, vom folosi tema Storefront, așa că ar putea arăta puțin diferit dacă utilizați o altă temă.

Iată cum arată pagina implicită de mulțumire din WooCommerce:

1) Adăugați conținut personalizat la pagina Vă mulțumim

După cum am văzut mai înainte, putem folosi cârlige WooCommerce pentru a adăuga un titlu personalizat. De data aceasta vom adăuga mai mult conținut util, astfel încât clienții să ne poată urmări pe rețelele sociale.

Lipiți următorul cod în fișierul functions.php al temei copilului dvs.:

 add_filter( 'woocommerce_endpoint_order-received_title', 'QuadLayers_thank_you_title'); 
funcția QuadLayers_thank_you_title( $old_title){ 
     returnează „Ești minunat!”; 
}
add_filter( 'woocommerce_thankyou_order_received_text', 'QuadLayers_thank_you_details', 20, 2 ); 
funcția QuadLayers_thank_you_details( $thank_you_title, $comandă){ 
    $str= '<h3><b>O' . $comanda->get_billing_first_name() . '</b>, vă mulțumesc foarte mult pentru comandă!</h3>';
    $str.='<p>Vom contacta în curând pentru a vă livra achiziția.</p>';
    $str.='<p>Rămâneți la curent pentru a primi cele mai recente anunțuri și urmăriți-ne pe profilurile noastre de rețele sociale</p>>';
    $str.= '<div><div><a href="#twitter.com"><img src="https://upload.wikimedia.org/wikipedia/commons/c/ce/Twitter_Logo.png" / ></a></div>'; 
    $str.='<div><a href="#facebook.com"><img src="https://upload.wikimedia.org/wikipedia/commons/5/51/Facebook_f_logo_%282019%29.svg" /></a></div>'; 
    $str.='<div><a href="#instagram.com"><img src="https://cdn2.iconfinder.com/data/icons/social-media-2285/512/1_Instagram_colored_svg_1-512. png" /></a></div></div>';
   $str.='<p>Iată toate informațiile despre comanda dvs. Noroc!</p>';    
    returnează $str;
}

Nu uitați să înlocuiți adresele URL ale imaginii cu propria cale URL a site-ului dvs. În plus, trebuie să inserați backlink-uri către profilurile dvs. de rețele sociale, astfel încât atunci când utilizatorii dau clic pe link, vor deveni urmăritori.

Acesta va fi rezultatul:

2) Afișați informații despre produs pe pagina Vă mulțumim

O altă alternativă interesantă este afișarea altor produse, astfel încât clienții să poată cumpăra și alte articole de care sunt interesați. Pentru a afișa anumite produse, puteți utiliza coduri scurte WooCommerce ca acesta:

 add_action( 'woocommerce_thankyou', 'QuadLayers_thankyou_page', 10, 2 );
funcția QuadLayers_thankyou_page(){
   $sh = '<h4>Ați putea dori să verificați aceste alte produse. </h4>';
  $sh .='<div class="tx_account">'.do_shortcode('
 ').'</div>';
    echo $sh;
}

Aici folosim codul scurt al produsului pentru a afișa produsele prezentate și rezultatul este următorul:

3) Afișați detaliile contului pe pagina Vă mulțumim

În mod similar, putem atașa detalii despre contul utilizatorului și putem afișa file utile cu comenzile, adresa, informațiile despre cont și multe altele.

 add_action( 'woocommerce_thankyou', 'QuadLayers_thankyou_page', 10, 2 );
funcția QuadLayers_thankyou_page(){
   $sh = "<h2>Contul dvs.</h2>";
   $sh .='<div class="tx_account">'.do_shortcode(' [ woocommerce_my_account ] ').'</div>'; echo $sh; }

După ce lipiți acest lucru pe fișierul functions.php , pagina dvs. de mulțumire ar trebui să arate astfel:

4) Oferiți cupoane atunci când achizițiile depășesc un anumit preț total

Personalizarea paginii de mulțumire poate fi o modalitate excelentă de a transforma un cumpărător ocazional într-un client fidel. Cupoanele de reducere pentru achiziții viitoare sunt o modalitate excelentă de a realiza acest lucru.

Următorul script va adăuga un text la sfârșitul paginii de mulțumire atunci când prețul total al comenzii este mai mare de 100 USD.

 add_action( 'woocommerce_thankyou', 'QuadLayers_thankyou_order', 10, 2 ); 
funcția QuadLayers_thankyou_order($order_id){
    $comanda = wc_get_order( $comanda_id);
    $total=0;
    foreach ($comanda->get_items() ca $item_key => $item ):
        $item_data=$item->get_data();       
        $item_total=intval($item_data['total']);
        $total+=$total_articol;        
    endforeach;
    dacă($total>100):
        echo „<p>Suma comenzii dvs. depășește intervalul de 100$, așa că beneficiați de un cupon special pentru următoarea comandă.</p><p> Nu vă faceți griji, va fi activ până când decideți să reveniți !</p><p> Folosiți următorul cupon <code>[RTC_discount]</code>la următoarea comandă pentru a obține o reducere specială de 33%</p>";
    endif;
}

În acest exemplu, am ales 100 USD, dar asigurați-vă că ajustați valoarea din rândul 8 – if($total>100): – la ceva care are sens pentru afacerea dvs.

5) Eliminați și editați detaliile comenzii de pe pagina Vă mulțumim

Acum să aruncăm o privire la un exemplu mai complex și să facem câteva modificări fișierului șablon WooCommerce thankyou.php . Dacă nu sunteți familiarizat cu editarea fișierelor șablon, puteți arunca o privire la acest ghid.

În exemplul următor, vom elimina e-mailul, suma totală și metoda de plată din pagina comenzii, deoarece acestea sunt afișate și în detaliile comenzii. Aceasta înseamnă că vom lăsa doar numărul de identificare a comenzii și data comenzii.

În același timp, am mutat lista cu detaliile comenzii în partea de sus și am editat etichetele.

Pentru a face acest lucru, creați un fișier thankyou.php pe tema copilului dvs. așa cum este explicat în secțiunea anterioară și inserați următorul cod în el:

 <?php definit( 'ABSPATH' ) || ieșire;?>
<div class="woocommerce-order">
<?php if ( $comanda ): do_action( 'woocommerce_before_thankyou', $comanda->get_id() ); ?> <?php if ( $comanda->has_status( 'eșuat' ) ) : ?>
 <p class="woocommerce-notice woocommerce-notice--error woocommerce-thankyou-order-failed"><?php esc_html_e( „Din păcate comanda dvs. nu poate fi procesată, deoarece banca/comerciantul de origine v-a refuzat tranzacția. Vă rugăm să încercați achiziția dvs. din nou.', 'woocommerce' ); ?></p>
<p class="woocommerce-notice woocommerce-notice--error woocommerce-thankyou-order-failed-actions"><a href="<?php echo esc_url( $order->get_checkout_payment_url() ); ?>" class= "button pay"><?php esc_html_e( 'Plătiți', 'woocommerce' ); ?></a><?php if ( is_user_logged_in() ) : ?><a href="<?php echo esc_url( wc_get_page_permalink( 'myaccount' ) ); ?>" class="button pay"><?php esc_html_e( 'Contul meu', 'woocommerce' ); ?></a></a><?php endif; ?></p>
<?php else : ?>
<p class="woocommerce-notice woocommerce-notice--success woocommerce-thankyou-order-received"><?php echo apply_filters( 'woocommerce_thankyou_order_received_text', esc_html__( 'Vă mulțumesc. Comanda dvs. a fost primită.', 'woocommerce' ), $comanda ); ></p>
<?php do_action( 'woocommerce_thankyou', $order->get_id() ); ?>
<ul class="woocommerce-order-overview woocommerce-thankyou-order-details order_details">
<li class="woocommerce-order-overview__order order"><?php esc_html_e( 'Cod număr de comandă:', 'woocommerce' ); ><strong><?php echo $comanda->get_order_number(); // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></strong></li>
<li class="woocommerce-order-overview__date date"><?php esc_html_e( 'Data:', 'woocommerce' ); ?><strong><?php echo wc_format_datetime($comanda->get_date_created()); ></strong></li>
</ul>
<?php endif; ?>
<?php else : ?><p class="woocommerce-notice woocommerce-notice--success woocommerce-thankyou-order-received"><?php echo apply_filters( 'woocommerce_thankyou_order_received_text', esc_html__( 'Vă mulțumesc. Comanda dvs. a fost primit.', 'woocommerce' ), null );>
</p><?php endif; ?>
</div>

Dacă totul a mers bine, ar trebui să vedeți ceva de genul acesta:

Concluzie

Una peste alta, pagina Mulțumiri este adesea trecută cu vederea, dar poate avea un impact mare asupra afacerii tale. Adăugând linkuri de recomandare, oferte exclusive și reduceri pentru achiziții viitoare, vă puteți crește vânzările și crește numărul de clienți care revin.

În acest ghid, am văzut două moduri de a edita pagina de mulțumire WooCommerce în mod programatic:

• Cu cârlige
• Suprascrierea fișierelor șablon

Ambele metode sunt eficiente și pot funcționa în diferite situații, așa că alegeți-o pe cea care se potrivește cel mai bine cerințelor dumneavoastră specifice.

Până acum ar trebui să vă puteți personaliza pagina de mulțumire și:

• Adăugați conținut personalizat, cum ar fi link-uri de rețele sociale
• Afișează produse
• Afișați detaliile contului
• Oferă reduceri atunci când clientul atinge o anumită cheltuială minimă
• Eliminați și editați detaliile comenzii

În cele din urmă, rețineți că aceleași cârlige definite în fișierele șablon WooCommerce sunt cele pe care le puteți utiliza în fișierul functions.php al temei copil. Deci, dacă eliminați cârligele din fișierul șablon, acestea nu vor mai funcționa pe site-ul dvs. web.

Pentru mai multe ghiduri pentru a vă personaliza magazinul, aruncați o privire la:

• Cum să personalizați pagina de magazin în WooCommerce
• Editați pagina de produs WooCommerce în mod programatic
• Cum să personalizați pagina WooCommerce Contul meu

Ți-ai personalizat pagina de mulțumire? Ce metoda ai folosit? Anunțați-ne în secțiunea de comentarii de mai jos!