[Hoe] Aanmeldings- / uitloglinks toevoegen voor een verbeterde WooCommerce-gebruikerservaring

WooCommerce

WooCommerce is de meest populaire e-commerce plug-in in het WordPress-ecosysteem. Het heeft echter een beetje een zeurend probleem met de bruikbaarheid. Standaard, WooCommerce wordt niet weergegeven of een gebruiker al dan niet is ingelogd op uw eCommerce-site.

Inhoud[Producten per pagina]

Voeg een Woocommerce login logout link toe aan het Woocommerce menu

Dit kan soms verwarrend zijn voor uw klanten. Aangezien de meeste populaire e-commerce winkels (bijvoorbeeld ebay of Amazon) een Login-knop in hun menu tonen, kunnen klanten hetzelfde verwachten in ook uw e-commerce winkels.

In het geval van een WooCommerce-aangedreven winkel, moet een gebruiker echter de pagina 'mijn account' bezoeken om een ​​account aan te maken of te controleren of hij is ingelogd of niet.

woocommerce mijn account - uitloglink

In deze tutorial leggen we uit hoe je de Login/Logout-optie toevoegt aan het bovenste menu van je WooCommerce website op te slaan. Dit is een van de meer populaire tips en trucs van CollectiveRay.com - dus blijf op de hoogte als je meer tips en trucs wilt leren!

Maak een hoofdmenu bovenaan

Stap 1: Voordat u verder gaat, moet u ervoor zorgen dat u een menu heeft toegevoegd als primair menu van uw thema. Zorg er ook voor dat je een volledige WordPress back-up voor het geval er iets misgaat

Als je geen menu als primair menu hebt toegevoegd, log dan in op je WordPress-beheerder, ga naar Uiterlijk >> Menu. Maak onder de menu-instellingen een menu en vink het vakje "Top primair menu" aan.

woocommerce-menu

Top Tip: Als u zich niet op uw gemak voelt bij het wijzigen van de code, kunt u overwegen een WordPress-ontwikkelaar in te huren. Klik hier om te leren hoe u de ideale WordPress-ontwikkelaar inhuurt: https://www.collectiveray.com/wordpress-developers-for-hire

Stap 2: Voeg de onderstaande code toe aan het functions.php bestand van je thema.

add_filter( 'wp_nav_menu_items', 'add_loginout_link', 10, 2 );
functie add_loginout_link( $items, $args) {
  if (is_user_logged_in() && $args->theme_location == 'primair') {
    $items .= ' Uitloggen ';
  } elseif (!is_user_logged_in() && $args->theme_location == 'primair') {
    $items .= ' Log in ';
  } retourneer $items;
}

UPDATE: We zijn zojuist geadviseerd door een behulpzame lezer/commentator van de website die zei dat wc_get_page_id nu moet worden gebruikt in plaats van de (nu verouderde) woocommerce_get_page_id

Als je het niet prettig vindt om zelf codewijzigingen uit te voeren, kun je enkele van deze hooggewaardeerde, maar goedkope Fiver-optredens bekijken.

Verifieer de Woocommerce login / logout link

Zodra je de functions.php hebt gewijzigd om de Woocommerce login / logout-links toe te voegen, is het tijd om het resultaat van je wijzigingen te zien. Als je de wijzigingen correct hebt doorgevoerd, zie je het resultaat hieronder.

woocommerce login / uitlog links

U bent klaar! Nu kunt u zien dat de optie Inloggen/Uitloggen wordt weergegeven in het hoofdmenu van uw winkel. Deze truc is vooral handig als je een bedrijf op basis van abonnementen hebt opgezet dat we hebben beschreven CDL Super Session..

Nu we je hebben laten zien hoe je dit voor WooCommerce kunt doen, is het misschien tijd om hetzelfde te doen en een WordPress Logout-link te maken. Dit is vaak het geval als je hebt besloten om de beheerdersbalk uit te schakelen, maar voor de zekerheid toch de optie wilt hebben om uit te loggen.

Als je gewoon op zoek bent naar een manier om je ingelogde sessies te beëindigen, ga dan naar het volgende op je website.

https://<yoursite.com>/wp-login.php?action=logout 

U krijgt een klein bevestigingsscherm met de vraag "Wilt u echt uitloggen?" - zodra u op de link klikt, wordt u uitgelogd.

WordPress uitlogscherm

Zoals altijd zijn er meerdere manieren om dit te doen. 

De WordPress Logout-URL is iets dat u daadwerkelijk in uw menu kunt gebruiken als u een WordPress-uitlogknop wilt maken. Koppel gewoon de bovenstaande URL en natuurlijk kan uw gebruiker hiermee alle huidige sessies beëindigen.

Uitlogmenu

 

Als dit om de een of andere reden niet werkt, moet u mogelijk uw functions.php aanpassen om deze functionaliteit in te schakelen. 

add_filter('wp_nav_menu_items', 'add_login_logout_link', 10, 2); functie add_login_logout_link($items, $args) { ob_start(); wp_loginout('index.php'); $loginoutlink = ob_get_contents(); ob_end_clean(); $items .= ' '. $loginoutlink .' '; retourneer $items; }

 

Opmerking: deze bovenstaande methode werkt en is ingeschakeld als u aangepaste WordPress-menu's gebruikt, dwz de menufunctie die beschikbaar is in het beheerdersgedeelte onder Uiterlijk> Menu's.)

WordPress Afmelden Shortcode

Net als bij de meeste functies, zul je merken dat er ook een inpluggen die kan worden gebruikt om een ​​WordPress Logout Shortcode te genereren. Naast de verschillende configuraties die u kunt uitvoeren, geeft deze plug-in u de mogelijkheid om de volgende shortcodes in uw berichten en pagina's te gebruiken.

[logout] - Een standaard uitloglink, waarbij de gebruiker op het inlogscherm blijft nadat hij is uitgelogd. [logout_to_home] - Een link die de gebruiker uitlogt en doorverwijst naar uw startpagina. [logout_to_current] - Een link die de gebruiker uitlogt en terugleidt naar de huidige pagina/URL.

De plug-in heeft ook verschillende opties om de look en feel en teksten te configureren, of de daadwerkelijke gebruikerservaring.

WooCommerce Inloggen

Sinds de overname van WooCommerce door Automattic, heeft WooCommerce steeds meer functionaliteit van WordPress.com geïntegreerd in WooCommerce. Een van de grote functies was de mogelijkheid om in te loggen op WooCommerce.com via uw WordPress.com-account

Maar dit is misschien niet de ideale situatie voor uw klanten die normaal gesproken nu een WordPress.com-account zouden hebben, dus dergelijke functionaliteit zou worden gebruiktless voor hen.

Dus hoe maak je een account login / logout systeem waarmee ze bekend zijn? Dit is waar de WooCommerce Social Login in het spel komt!

Woocommerce sociale login

De WooCommerce Social Login is een premium WooCommerce-extensie die sociale logins voor Seam mogelijk maaktless account creaties en kassa's. Dit is ENORM. Want wist u dat accountregistraties een zeer belangrijke barrière zijn voor verkoop? 

Volgens Statista kunt u zelfs tot 21% van uw klanten verliezen vanwege dit probleem van het omslachtige proces van het aanmaken van een account voordat u afrekent.

Dus hoe verklein je deze wegversperring? Dit is waar de WooCommerce Social Login-extensie in het spel komt.

Door deze extensie in uw WooCommerce online winkel te installeren, kunt u gebruikers toestaan ​​in te loggen met hun Facebook-, Twitter-, Google-, Amazon-, LinkedIn-, PayPal-, Disqus-, Yahoo- of VK-accounts in plaats van een nieuw gebruikersaccount aan te maken met een nieuwe reeks geloofsbrieven.

woocommerce social login afrekenen

Dus wanneer een klant uw site voor de eerste keer bezoekt, kunnen ze met deze extensie gewoon op de knop van hun favoriete sociale netwerk klikken en in feite met een enkele klik een account op uw site aanmaken.

Dit verkleint de drempel en je hebt ook meer gevalideerde gebruikersaccounts die je uiteindelijk zou kunnen gebruiken voor verschillende soorten berichten (als ze daarvoor kiezen).

 

Waarom WooCommerce Social Login gebruiken?

  • Het geeft je de mogelijkheid om je klantaccounts te synchroniseren met de meest populaire sociale netwerken
  • Maakt het creëren van klanten en het afrekenen naadless wat niet het omslachtige proces van het maken en verifiëren van een account vereist
  • Verminder wrijving, verhoog de verkoop en herhaalaankopen en verminder het verlaten van de winkelwagen
  • Social logins zijn een geaccepteerde en vertrouwde manier om in te loggen op sites van derden

Dit is een premium die zijn prijs van slechts $ 79 zeker waard is. Je krijgt het geld vaak terug.

Bekijk WooCommerce Social Login

 

Nog iets dat je wilt weten over uitloggen

Is er iets dat je graag zou willen weten en ontbreekt in dit artikel? We zouden graag uw opmerkingen ontvangen, zodat we dit bericht kunnen blijven verbeteren!  

Download de lijst met 101 WordPress-trucs die elke blogger zou moeten kennen

101 WordPress-trucs

Klik hier om nu te downloaden
Over de auteur
David Attard
Auteur: David AttardWebsite: https://www.linkedin.com/in/dattard/
David heeft de afgelopen 18 jaar in of rond de online / digitale industrie gewerkt. Hij heeft uitgebreide ervaring in de software- en webdesign-industrie met WordPress, Joomla en niches eromheen. Als digitale consultant richt hij zich op het helpen van bedrijven om een ​​concurrentievoordeel te behalen door een combinatie van hun website en digitale platforms die vandaag beschikbaar zijn.

Nog een ding... Wist je dat mensen die nuttige dingen zoals dit bericht delen er ook GEWELDIG uitzien? ​
Alstublieft laat een nuttig geef commentaar met je mening, deel dit dan op je Facebook-groep (en) die dit nuttig zouden vinden en laten we samen de vruchten plukken. Bedankt voor het delen en aardig zijn!

Disclosure: Deze pagina kan links bevatten naar externe sites voor producten die we geweldig vinden en die we van harte aanbevelen. Als u producten koopt die we aanbevelen, kunnen we een verwijzingsvergoeding verdienen. Dergelijke vergoedingen hebben geen invloed op onze aanbevelingen en we accepteren geen betalingen voor positieve beoordelingen.

Auteur (s) Uitgelicht op:  Inc Magazine-logo   Sitepoint-logo   CSS Tricks-logo    webdesignerdepot-logo   WPMU DEV-logo   en nog veel meer ...