Cum să personalizați șabloanele de e-mail pentru data de livrare a comenzii cu Yaymail

Publicat: 2021-07-30

Depunând un pic mai mult efort în aspectul tău, poate fi un drum lung. Acum imaginați-vă că vă comercializați produsul către un client în haine de noapte. Deși ar putea suna amuzant, cred că putem fi cu toții de acord că șansele ca acel client să-ți cumpere produsul ar putea fi foarte mici. Gândiți-vă la șabloanele dvs. de design de e-mail ca la ținuta - aspectul mărcii dvs. pentru întreaga lume. Amplificarea puțin nu numai că va face marca dvs. să iasă în evidență, ci va atrage și atenția cititorului. Este posibil să fiți deja conștienți de modul în care pluginul nostru Order Delivery Pro pentru Woocommerce oferă o modalitate de a trimite e-mailuri de memento de livrare. Cu ajutorul pluginului de personalizare și previzualizare a șablonului de e-mail WooCommerce Yaymail , veți putea personaliza Data de livrare a comenzii Pro pentru șabloanele de e-mail WooCommerce.

Vă prezentăm Yaymail – Un plugin de personalizare și previzualizare WooCommerce

Cel mai adesea, utilizatorii WooCommerce sunt blocați cu șabloanele de e-mail implicite plictisitoare care sunt folosite de fiecare magazin WooCommerce. Intră în Yaymail, un plugin WooCommerce de personalizare a șablonului de e -mail și de previzualizare a e-mailului care vă va ajuta să vă ocupați de acest lucru. Dacă sunteți dispus să cheltuiți puțin în plus pentru a vă face marca să iasă în evidență și pentru a vă asigura că clienții dvs. iau în seamă acest lucru, puteți utiliza acest plugin pentru a „înfrumuseța e-mailurile, previzualiza modificările pe care le-ați făcut în șablonul de e-mail și îi face pe clienți să vină. înapoi pentru mai mult.”

Unele dintre caracteristicile Yaymail sunt:

  • Adăugarea cu ușurință de coloane și blocuri de elemente
  • Editarea conținutului și a conținutului media într-o singură fereastră
  • Personalizarea fontului, culorii, fundalului, umpluturii și așa mai departe în șabloanele de e-mail
  • Previzualizare live a șablonului de e-mail
  • Salvarea și trimiterea unui e-mail de test
  • 20+ elemente

Cu pluginul Yaymail de personalizare a șablonului de e-mail WooCommerce, puteți glisa și plasa cu ușurință elemente în șabloanele dvs. de e-mail. Chiar și un începător își poate da seama cu ușurință cum să folosească acest plugin.

Data de livrare a comenzii Pro și WooCommerce Personalizarea șablonului de e-mail și pluginul de previzualizare – Yaymail

Pentru a reproiecta șabloanele de e-mail pentru livrarea comenzii Dat Pro, veți avea nevoie de:

  • Comanda Data de livrare Pro pentru pluginul WooCommerce (99 USD)
  • Plugin Yaymail (gratuit)
  • Supliment Yaymail Premium pentru data livrării comenzii Pro (39 USD)

După ce le adăugați în magazinul dvs. WooCommerce, puteți accesa șabloanele de e-mail ale pluginului WooCommerce Data de livrare a comenzii dvs. din WooCommerce > Setări > E-mailuri , așa cum se arată mai jos:

How to customize Order Delivery Date Pro email templates with Yaymail

După ce ajungeți aici, puteți derula în jos pentru a găsi Șabloanele Pro pentru data livrării comenzii, astfel:

How to customize Order Delivery Date Pro email templates with Yaymail - Tyche Softwares

Faceți clic pe opțiunea „Personalizați cu YayMail” a șablonului de e-mail pe care alegeți să îl reproiectați.

Șablon de e-mail 1: Data și ora livrării actualizate

Să presupunem că doriți să personalizați șablonul de e-mail actualizat pentru data și ora livrării . Odată ce ați făcut clic pe „Personalizați cu YayMail”, iată cum va apărea șablonul:

How to customize Order Delivery Date Pro email templates with Yaymail

În partea de sus a șablonului, veți găsi următoarele detalii:

How to customize Order Delivery Date Pro email templates with Yaymail - Tyche Softwares

Personalizatorul de e-mail WooCommerce vă va ajuta să alegeți și să alegeți diferite elemente sau blocuri și diferitele lor modele pe care le puteți adăuga șablonului.

Cu ajutorul setarii care se afla alaturi de personalizare, puteti alege din optiunea drop-down sabloanele de e-mail precum modelul 'Data de livrare si ora actualizate'. Chiar lângă acesta, veți găsi meniul drop-down pentru a alege un anumit șablon de e-mail pentru Comandă. De exemplu, 325- TanishaMehta. Apoi, aveți diverse alte opțiuni, cum ar fi Shortcodes, Trimitere e-mail de testare, Șablon necompletat, Copiere șablon, Opțiuni de resetare șablon .

Apoi, dacă doriți să porniți șablonul după ce l-ați creat, puteți face acest lucru activând șablonul . Puteți chiar să previzualizați cum va apărea șablonul pe dispozitivele desktop sau pe dispozitivele mobile făcând clic pe opțiunea „Previzualizare” . În cele din urmă, puteți „Salva” șablonul de e-mail proiectat după ce ați terminat de făcut modificările. Să începem prin a personaliza șablonul de e-mail actualizat pentru data și ora livrării .

În primul rând, vom schimba sigla acestui șablon de e-mail. Găsiți sigla WooCommerce în șablonul de e-mail și faceți clic pe el. În partea stângă, veți găsi opțiunea de a edita sigla, unde puteți modifica imaginea, alinierea, umplutura și așa mai departe. Iată cum va apărea:

How to customize Order Delivery Date Pro email templates with Yaymail

În continuare, vom încărca propriul logo după ce facem clic pe opțiunea „Schimbați imaginea” . Împreună cu aceasta vom adăuga o adresă URL pentru logo, îi vom schimba culoarea de fundal într-o nuanță de albastru, vom schimba lățimea la 150 de pixeli . Modificările vor apărea direct în șablon, așa cum puteți vedea mai jos:

How to customize Order Delivery Date Pro email templates with Yaymail

După aceasta, vom schimba acum titlul e- mailului făcând clic pe el. Vom schimba culoarea de fundal din violet în alb, iar culoarea fontului textului în nuanța anterioară de albastru. Vom schimba și fontul în sine. Aici, am decis să alegem fontul „Arial Black”, Gadget, sans-serif :

How to customize Order Delivery Date Pro email templates with Yaymail

Acum vom edita elementul de text care spune „Data și ora livrării au fost actualizate de către client. Detaliile comenzii și detaliile actualizate de livrare sunt următoarele” . Urmând familia noastră anterioară de fonturi, vom aplica același lucru și aici. Am făcut, de asemenea, câteva modificări la padding-ul textului, așa cum puteți vedea mai jos:

How to customize Order Delivery Date Pro email templates with Yaymail

În mod similar, am făcut și modificările în tabelul șablonului de e-mail în ceea ce privește culoarea, fontul de umplutură etc.

How to customize Order Delivery Date Pro email templates with Yaymail

Acum, dorim să adăugăm pictogramele noastre de rețele sociale la șablonul de e-mail. Pentru aceasta, vom merge la WooCommerce Email Customizer > Elemente > Social Icon și apoi glisăm acel element în șablonul de e-mail.

How to customize Order Delivery Date Pro email templates with Yaymail

După ce îl glisăm, vom șterge pictogramele sociale de care nu avem nevoie și le vom adăuga pe cele de care vom solicita. De exemplu, vom păstra pictograma Facebook și vom adăuga și pictograma Twitter. Vom adăuga link-ul URL care va fi deschis odată ce o persoană face clic pe pictograma social media.

How to customize Order Delivery Date Pro email templates with Yaymail

Aici, putem face modificări la dimensiunea pictogramei, spațierea acesteia, culoarea de fundal și multe altele. Iată cum va apărea după efectuarea acestor modificări:

How to customize Order Delivery Date Pro email templates with Yaymail

În cele din urmă, am făcut și următoarele modificări în subsolul nostru:

How to customize Order Delivery Date Pro email templates with Yaymail

După ce ați făcut toate aceste modificări, puteți face clic pe butonul „Salvați” situat în colțul din dreapta sus al paginii. Când facem clic pe opțiunea „Previzualizare” , iată cum va apărea șablonul nostru nou proiectat:

How to customize Order Delivery Date Pro email templates with Yaymail

Să vedem cum va apărea șablonul în căsuța de e-mail:

How to customize Order Delivery Date Pro email templates with YaymailHow to customize Order Delivery Date Pro email templates with Yaymail - Tyche Softwares

Șablon de e-mail 2: Memento de livrare

Să personalizăm șablonul de e-mail „Memento de livrare”. Pentru aceasta, am luat comanda numărul 143. Iată cum arată șablonul implicit de e-mail:

customizing the 'Delivery Reminder' email template

În primul rând, vom începe prin a înlocui mai întâi sigla, așa cum am procedat anterior pentru șablonul de e-mail actualizat pentru data și ora livrării.

customizing the 'Delivery Reminder' email template

De data aceasta, vom alege o nuanță mai închisă de gri pentru culoarea noastră de fundal, precum și șablonul nostru de e-mail. Continuând mai departe, vom face modificări la titlul de e- mail . Vom personaliza textul adăugând „Hei! înainte de „Acesta este mementoul de livrare”.

Apoi îl vom muta în centru și chiar vom schimba culoarea de fundal la ceva mai întunecat. Ne vom păstra culoarea fontului alb și vom schimba fontul text în Tahoma, Geneva, sans-serif , după cum puteți vedea mai jos:

customizing the 'Delivery Reminder' email template

În continuare vom schimba textul care se adresează clientului nostru cu următoarele modificări:

Woocommerce order email customization: changing the text that addresses customer

Vom continua apoi cu textul care va afișa detaliile comenzii. Pentru aceasta, am dori să-l îndrăznăm astfel încât clientul să poată înțelege de unde exact poate începe să citească pentru a afla detaliile comenzii sale.

Woocommerce order email customization: changing the text that addresses customer

Apoi procedăm la editarea designului articolului de comandă cu culorile alese anterior pentru culoarea de fundal, culoarea titlului, culoarea chenarului și culoarea textului, așa cum se arată mai jos:

Woocommerce order email customization: changing the text that addresses customer

Să modificăm și textul comenzii de vizualizare , deplasându-l în centru și schimbându-i culoarea de fundal într-un albastru mai închis, care atrage clientul spre acesta.

How to customize woocommerce order delivery pro email with Yaymail: Changing the View Order text

Acum dorim să separăm secțiunea Detalii comandă a e-mailului, așa că vom merge la Elemente > General > Divizor și vom trage acel element în șablon.

How to customize woocommerce order delivery pro email with Yaymail

Am făcut modificările necesare, cum ar fi înălțimea liniei, lățimea, culoarea etc. la separator și după ce facem acest lucru, acestea vor apărea astfel:

How to customize woocommerce order delivery pro email with Yaymail

La fel ca primul nostru șablon de e-mail, să adăugăm pictogramele noastre de rețele sociale, astfel încât clienții noștri să ne poată urmări și să fie la curent cu cele mai recente produse. Vom merge la Elemente > Pictograme sociale .

How to customize woocommerce order delivery pro email with Yaymail: Adding social icons

După ce îl tragem, iată cum va apărea:

How to customize woocommerce order delivery pro email with Yaymail

Vom elimina mai întâi pictogramele Youtube și Linkedin făcând clic pe pictograma coș de gunoi .

How to customize woocommerce order delivery pro email with Yaymail

Apoi, vom adăuga pictograma Twitter și vom face modificări la Spațierea pictogramelor, Lățimea și chiar tema stilului acesteia .

How to customize woocommerce order delivery pro email with Yaymail

Acum, nu dorim să arătăm textul care spune că site-ul nostru a fost construit cu WooCommerce. Așa că îl vom șterge făcând clic pe cele trei puncte și apoi făcând clic pe opțiunea „Eliminare” .

How to customize woocommerce order delivery pro email with Yaymail

În schimb, să adăugăm câteva imagini ale produselor noastre pentru client. Accesați Elemente și alegeți elementul „Lista de imagini” și trageți-l în șablonul de sub „Vizualizare comandă”.

Adding images to your Woocommerce order email template

Aici, vom merge cu trei imagini de atașat, așa că vom alege 3 coloane. După adăugarea imaginilor la fiecare dintre coloane, vom face modificări ale alinierii, culorii de fundal etc.

Adding images to your Woocommerce order email template

Nu uitați să adăugați link-ul URL al produsului la imagine, astfel încât atunci când clientul face clic pe imagine, acesta să fie direcționat către pagina de produs a articolului respectiv.

How to customize Order Delivery Date Pro email templates with Yaymail - Tyche Softwares

Deasupra, permiteți-ne să adăugăm un text care spune „Alte produse care v-ar putea plăcea” , așa:

Adding text to your WooCommerce email template

În cele din urmă, să adăugăm sigla mărcii noastre la sfârșitul șablonului, alegând elementul „Logo” din WooCommerce Email Customizer.

adding logo by choosing the 'Logo' element from WooCommerce Email Customizer

După ce ne-am adăugat sigla, adresa URL și alte detalii, șablonul nostru de e-mail de memento de livrare este gata. Îl vom „salva” și iată cum va arăta:

adding logo by choosing the 'Logo' element from WooCommerce Email Customizer

Acum, să trimitem un e-mail de test. Iată cum va arăta e-mailul de test în căsuța de e-mail a clientului dvs.:

Woocommerce email customization for order delivery date pro: testing admin email notifications How to customize Order Delivery Date Pro email templates with Yaymail - Tyche Softwares

Șablon de e-mail 3: Memento de livrare pentru administrator

În cele din urmă, să reproiectăm șablonul de e-mail „Memento de livrare pentru administrator” . Iată cum va arăta șablonul implicit de e-mail:

Admin Delivery Reminder for order email template customization

Să începem prin a introduce logo-ul nostru și a-l face mai mic în comparație cu înainte.

image showing how to insert logo to your order email template in Woocommerce

În continuare, vom schimba titlul de e-mail pentru a se potrivi cu schema noastră de culori estetice albastre.

Adding colors to your WooCommerce order email template

În continuare, vom schimba textul implicit în „Iată mementoul pentru livrarea de mâine” . Îl vom face aldine și îi vom crește și dimensiunea fontului:

Woocommerce email template customization: changing the default text to 'Here is the reminder for your delivery tomorrow for order delivery pro

Apoi, dorim să arătăm administratorului adresa de livrare și facturare. Așadar, vom adăuga elementul „Adresa de expediere de facturare” trăgându-l, plasându-l chiar sub elementul de text „Iată mementoul pentru livrarea de mâine”.

Adding shipping and billing information to the order delivery email template

De asemenea, îi vom schimba culoarea în ceva de genul acesta:

Styling the admin email template in woocoomerce with Yaymail

Apoi, dorim să arătăm și lista de articole de comandă administratorului, așa că vom selecta elementul „Articol de comandă”.

Customizing the admin email template in woocoomerce with Yaymail

După glisarea elementului în șablonul de e-mail, detaliile comenzii noastre vor apărea direct pe acesta. Putem face modificări fundalului și culorii sale, așa cum se arată mai jos:

Customizing the admin email template in woocoomerce with Yaymail

Nu dorim să avem elementul text implicit care spune creat cu WooCommerce, așa că îl vom „Șterge” astfel:

Customizing the admin email template in woocoomerce with Yaymail

În cele din urmă, pentru ca șablonul să pară uniform și pe marcă, vom adăuga logo-ul mărcii noastre la sfârșit, în felul următor:

Customizing the admin email template in woocoomerce with Yaymail

Iată cum va apărea șablonul nostru de e-mail de memento de livrare pentru administrator după efectuarea acestor modificări:

Image showing the admin delivery reminder email template

De asemenea, putem trimite acest șablon ca e-mail de test. Iată cum va apărea Mementoul de livrare a administratorului în căsuța de e-mail a administratorului:

Admin delivery reminder email with order details

How to customize Order Delivery Date Pro email templates with Yaymail - Tyche Softwares

Concluzie

În această postare, am descris cum puteți reproiecta cele trei șabloane de e-mail diferite ale pluginului nostru pentru data livrării comenzii Pro folosind pluginul de personalizare a șablonului de e-mail WooCommerce Yaymail. Deși am putut acoperi doar câteva dintre funcțiile Yaymail, suntem siguri că experții în proiectare pot folosi alte elemente, cum ar fi atașarea videoclipurilor sau chiar butoane la șabloanele lor de e-mail.

Continuați să explorați și să ne spuneți în comentariile de mai jos cum ați reușit să vă personalizați e-mailurile Pro Data de livrare a comenzii cu Yaymail!