Cum să adăugați un meniu nou în meniul paginii MyAccount în Woocommerce

Căutați o modalitate simplă de a adăuga o nouă filă în pagina contului meu în WooCommerce, care să poată fi implementată rapid și ușor de către orice utilizator WooCommerce, indiferent de nivelul său de calificare? Soluția rapidă de a adăuga o nouă filă în pagina contului meu presupune adăugarea a două filtru WooCommerce care se ocupă de adăugarea meniului, iar celălalt se ocupă de redirecționarea către noua pagină adăugată la adresa URL respectivă.

În acest tutorial, vă voi arăta cum să adăugați exact un meniu în meniul contului meu WooCommerce și apoi să creați un filtru de redirecționare pentru a redirecționa utilizatorii către orice pagină pe care o preferați, inclusiv o redirecționare externă. Deci, să începem prin a înțelege cum funcționează pagina de meniu Contul meu.

Cum funcționează meniul paginii MyAccount WooCommerce

Aceste file de pe WooCommerce sunt practic meniuri și este posibil să filtrați conținutul acelei pagini și să obțineți matricea care afișează meniurile, apoi să adăugați conținutul în matrice și să returnați conținutul.

Cârlige pentru filtru WooCommerce/WordPress

Dacă nu ați mai lucrat cu filtrele înainte, am scris o introducere detaliată pentru a filtra în acest tutorial apply_filters și do_action unde am menționat cum funcționează filtrele WordPress .

Un alt exemplu bun este filtrul pe care l-am aplicat pe the_content în acest tutorial WordPress, pentru a adăuga conținut înainte sau după postarea sau conținutul paginii WordPress implicit .

Suficiente informații despre cârligele de filtrare, acum să ne concentrăm asupra modului de adăugare a meniului în pagina contului meu în WooCommerce.

Îmi place să încep toate tutorialele mele cu un rezumat rapid pas cu pas pentru a vă ajuta să învățați și să înțelegeți ce se întâmplă în cod. Nu-mi place doar să partajez codul și să vă rog să copiați-lipiți fără a explica ce face codul. Aceasta este o abordare bună, deoarece cititorii pot fi mai inovatori și pot adăuga caracteristici mai specifice fragmentului de cod.

Pași despre cum să adăugați o filă nouă în pagina Contului meu WooCommerce

Pentru a adăuga o filă nouă în pagina contului meu, aceasta implică trei pași care sunt următorii:

1. Creați un cârlig de filtru pentru a adăuga fila nouă în pagina contului meu, iar filtrul ar trebui să adune toate datele afișate în meniu și apoi să introducă noile date . (vă rugăm să rețineți acel cuvânt PUSH, voi explica mai multe detalii mai târziu în această postare)
2. Creați un al doilea filtru care adaugă redirecționarea URL a meniului pe care l-ați adăugat la primul pas la pagina pe care ați creat-o.
3. Adăugați acest cod în fișierul functions.php din tema dvs. sau puteți adăuga acest cod la o clasă sau funcție de plugin și veți adăuga cu succes noul meniu pe pagina contului meu în WooCommerce.

Adăugați meniu în pagina Contul meu în Woocommerce

În ultimele zile, un client mi-a cerut să adaug un nou meniu pe pagina contului meu într-un site WooCommerce existent. În mod ideal, meniul ar fi trebuit să redirecționeze către forumul pe care l-am adăugat anterior folosind BuddyPress.

În acest tutorial, vreau să presupun că acesta este cazul și vom continua și vom adăuga meniul la pagina My-Contul și ar trebui să redirecționeze către forum.

Pentru început, imaginea de mai jos indică produsul final al modului în care am adăugat noua filă în pagina contului meu a acestui site WooCommerce și redirecționez utilizatorii către Forum.

Adăugați primul filtru la Adăugare meniu la pagina Contul meu

Codul pentru adăugarea unei noi file în pagina contului meu include un cârlig de filtru și o funcție de apel invers, după cum se arată mai jos:

 //Primul cârlig care adaugă elementul de meniu în meniul WooCommerce contului meu 

funcția example_forum_link( $menu_links ){
 
	// vom agăța „womanide-forum” mai târziu
	$new = array( 'example-forum' => 'Exemplu de forum');
 
	// sau în cazul în care aveți nevoie de 2 link-uri
	// $new = array( 'link1' => 'Link 1', 'link2' => 'Link 2' );
 
	// array_slice() este bun atunci când doriți să adăugați un element între celelalte
	$menu_links = array_slice( $menu_links, 0, 1, adevărat) 
	+ $nou 
	+ array_slice($menu_links, 1, NULL, adevărat);
 
 
	returnează $menu_links;
 
 
}
add_filter ( 'woocommerce_account_menu_items', 'example_forum_link');

Când adăugați acest cod la functions.php, ar trebui să vedeți noul meniu pe pagina contului meu, așa cum se arată în imaginea de mai jos:

Cum funcționează codul

• În acest filtru folosim variabila $menu_links pe care o trecem la funcția de apel invers pentru a obține toate meniurile de pe pagina contului meu într-o matrice.
• După ce obținem matricea de link-uri de meniu, folosim funcția array_slice() pentru a extrage și apoi PUSH în noul nostru element de meniu, apoi punem toate meniurile într-o singură matrice și atașăm la hook-ul WooCommerce woocommerce_account_menu_items.
• În acest moment, elementul de meniu este acum afișat în meniul contului meu

După cum puteți vedea, filtrul a adăugat noul meniu în meniul implicit pentru contul meu. Când faceți clic pe meniu, veți fi redirecționat către o pagină 404, deoarece redirecționarea pentru acest nou articol de meniu funcționează acum așa cum se arată în imaginea de mai jos:

Această pagină nu există pe tabloul de bord WooCommerce, dar puteți vedea exemplul-forum slug , am adăugat în primul filtru și o vom folosi în al doilea filtru pentru a redirecționa către pagina forumului.

Adăugați al doilea filtru la Adăugare meniu pe pagina Contul meu

După cum sa menționat mai sus, al doilea filtru va adăuga pagina pe care dorim să o redirecționăm în acest meniu și, în acest caz, o putem adăuga folosind codul prezentat mai jos:

 // Al doilea filtru pentru a redirecționa punctul final WooCommerce către o adresă URL personalizată
funcția forum_example_hook_endpoint( $url, $endpoint, $value, $permalink ){
 
	if( $endpoint === 'exemplu-forum' ) {
	   
		// Aici adăugați adresa URL personalizată, ar putea fi externă, cum ar fi, în acest caz, trebuie să mergem la profilul meu de pe bbpress froum
		// Voi folosi această funcție (bp_core_get_username(bp_loggedin_user_id());) pentru a obține ID-ul de utilizator al profilului meu și pentru a-l adăuga la adresa URL, așa cum se arată mai jos 
		
		$url = site_url() .'/membri/' . bp_core_get_username( bp_loggedin_user_id());
 
	}
	returnează $url;
 
}


add_filter( 'woocommerce_get_endpoint_url', 'forum_example_hook_endpoint', 10, 4 );

Când adăugați acest cod chiar sub primul filtru pe care l-am adăugat la pasul de mai sus, meniul dvs. Exemplu de forum ar trebui să redirecționeze către profilul de utilizator specific, așa cum se arată în imaginea de mai jos, unde am redirecționat către profilul meu de pe forumul BBPress.

Completați fragmentul de cod pentru a adăuga o filă nouă în pagina Contul meu și redirecționați către orice pagină

Pentru a adăuga noul meniu la meniul paginii contului meu în WooCommerce, ar trebui să adăugați fragmentul de cod complet partajat mai jos, în fișierul functions.pfp al temei dvs. și să înlocuiți variabilele cu slugul și pagina respectivă în care doriți să redirecționați meniul.

 //Primul cârlig care adaugă elementul de meniu în meniul WooCommerce contului meu 

funcția example_forum_link( $menu_links ){
 
	// vom agăța „womanide-forum” mai târziu
	$new = array( 'example-forum' => 'Exemplu de forum');
 
	// sau în cazul în care aveți nevoie de 2 link-uri
	// $new = array( 'link1' => 'Link 1', 'link2' => 'Link 2' );
 
	// array_slice() este bun atunci când doriți să adăugați un element între celelalte
	$menu_links = array_slice( $menu_links, 0, 1, adevărat) 
	+ $nou 
	+ array_slice($menu_links, 1, NULL, adevărat);
 
 
	returnează $menu_links;
 
 
}

add_filter ( 'woocommerce_account_menu_items', 'example_forum_link');


// Al doilea filtru pentru a redirecționa punctul final WooCommerce către o adresă URL personalizată
funcția forum_example_hook_endpoint( $url, $endpoint, $value, $permalink ){
 
	if( $endpoint === 'exemplu-forum' ) {
	   
		// Aici adăugați adresa URL personalizată, ar putea fi externă, ca în acest caz, trebuie să mergem la profilul meu de pe bbpress froum
		// Voi folosi această funcție (bp_core_get_username(bp_loggedin_user_id());) pentru a obține ID-ul de utilizator al profilului meu și pentru a-l adăuga la adresa URL, așa cum se arată mai jos 
		
		$url = site_url() .'/membri/' . bp_core_get_username( bp_loggedin_user_id());
 
	}
	returnează $url;
 
}


add_filter( 'woocommerce_get_endpoint_url', 'forum_example_hook_endpoint', 10, 4 );

Încheierea

Crearea unei noi file de meniu în pagina contului meu de pe WooCommerce nu ar trebui să mai fie o provocare după ce ați citit acest tutorial. Am explicat pas cu pas și cu un exemplu practic cum să adăugați o filă nouă în pagina contului meu și să creați o redirecționare către o pagină la alegere. Am scris și alte tutoriale despre cum să adăugați redirecționarea WooCommerce după finalizare și redirecționarea WooCommerce după înregistrare. Dacă nu puteți implementa această soluție, puteți solicita asistența unui dezvoltator WooCommerce profesionist.