Kommer du ihåg när e-post och lösenord var det enda sättet att logga in på webbplatser? Tiderna har förändrats, och nu förväntar sig många användare bekvämligheten med att logga in med sina telefonnummer.
Efter att ha hjälpt olika personer att sätta upp telefonbaserade inloggningssystem på sina WordPress-sajter har jag lärt mig vilka metoder som fungerar bäst – och vilka man ska undvika. Jag har testat allt från premium-plugins till anpassade lösningar för att hitta de mest pålitliga alternativen.
I den här guiden kommer jag att dela med mig av hur du lägger till telefonnummerinloggning med OTP-verifiering på din WordPress-webbplats. Oavsett om du driver en liten företagswebbplats eller en stor medlemsplattform, hittar du en lösning som passar dina behov.
Varför låta WordPress-användare logga in med sina telefonnummer?
Att låta användare logga in med en engångskod (OTP) via telefonnummer är en vanlig praxis. Det eliminerar behovet av att komma ihåg komplexa lösenord samtidigt som deras konton hålls säkra.
Här är varför du bör överväga att lägga till telefoninloggning på din WordPress-webbplats:
- Bättre säkerhet: Till skillnad från statiska lösenord går OTP:er ut efter en enda användning, vilket gör inloggningar betydligt säkrare.
- Snabbare inloggningar: Inget behov av att skriva in långa lösenord. En snabb kod som skickas till en telefon låter användare logga in omedelbart.
- Färre lösenordsåterställningar: Om du driver en community-webbplats behöver dina användare inte längre återställa glömda lösenord, vilket sparar dig tid och supportärenden.
- Förbättrad användarupplevelse: En smidig inloggning gör användarna nöjda och mer benägna att återvända till din webbplats.
- Perfekt för mobilanvändare: Fler personer surfar på sina telefoner. Att låta dem logga in med en kod gör processen sömlös.
Nu ska vi titta på hur du enkelt kan tillåta inloggning med telefonnummer via OTP i WordPress.
Hur man lägger till inloggning med telefonnummer via OTP i WordPress
Du kan enkelt lägga till telefonnummerinloggning i WordPress med hjälp av det kostnadsfria pluginet Login with Phone Number.
Eftersom WordPress inte skickar SMS som standard behöver du dessutom en tredjepartstjänst som Firebase eller Twilio för att hantera leveransen av OTP.
Först måste du installera och aktivera det kostnadsfria pluginet Login With Phone Number. För detaljer, se denna handledning om hur man installerar ett WordPress-plugin.
Vid aktivering av plugin, besök sidan Inloggningsinställningar » Allmänt från WordPress-instrumentpanelen och markera alternativet ‘Aktivera inloggning med telefonnummer’.
Därefter kan du lägga till landskoder för alla regioner där dina användare loggar in. Som standard inkluderar pluginet telefonnummerlandskoder för alla länder.
Jag rekommenderar att du lämnar den här inställningen som den är. Det säkerställer att din webbplats förblir tillgänglig för en global publik.
Därefter behöver du markera alternativet ‘Aktivera e-postinloggning’ om du vill tillåta e-postinloggning för dina användare.
Jag rekommenderar denna inställning om du har befintliga användare som är vana vid att logga in med sin e-post. Genom att göra det säkerställer du att de inte blir frustrerade när inloggning via telefonnummer aktiveras, eftersom de fortfarande kommer att kunna logga in med sin e-post.
Du kan sedan markera alternativet ‘Tvinga fram e-post efter telefonnummer’. Denna inställning säkerställer att nya användare måste ange sin e-postadress innan de kan slutföra registreringen. Det är särskilt användbart om du redan har en e-postlista och vill samla in e-postadresser från nya användare.
Du kan också aktivera användarregistrering med ett telefonnummer. När det är gjort, ange längden på aktiveringskoden som kommer att ges till användarna.
Därefter måste du skrolla ner och hitta alternativet ‘Aktivera timer’. Klicka för att aktivera det och ställ sedan in tidsgränsen för användare att ange OTP.
Om du till exempel ställer in den på 60 sekunder har användarna en minut på sig att ange sin kod innan den går ut. Klicka sedan på knappen 'Spara ändringar' för att lagra dina inställningar.
Gå vidare och byt till fliken 'Gateway' högst upp. Här måste du välja en SMS-tjänsteleverantör för din telefonnummer OTP-inloggning.
Jag kommer att välja Firebase för den här handledningen. Det är en Google-tjänst som låter dig skicka engångskoder till användarnas telefoner för säker inloggning.
Det är en bra idé att kontrollera deras prissida för de senaste detaljerna. Du kan dock också välja alternativ som Twilio, WhatsApp, Alibaba SMS och mer.
Tänk på att vissa av alternativen endast kommer att finnas tillgängliga i Pro-planen.
När du har valt Firebase måste du lägga till dess API-nyckel och konfiguration.
För detta behöver du besöka Firebase Console och välja alternativet ‘Skapa ett Firebase-projekt’.
Detta tar dig till en ny skärm där du måste ange ett projektnamn. Du kan kalla det vad som helst som hjälper dig att komma ihåg vad du använder det till.
Klicka sedan på knappen ‘Continue’.
Firebase kommer nu att be om tillstånd att aktivera Google Analytics för projektet.
När du har tillåtit det måste du välja 'Standardkonto för Firebase' från rullgardinsmenyn och klicka på knappen 'Skapa projekt'.
Du kommer nu att dirigeras till sidan Projektöversikt. Navigera här till fliken Skapa » Autentisering från den vänstra kolumnen.
Klicka på knappen 'Kom igång'.
När du har gjort det blir vissa nya inställningar synliga på skärmen. Här hittar du 'Telefon' i listan över inloggningsleverantörer, klickar på den och växlar sedan 'Aktivera'-reglaget.
Detta gör att användare kan logga in med ett mobiltelefonnummer med hjälp av Firebase SDK:s telefonverifiering. Klicka sedan på knappen 'Spara'.
Byt nu till fliken 'Inställningar' och välj alternativet 'Auktoriserade domäner' från vänster kolumn. Här måste du klicka på knappen 'Lägg till domän'.
Detta öppnar en dialogruta där du måste lägga till din webbplats domännamn.
Detta är en viktig säkerhetsåtgärd som säkerställer att endast din webbplats tillåts ansluta till detta Firebase-projekt, vilket förhindrar obehörig användning av andra.
Därefter klickar du bara på inställningsikonen bredvid Projektöversikt högst upp och väljer fliken ‘Projektinställningar’.
Rulla sedan ner till avsnittet 'Dina appar' och välj webbikonen.
Du måste nu lägga till ett namn för din app och klicka på knappen 'Registrera app'. När du gör det kommer Firebase att generera en speciell konfigurationskod för dess SDK.
'SDK' står för Software Development Kit, och denna kod innehåller alla nödvändiga inställningar för att ansluta din WordPress-webbplats till ditt Firebase-projekt.
Härifrån klickar du helt enkelt på knappen ‘Continue to Console’.
När du är tillbaka på sidan Projektöversikt, kopiera helt enkelt ‘Web API Key’ och spara den någonstans säkert.
Skrolla nu ner till avsnittet ‘Your Apps’ där detaljer för din nyaste app kommer att visas på skärmen.
Välj här radio-knappen ‘Config’ för att visa din Firebase SDK som konfiguration. Kopiera den helt enkelt och spara den någonstans säkert.
Därefter måste du gå tillbaka till din WordPress-instrumentpanel och lägga till Firebase API-nyckeln och konfigurationen i deras respektive fält i inställningarna för pluginet Login with Phone Number.
Klicka sedan på knappen ‘Spara ändringar’ för att lagra dina inställningar.
När det är gjort, öppna WordPress-sidan där du vill lägga till inloggningsformuläret och klicka på knappen ‘Lägg till block’.
Från blockmenyn måste du välja blocket ‘Kortkod’ och lägga till följande kortkod i det:
[idehweb_lwp]
Klicka slutligen på knappen ‘Uppdatera’ eller ‘Publicera’ för att spara dina inställningar.
Nu, när nya användare besöker din webbplats, kommer de att kunna registrera sig och logga in med sitt telefonnummer, medan befintliga användare fortfarande kan logga in med sin e-post.
När du har ställt in detta rekommenderar jag att skicka ett e-postmeddelande till dina befintliga användare och uppmana dem att lägga till sina telefonnummer så snart som möjligt.
De kan göra detta genom att besöka sin profilsida i WordPress-instrumentpanelen, skrolla ner till avsnittet 'Personlig information', lägga till sitt telefonnummer och klicka på Uppdatera användare.
Detta säkerställer att även befintliga användare som redan har registrerat sig kan logga in med sina telefonnummer senare.
Bonus: Lägg till inloggning med ett klick med Google i WordPress
Även om inloggning med telefonnummer och OTP är ett säkert alternativ, föredrar vissa användare ett ännu snabbare sätt att komma åt sina konton.
Att lägga till Googles inloggning med ett klick gör att användare kan logga in direkt, vilket kan förbättra användarupplevelsen, minska inloggningsfriktion och öka registreringar.
Det är särskilt användbart för webbplatser med frekventa besökare, som medlemskapsplattformar, onlinebutiker eller communities.
Du kan enkelt lägga till den här funktionen med hjälp av pluginet Nextend Social Login. Det är ett populärt verktyg som gör det möjligt för användare att registrera sig och logga in på din webbplats med sina befintliga sociala mediekonton som Google, Facebook och Twitter.
Det gör det också möjligt att länka sociala profiler till befintliga konton, så att återkommande användare inte skapar dubbletter.
För att komma igång, se bara vår handledning om hur du lägger till inloggning med ett klick med Google i WordPress.
Vanliga frågor om att lägga till inloggning med telefonnummer via OTP i WordPress
Att konfigurera ett nytt inloggningssystem kan väcka några frågor. Här är svaren på några av de vanligaste jag får om att lägga till telefonnummerinloggning i WordPress.
Vad händer om min webbplats överskrider gratisgränserna för Firebase?
Om din webbplatstrafik växer och du överskrider gratisnivån för en tjänst som Firebase, skulle du sedan gå över till deras betalda plan.
Det är en bra idé att övervaka din användning i din Firebase-kontopanel.
Kan mina befintliga användare fortfarande logga in med sin gamla e-postadress och sitt lösenord?
Ja. Som visas i handledningen tillåter pluginet "Logga in med telefonnummer" dig att behålla e-postinloggning aktiverad. Detta rekommenderas starkt för att undvika att förvirra dina befintliga användare.
De kan fortsätta att logga in med sina gamla uppgifter och kan välja att lägga till sitt telefonnummer i sin profil när som helst.
Är det möjligt att anpassa designen på inloggningsformuläret för telefonnummer?
Gratisversionen av pluginet erbjuder grundläggande styling som är utformad för att smälta in med de flesta WordPress-teman.
Proffsversionen av pluginet inkluderar också fler inbyggda stylingalternativ.
Kommer denna metod för inloggning med telefonnummer att fungera med WooCommerce eller mitt medlemskapsplugin?
Ja, pluginet "Logga in med telefonnummer" är utformat för att integreras med standardinloggnings- och registreringskrokarna i WordPress.
Detta innebär att det automatiskt bör fungera med populära plugins som WooCommerce, MemberPress och andra som använder standardanvändarsystemet i WordPress för sina inloggnings- och registreringssidor.
Jag hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till inloggning med telefonnummer via OTP i WordPress. Du kanske också vill se vår nybörjarguide om hur du tar bort alternativet för lösenordsåterställning/ändring från WordPress och vår handledning om att skapa en popup-modul för WordPress-inloggning.
Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Har du en fråga eller ett förslag? Lämna gärna en kommentar för att starta diskussionen.