Cum se creează butonul WooCommerce Adaugă în coș în funcție de codul produsului
Publicat: 2021-02-24
WiEste posibil să creați butonul WooCommerce adăugați în coș după id-ul produsului și să utilizați butonul pe formulare, widget-uri, postări sau pagini și chiar pe șabloane. În mod ideal, butonul de adăugare în coș WooCommerce poate fi personalizat pentru a se potrivi cu o gamă largă de opțiuni personalizate.
Buton WooCommerce Adaugă în coș după ID produs
Într-o postare anterioară, am explicat cum să schimbați butonul WooCommerce adăugați în coș într-un link și, de asemenea, cum să schimbați butonul WooCommerce adăugați în coș pentru a citi mai multe.
Acestea sunt alte tutoriale anterioare care vă pot ajuta să aflați mai multe despre cum să personalizați butonul WooCommerce adăugați în coș:
- Cum să înlocuiți butonul Adăugați în coș cu linkul WooCommerce
- Cum să ascundeți butonul Citiți mai multe și să adăugați în coș butonul WooCommerce
- Cum să schimbați textul butonului Adăugați în coș în pagina magazinului WooCommerce
- Cum să schimbați textul Adăugați în coș Ghidul WooCommerce cu exemple
- Cum să adăugați un produs în coș în mod programatic în WooCommerce
- Cum să schimbați anunțul „Adăugat în coș” WooCommerce
- Cum să ascundeți prețul și să adăugați în coș pentru utilizatorii deconectați WooCommerce
După cum puteți vedea din lista de tutoriale de mai sus, există mai multe moduri în care puteți personaliza butonul WooCommerce adăugați în coș pentru a vă ajuta să realizați diferite machete de conținut sau design.
De exemplu, atunci când doriți să creați tabelul de prețuri WooCommerce, vi se poate solicita să creați butoane de adăugare în coș pe care le puteți adăuga la butonul de apel la acțiune din tabelul de prețuri.
Creați un produs simplu WooCommerce Butonul Adaugă în coș în funcție de codul produsului
Pentru a crea butonul de adăugare în coș WooCommerce după ID-ul produsului, trebuie să cunoașteți ID-ul produsului specific produsului pe care doriți să creați butonul de adăugare în coș. ID-ul produsului poate fi găsit cu ușurință pe pagina de prezentare generală a tuturor produselor, așa cum este explicat în acest tutorial despre – Cum să obțineți ID-ul produsului WooCommerce .
A dd to Cart Link
Acum puteți crea adresa URL de adăugare a coșului pe care nu o veți adăuga la codul butonului în locul în care doriți să afișați butonul. În acest caz, puteți crea linkul simplu pentru produs Adaugă în coș ca în codul de mai jos:
https://example.com/?add-to-cart=840
Adresa URL a site-ului dvs. ar trebui să înlocuiască partea example.com a adresei URL, iar ID-ul produsului specific ar trebui să înlocuiască ID-ul produsului 840 folosit în exemplul de mai sus.
Puteți adăuga acest lucru într-un cod de buton HTML ca în codul de mai jos:
Creați un produs simplu cu o cantitate WooCommerce Butonul Adaugă în coș după id-ul produsului
De asemenea, puteți adăuga cantitatea la adresa URL de adăugare în coș și puteți face acest lucru folosind diferiții parametri URL care sunt utilizați pentru a adăuga logica adreselor URL.
În acest caz, puteți extinde codul pe care l-am creat în pasul de mai sus și puteți crea un produs simplu WooCommerce butonul de adăugare în coș după ID-ul produsului cu cantitatea de 2, după cum urmează:
https://example.com/?add-to-cart=840&quantity=2
După cum puteți vedea, am adăugat un semn și cuvântul cantitate și l-am echivalat cu 2 numărul de articole pe care dorim să le adăugăm în coș când se face clic pe butonul aceluiași produs.
Pentru a adăuga această adresă URL la codul HTML și a crea butonul WooCommerce adăugați în coș după ID-ul produsului cu cantitatea, ar trebui să utilizați codul de mai jos:
Creați butonul WooCommerce Adaugă în coș după ID-ul produsului cu Redirecționare în coș
Pentru a facilita navigarea pe site-ul dvs. clienților magazinului WooCommerce, crearea de redirecționări este foarte importantă. În trecut, am evidențiat numeroasele modalități de a crea redirecționări WooCommerce.
În special, am împărtășit în aceste postări de blog - WooCommerce creează redirecționare după finalizare și WooCommerce redirecționează după deconectare și chiar a creat pluginul WooCommerce de redirecționare după finalizare pentru a vă ajuta să implementați redirecționarea după finalizare.
WooCommerce Redirecționează în coș după adăugare în coș
De asemenea, puteți crea redirecționare către coș cu butonul WooCommerce adăugați în coș după ID-ul produsului. Puteți realiza acest lucru schimbând codul pe care l-am împărtășit la pasul de mai sus, astfel încât să fie după cum urmează:
https://example.com/cart/?add-to-cart=840
După cum vedeți, am adăugat coșul la adresa URL pentru a ne asigura că utilizatorul este redirecționat către coș după ce adaugă produsul în coș. Codul complet cu codul butonului HTML este următorul:
WooCommerce Redirecționează către Checkout după adăugarea în coș
De asemenea, puteți crea redirecționare către finalizarea comenzii cu butonul WooCommerce adăugați în coș după ID-ul produsului. Puteți realiza acest lucru schimbând codul pe care l-am împărtășit la pas, adăugând checkout -ul pe adresa URL de mai sus, astfel încât să fie după cum urmează:
https://example.com/checkout/?add-to-cart=840
După cum vedeți, am adăugat opțiunea de finalizare a achiziției la adresa URL pentru a ne asigura că utilizatorul este redirecționat către finalizarea achiziției după ce adaugă produsul în coș. Codul complet cu codul butonului HTML este următorul:
Concluzie
În acest tutorial, am evidențiat diferitele moduri în care puteți crea butonul WooCommerce adăugați în coș în funcție de ID-ul produsului. Am văzut, de asemenea, cum să adăugați redirecționare la butonul de adăugare în coș, precum și cum să adăugați cantitatea de produs la adăugare. butonul la coș.
Sper că acum puteți crea butonul WooCommerce adăugați în coș după ID-ul produsului și îl puteți utiliza în tabelul de prețuri, formulare și în șabloane. De asemenea, puteți personaliza în continuare butonul de adăugare în coș folosind clasa de butoane pe care am adăugat-o la codul de mai sus. Dacă încă vă personalizați site-ul, puteți beneficia de ideile pe care le-am împărtășit pe Ultimate WooCommerce Hide Guide.
Pentru utilizatorii WooCommerce care au tema Storefront instalată și doresc să o personalizeze în continuare, am împărtășit o colecție genială de peste 80 de sfaturi de personalizare a temei WooCommerce Storefront , care vă vor ghida cum să creați un aspect personalizat al site-ului dvs. folosind tema WooCommerce implicită - Storefront .
Articole similare
- Cum se creează câmpuri de plată condiționate WooCommerce
- Cum se creează codul scurt de deconectare pentru autentificare WooCommerce
- Cum se schimbă culoarea butoanelor tema vitrinei
- Cum să obțineți titlul produsului WooCommerce
- Cum să ascundeți prețul și să adăugați în coș pentru utilizatorii deconectați WooCommerce
- Cum să ascundeți butonul Actualizare coș Pagina de coș WooCommerce
- Cum să înlocuiți butonul Adăugați în coș cu linkul WooCommerce
- Cum să ascundeți prețul dacă este zero în WooCommerce
- Cum se creează o temă WooCommerce Storefront Child [Ghid complet]
- Cum să ascundeți opțiunea de administrare a centrului de marketing WooCommerce
- Cum să obțineți ID-ul produsului pe pagina de finalizare a comenzii sau pe pagina de comandă în WooCommerce
- Cum să obțineți detaliile comenzii după finalizarea comenzii în WooCommerce
- Cum să redirecționați către coș după autentificare în WooCommerce
- Cum să adăugați WooCommerce Redirecționarea paginii contului meu
- Cârligul de redirecționare pentru autentificare WooCommerce explicat cu un exemplu
- Cum să dezactivați temporar Checkout în WooCommerce
- Cum să configurați blogul WooCommerce Storefront