Extensia
Popup Adăugare în Coș adaugă o funcționalitate de tip popup pentru Easy Digital Downloads. Când este activată, după ce un client face clic pe un buton „Adăugare în Coș”, apare o mică fereastră modală care îi oferă opțiunea de a merge direct la pagina de finalizare a comenzii sau de a continua cumpărăturile. Iată un exemplu folosind stilizarea implicită a temei TwentyFifteen.
Iată cum se configurează popup-ul.
Instrucțiuni de configurare pentru Popup Adăugare în Coș
- Odată instalat, localizați setările pentru această extensie prin admin WordPress → Descărcări → Setări → Extensii → Popup Adăugare în Coș
- Când activați pluginul, popup-ul va fi dezactivat implicit. Acest lucru este pentru a vă oferi șansa de a ajusta setările înainte de a-l activa pe site-ul dvs. Popup-ul poate fi apoi activat bifând caseta de selectare Activare Popup.
Notă: Când utilizați funcția butonului „Cumpără Acum” sau extensia Descărcări Gratuite, popup-ul va fi dezactivat automat pentru a nu interfera cu redirecționările gateway-ului de plată sau cu popup-urile terților.
Personalizare
Aspect General
Previzualizare Popup: Acest buton vă permite să declanșați un popup în timp ce vă aflați pe pagina de setări pentru a vedea modificările înainte de a le salva. Puteți folosi, de asemenea, linkul „Previzualizare Popup” din Bara de Administrare. Am adăugat acest lucru pentru a nu fi nevoit să derulați constant înapoi în partea de sus a paginii de setări pentru a previzualiza popup-ul.
Rețineți că previzualizarea s-ar putea să nu fie complet exactă atunci când utilizați shortcode-uri, deoarece unele stiluri s-ar putea să nu fie încărcate în Administrarea WordPress. Se recomandă previzualizarea pe front-end-ul site-ului dvs. când ați terminat pentru a confirma aspectul popup-ului.
Text Popup: Aici puteți seta textul afișat pe popup. Dacă pluginul detectează „%s” (fără ghilimele) oriunde în textul acestei opțiuni, acesta va fi înlocuit cu numele produsului descărcabil pe care utilizatorul l-a adăugat în coș. Aveți, de asemenea, opțiunea de a adăuga fișiere media (cum ar fi imagini), embed-uri și chiar shortcode-uri în interiorul popup-ului.
Text Popup Plural: Similar cu Text Popup, acest text este afișat pe popup atunci când mai multe articole au fost adăugate în coș în același timp. Acest lucru este tipic atunci când utilizați opțiuni de prețuri variabile care permit adăugarea simultană a mai multor opțiuni. Din nou, aveți, de asemenea, opțiunea de a adăuga fișiere media (cum ar fi imagini), embed-uri și chiar shortcode-uri în interiorul popup-ului.
Amintiți-vă că puteți extinde bara de instrumente a editorului făcând clic pe butonul din dreapta extrem al editorului!
Dimensiune Font: Aceasta vă permite să schimbați dimensiunea generală a fontului utilizat în popup. Sunt acceptate diverse formate CSS aici.
- Dimensiunile în pixeli sunt dimensiuni fixe absolute. Exemplu: 12px
- Dimensiunile procentuale sunt relative la dimensiunea implicită a fontului temei. Exemplu: 120% (cu 20% mai mare decât fontul temei).
- Valorile „em” sunt similare cu procentele, unde 1em este dimensiunea implicită a fontului. Exemplu: 2em (de două ori mai mare decât implicit).
Culoare text: Culoarea textului popup-ului. Pentru a seta culoarea, faceți clic pe caseta de culoare pentru a afișa selectorul de culori.
Culoare fundal: Culoarea fundalului popup-ului. Pentru a seta culoarea, faceți clic pe caseta de culoare pentru a afișa selectorul de culori.
Iată un exemplu cu culoarea textului setată la galben și culoarea fundalului setată la albastru:
Bordură: Această opțiune vă permite să stilizați bordura popup-ului, care apare în jurul marginii casetei popup. Cele trei opțiuni sunt lățimea (sau grosimea), stilul și culoarea, respectiv.
Rază bordură: Raza colțurilor bordurii. Cu cât această valoare este mai mare, cu atât colțurile vor fi mai rotunjite. Acest lucru se aplică și dacă ați setat bordura ca nefiind vizibilă (lățimea este zero, stilul este „none” sau culoarea este transparentă).
Umbră: Această opțiune vă permite să adăugați o umbră popup-ului prin setarea cantității de umbră (dimensiune și grosime) și a culorii umbrei. Exemplul de mai jos adaugă o umbră verde închis cu o cantitate de umbră de 15:
Culoare suprapunere: Termenul suprapunere se referă la culoarea care acoperă restul paginii atunci când popup-ul este afișat. Puteți schimba culoarea făcând clic pe caseta de culoare pentru a afișa selectorul de culori, care include și o opțiune de transparență. Exemplul de mai jos schimbă suprapunerea într-un portocaliu deschis, semi-transparent:
Dimensiuni popup
Dimensiune: Aici puteți controla dimensiunea popup-ului. Sunt acceptate diverse formate CSS, inclusiv pixeli și procente.
- Dimensiunile în pixeli sunt dimensiuni fixe. Exemplu: 500px (500 pixeli pe ecranul utilizatorului)
- Dimensiunile procentuale sunt relative la dimensiunea ferestrei browserului utilizatorului. Exemplu: 60% (60% din ecranul utilizatorului)
Dacă lățimea sau înălțimea sunt lăsate goale, popup-ul le va calcula automat pentru a se potrivi conținutului.
Următorul exemplu demonstrează un popup cu o lățime setată la 500px și înălțimea lăsată goală pentru a fi calculată automat.
Padding: Padding-ul se referă la spațiul dintre marginea popup-ului și conținutul acestuia, așa cum se arată în imaginea următoare:
Zona în verde este ceea ce se numește „padding”.
Stiluri butoane
Bordură buton: Bordura pentru butoanele afișate în popup, similară cu opțiunea anterioară Bordură. Puteți seta grosimea, stilul și culoarea bordurii, respectiv.
Rază colțuri: Raza colțurilor butonului. Cu cât această valoare este mai mare, cu atât colțurile vor fi mai rotunjite. Acest lucru se aplică și dacă bordura butonului nu este vizibilă (lățimea setată la 0, stilul este „none” sau culoarea este transparentă).
De exemplu: o bordură albastră „puncte” cu o lățime de 5px și o rază a colțurilor de 3px:
Padding buton: Similar cu opțiunea de Padding a popup-ului, aceasta vă permite să ajustați spațiul din interiorul butonului. De exemplu, următorul folosește un padding de 6px sus și jos și un padding de 30px stânga și dreapta.
Direcția Butoanelor: Puteți seta butoanele să apară una lângă alta orizontal sau să fie stivuite una peste alta vertical. Setarea implicită este orizontală.
Alinierea Butoanelor: Puteți alege între alinierea la stânga, centru și dreapta. Alegerea stânga sau dreapta va împinge butoanele spre acea parte respectivă, în timp ce alegerea centru va poziționa butoanele în centrul popup-ului.
Ordinea Butoanelor: Această opțiune vă permite să alegeți ce buton este afișat primul. Dacă Direcția Butoanelor este setată la orizontal, atunci această opțiune va determina ce buton este afișat în stânga. Dacă Direcția Butoanelor este setată la vertical, atunci această opțiune va determina ce buton este afișat deasupra.
Buton Checkout/Continuare
Următoarele două secțiuni constau în opțiuni identice care vă permit să ajustați aspectul individual al ambilor butoane.
Activat: Alegeți dacă doriți să afișați sau să ascundeți butonul.
Text: Puteți personaliza textul fiecărui buton așa cum doriți.
Culoare Text: Culoarea textului din interiorul butonului.
Culoare Text la Hover: Culoarea textului din interiorul butonului atunci când cursorul mouse-ului plutește deasupra butonului.
Culoare Fundal: Culoarea de fundal a butonului.
Culoare Fundal la Hover: Culoarea de fundal a butonului atunci când cursorul mouse-ului plutește deasupra butonului.
Următorul exemplu folosește butoane albe cu text negru care se transformă în butoane roșii cu text alb atunci când cursorul mouse-ului este deasupra butonului.
Color Picker, Explicat
