Cum să eliminați cu ușurință insigna de vânzare din magazinul dvs. WooCommerce? (cu video)

Ultima actualizare – 24 februarie 2020 Când oferiți reduceri la magazinul dvs. WooCommerce, insigna de vânzare este adăugată automat la produs(e). Deși acest lucru poate atrage atenția clienților potențiali asupra produsului, pot exista situații în care doriți să oferiți produsul cu reducere imediat, fără a atrage atenția utilizatorului. Unii proprietari de magazine ar dori, de asemenea, să personalizeze insigna de vânzare în funcție de cerințele lor. Ei pot personaliza insigna pentru a o face mai atractivă, pot schimba textul și culoarea și așa mai departe. În acest articol, vom vedea cum să eliminați cu ușurință insigna de vânzare din magazinul dvs. WooCommerce. Vom căuta, de asemenea, modalități de personalizare a insigna de vânzare.
Eliminarea insigna de vânzare WooCommerce Puteți elimina insigna de vânzare WooCommerce în două moduri simple:
Metodele enumerate mai sus pot fi înlocuite de unele teme. Prin urmare, puteți testa și utiliza singur metoda dorită. 1. Utilizarea fragmentului de cod Mai jos este o captură de ecran care arată în mod prestabilit insignele de reducere pentru produse de pe pagina magazinului.
Vizualizare implicită a paginii magazinului cu insigna de vânzare Adăugați fragmentul de cod de mai jos în fișierul functions.php al temei site-ului dvs. activat. Fragmentul de cod este aplicabil atât pentru pagina magazinului, cât și pentru paginile individuale ale produselor.
add_filter('woocommerce_sale_flash', 'lw_hide_sale_flash');
funcția lw_hide_sale_flash()
{
returnează fals;
} Sfat: Citiți articolul de blog pentru a afla cum să actualizați un fragment de cod în fișierul functions.php. Captura de ecran de mai jos arată pagina magazinului fără insigne de vânzare WooCommerce. Puteți observa că prețul de vânzare este încă aplicat.
Insigna de vânzare a fost eliminată din pagina magazinului 2. Folosind CSS Puteți adăuga fragmentul CSS utilizând Personalizatorul WordPress. Deschideți Personalizatorul și faceți clic pe CSS suplimentar , așa cum se arată în captura de ecran de mai jos. Puteți observa și ecusoanele de vânzare vizibile pentru produse.
Setare CSS suplimentară WordPress Adăugați fragmentul de mai jos pe site. .woocommerce span.onale{
afișaj: niciunul;
} WordPress va previzualiza modificările actualizate. Insigna de vânzare va fi acum ascunsă din paginile magazinului și al produselor. Puteți face clic pe butonul Publicare pentru a salva modificările. Captura de ecran de mai jos arată cum ar trebui adăugat CSS-ul și modificarea actualizată. adică, insigna de vânzare a fost eliminată.
CSS suplimentar adăugat Personalizarea insigna de vânzare WooCommerce În loc să eliminați complet insigna de vânzare, puteți alege să o personalizați. Puteți schimba textul, culoarea, poziția, adăugați imagine, programați-l, automatizați și faceți multe altele. Vom analiza câteva dintre personalizările pe care le puteți face cu fragmente de cod, precum și cu pluginuri.
1. Utilizarea fragmentelor de cod Vom analiza câteva fragmente de cod de bază care vă ajută să personalizați insigna de vânzare în moduri diferite. 1) Modificarea textului insigna de vânzare Să schimbăm textul insigna de reducere din „Reducere” implicită la „Ofertă de reducere”. Pentru a face acest lucru, adăugați fragmentul de cod de mai jos în fișierul functions.php al temei site-ului dvs. activat. add_filter( 'woocommerce_sale_flash', 'lw_replace_sale_text');
funcția lw_replace_sale_text( $html ) {
return str_replace( __( 'Reducere!', 'woocommerce' ), __( 'Ofertă reducere', 'woocommerce' ), $html );
} În fragmentul de cod de mai sus, puteți înlocui textul „Ofertă reducere” cu textul dorit.
Captura de ecran de mai jos arată cum este afișat textul actualizat al insigna de vânzare.
Textul insigna de vânzare a fost modificat 2) Înlocuirea textului insigna de vânzare cu o imagine Puteți adăuga o imagine în locul textului implicit. Din nou, trebuie să adăugați fragmentul de cod de mai jos în fișierul functions.php al temei site-ului dvs. activat.
add_filter('woocommerce_sale_flash', 'lw_custom_sales_badge');
funcția lw_custom_sales_badge() {
$img = '<img width="100px" height="100px" src="http://demostore.com/wp-content/uploads/2019/02/Sale-Red-Tag.png"></img> ';
returnează $img;
} Când utilizați fragmentul de cod de mai sus, nu uitați să înlocuiți valoarea URL în atributul src al etichetei <img> .
Captura de ecran de mai jos arată imaginea personalizată adăugată în loc de insigna de vânzare. Trebuie să rețineți că poziția imaginii poate diferi în alte teme.
Imagine adăugată pentru Insigna de vânzare 2. Utilizarea pluginurilor Există mai multe plugin-uri pe piață, care fac mai mult decât schimbarea textului și a culorii insigna de vânzare WooCommerce. Pluginurile vă oferă mai mult control și vă permit să personalizați diferite aspecte ale insigna de vânzare. Unele dintre cele mai importante pluginuri de gestionare a insignelor WooCommerce sunt:
Pentru a înțelege mai multe caracteristici ale fiecăruia dintre pluginurile de mai sus, citiți articolul nostru de blog. PS, am discutat, de asemenea, unele dintre cele mai bune practici pentru utilizarea insignelor de produs în articol. Nu ratați!
Dacă preferați să înțelegeți folosind un tutorial video, urmăriți videoclipul de mai jos. De asemenea, puteți viziona videoclipul pentru a vedea pluginurile de top de gestionare a insignelor. Unele dintre pluginuri ar putea fi adăugate sau eliminate din lista de pluginuri de mai sus, în videoclip. Concluzie Insignele de reducere sunt o modalitate excelentă de a atrage atenția clienților și de a crește vânzările în magazinul dvs. WooCommerce. Deși poate funcționa bine pentru unii proprietari de magazine, unii ar putea considera că este inutil. Am discutat despre modalități de a elimina insigna de vânzare WooCommerce folosind un fragment de cod și CSS. Și a discutat, de asemenea, modalități de personalizare a insignelor de vânzare sub forma unui fragment de cod și a pluginurilor.
Unele fragmente de cod sunt înlocuite de teme. Prin urmare, este mai bine să le testați și să le folosiți. Deși, am testat toate fragmentele de cod și funcționează bine cu tema noastră. Dacă cauți mai multă personalizare, există întotdeauna pluginuri!
Puteți consulta articole de blog despre WordPress Basics, WordPress Security & Performance sau personalizări WooCommerce pentru a afla despre diferite aspecte ale WordPress și WooCommerce. Sau continuați să explorați LearnWoo pentru mai multe articole uimitoare.
homefinance blog