[Sådan gøres] Tilføj login / logout-links til en forbedret WooCommerce-brugeroplevelse

WooCommerce er mest populære e-handelsplugin i WordPress-økosystemet. Det har dog et lidt irriterende brugervenlighedsproblem. Som standard viser WooCommerce ikke, om en bruger er logget ind eller ej på dit e-handelswebsted.

Til tider kan dette være forvirrende for dine kunder. Da de fleste populære e-handelsbutikker (f.eks. eBay eller Amazon) viser en Login-knap i deres menu, kan kunderne forvente det samme i dine e-handelsbutikker også.

I tilfælde af en WooCommerce-drevet butik skal en bruger dog besøge siden 'min konto' for at oprette en konto eller kontrollere, om vedkommende er logget ind eller ej.

I denne vejledning forklarer vi, hvordan du tilføjer Login/Logout-funktionen til topmenuen i din WooCommerce. hjemmeside butik. Dette er et af de mere populære tips og tricks fra CollectiveRay.com - så følg med, hvis du vil lære flere tips og tricks!

Opret en primær topmenu

Trin 1: Før du fortsætter, skal du sørge for at have tilføjet en menu som primær menu i dit tema. Sørg også for at have lavet en fuld WordPress-backup, hvis noget går galt.

Hvis du ikke har tilføjet en menu som primær menu, skal du logge ind på din WordPress-administrator, gå til Udseende >> Menu. Under Menuindstillinger opretter du en menu og markerer feltet "Øverste primærmenu".

Top tipHvis du ikke er tryg ved at lave kodeændringer, kan du overveje at hyre en WordPress-udvikler. Klik her for at lære, hvordan du hyrer den ideelle WordPress-udvikler: https://www.collectiveray.com/wordpress-developers-for-hire

Skift functions.php for at oprette et Woocommerce logout-link og login-link

Trin 2: Tilføj nedenstående kode til functions.php-filen i dit tema.

add_filter( 'wp_nav_menu_items', 'add_loginout_link', 10, 2 );
funktion add_loginout_link( $elementer, $argumenter ) {
  hvis (is_user_logged_in() && $args->theme_location == 'primær') {
    $elementer .= ' Log ud ';
  } elseif (!is_user_logged_in() && $args->theme_location == 'primær') {
    $elementer .= ' Log ind ';
  } returner $elementer;
}

OPDATERVi er netop blevet informeret af en hjælpsom læser/kommentator på hjemmesiden, som sagde, at wc_get_page_id nu bør bruges i stedet for den (nu udfasede) woocommerce_get_page_id.

Hvis du ikke er tryg ved at lave kodeændringer selv, kan du tjekke nogle af disse højt vurderede, men billige Fiver-jobs ud.

Klik her for at finde billige Fiverr-jobs, der kan hjælpe dig med at løse dette

Bekræft Woocommerce login/logout-linket

Når du har ændret functions.php for at tilføje Woocommerce login/logout-links, er det tid til at se resultatet af dine ændringer. Hvis du har udført ændringerne korrekt, vil du se resultatet nedenfor.

Du er færdig! Nu kan du se, at Log ind/Log ud-funktionen vises i topmenuen i din butik. Dette trick er især nyttigt, hvis du har oprettet en abonnementsbaseret virksomhed, som vi har beskrevet i detaljer. link..

WordPress-logoutlink/URL

Nu hvor vi har vist dig, hvordan du gør dette for WooCommerce, er det måske tid til at gøre det samme og oprette et WordPress Logout-link. Dette er ofte tilfældet, hvis du har besluttet at deaktivere administrationslinjen, men stadig gerne vil have muligheden for at logge ud, bare for at være på den sikre side.

Hvis du bare leder efter en måde at afslutte dine indloggede sessioner, skal du blot besøge følgende på din hjemmeside.

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

Du får en lille bekræftelsesskærm, der spørger "Vil du virkelig logge ud?" - når du klikker på linket, bliver du logget ud.

Som altid er der flere måder at gøre dette på. 

WordPress-logout-URL'en er noget, du rent faktisk kan bruge i din menu, hvis du vil oprette en WordPress-logout-knap. Du skal blot linke URL'en ovenfor, og dette vil selvfølgelig give din bruger mulighed for at afslutte alle aktuelle sessioner.

Hvis dette ikke virker af en eller anden grund, skal du muligvis justere din functions.php for at aktivere denne funktionalitet. 

add_filter('wp_nav_menu_items', 'add_login_logout_link', 10, 2); function add_login_logout_link($items, $args) { ob_start(); wp_loginout('index.php'); $loginoutlink = ob_get_contents(); ob_end_clean(); $items .= '   Bemærk: Funktionen "Wp_login_out" er "Wp_login_out_link" og "$args" er "Log in to be git. Det er ikke en god idé at oversætte "Wp_login_out_link" til "$login_outlink" og "$args" til "$login_outlink" som er "Wp_login_out_link". Funktionen "Wp_login_out_link" er "$login_outlink" og "$args" som er "$login_outlink". '. $loginoutlink.' '; returner $elementer; }

Bemærk: Ovenstående metode fungerer og er aktiveret, hvis du bruger WordPress brugerdefinerede menuer, dvs. menufunktionen, der er tilgængelig i administratorsektionen under Udseende> Menuer.)

WordPress Logout-shortcode

Ligesom med de fleste funktioner, vil du opdage, at der også er en plugin der kan bruges til at generere en WordPress Logout Shortcode. Udover de forskellige konfigurationer, du kan udføre, giver dette plugin dig muligheden for at bruge følgende shortcodes i dine indlæg og sider.

[logout] - Et standard Log ud-link, hvor brugeren forbliver på loginskærmen efter at være logget ud. [logout_to_home] - Et link, der logger brugeren ud og omdirigerer dem til din startside. [logout_to_current] - Et link, der logger brugeren ud og omdirigerer dem tilbage til den aktuelle side/URL.

Plugin'et har også forskellige muligheder for at konfigurere udseende og tekster eller den faktiske brugeroplevelse.

WooCommerce Login

Siden Automattic overtog WooCommerce, har WooCommerce integreret mere og mere funktionalitet fra WordPress.com i WooCommerce. En af de store funktioner har været muligheden for at logge ind på WooCommerce.com via din WordPress.com-konto.

Men dette er måske ikke en ideel situation for dine kunder, der typisk nu ville have en WordPress.com-konto, så en sådan funktionalitet ville være ubrugelig for dem.

Så hvordan kan du oprette et system til kontologin/logout, som de er fortrolige med? Det er her, WooCommerce Social Login kommer i spil!

Woocommerce Social Login

WooCommerce Social Login er en premium WooCommerce-udvidelse, der muliggør sociale logins til problemfri oprettelse af konti og betalinger. Dette er ENORMT. For vidste du, at kontoregistreringer er en meget betydelig barriere for salg? 

Faktisk kan du ifølge Statista miste op til 21% af dine kunder på grund af problemet med den langvarige proces med at oprette en konto før betaling.

Så hvordan afhjælper du denne hindring? Det er her, WooCommerce Social Login-udvidelsen kommer i spil.

Ved at installere denne udvidelse til din WooCommerce onlinebutik kan du give brugerne mulighed for at logge ind med deres Facebook-, Twitter-, Google-, Amazon-, LinkedIn-, PayPal-, Disqus-, Yahoo- eller VK-konti i stedet for at skulle oprette en ny brugerkonto med et nyt sæt loginoplysninger. Brugeren kan derefter blot klikke på sit foretrukne netværkslogo og logge ind på dit websted med det. Hvis du i øvrigt er interesseret i... Lav dit eget brugerdefinerede logo med en gratis app, tjek vores artikel.

Så når en kunde besøger dit websted for første gang, kan de med denne udvidelse blot klikke på knappen på deres foretrukne sociale netværk og i bund og grund oprette en konto på dit websted med et enkelt klik.

Dette reducerer barrieren, og du har også flere validerede brugerkonti, som du i sidste ende kan bruge til forskellige typer beskeder (hvis de tilmelder sig).

Hvorfor bruge WooCommerce Social Login?

• Det giver dig mulighed for at synkronisere dine kundekonti med de mest populære sociale netværk
• Gør oprettelse og betaling af kunder problemfri, hvilket ikke kræver den langvarige proces med kontooprettelse og -verifikation
• Reducer friktion, øg salg og gentagne køb og reducer antallet af forladte indkøbskurve.
• Sociale logins er en accepteret og pålidelig måde at logge ind på tredjepartswebsteder

Dette er en premium-model, der er prisen på kun $79 værd. Du får pengene tilbage mange gange.

Tjek WooCommerce Social Login

Andet du gerne vil vide om at logge ud

Er der noget, du gerne vil vide, men som mangler i denne artikel? Vi vil meget gerne have dine kommentarer, så vi kan blive ved med at gøre dette indlæg bedre!