Rekisteröityminen verkkosivustolla on hetki, jolloin menetät puolet kävijöistäsi. Kukaan ei halua keksiä salasanaa, tarkistaa sähköpostiaan ja muistaa taas yhtä uutta käyttäjätunnus-salasana-paria.

Somekirjautumisella käyttäjät kirjautuvat yhdellä klikkauksella: Facebook tai Google on jo vahvistanut heidän henkilöllisyytensä. LoginRadiusin vuoden 2024 tietojen mukaan 53,1% käyttäjistä valitsee Facebookin ja 44,8% Googlen. Muut verkostot yltävät hädin tuskin 2 prosenttiin.

Alla on vaiheittainen opas Facebook- ja Google-kirjautumisen käyttöönottoon Nextend Social Login -lisäosalla. Pääset lisäosan asennuksesta toimiviin painikkeisiin kirjautumissivullasi puolessa tunnissa.

💡 Pikaopas:

• Asenna Nextend Social Login WordPress.orgin hakemistosta
• Luo Facebook-sovellus Meta for Developersissa ja hanki App ID + App Secret
• Luo Google-sovellus Google Cloud Consolessa ja hanki Client ID + Client Secret
• Syötä avaimet lisäosan asetuksiin sivustollasi ja testaa kirjautuminen
• Ota tarjoajat käyttöön, niin "Jatka Facebook-tunnuksella" ja "Kirjaudu Google-tunnuksella" -painikkeet ilmestyvät automaattisesti

Nextend Social Login -lisäosa: mitä se tekee ja miksi juuri tämä

Nextend Social Login WordPress.orgissa on ilmainen lisäosa, jolla on yli 200 000 aktiivista asennusta ja 4,5 tähden arvosana. Viimeisin päivitys julkaistiin vuonna 2026, ja lisäosaa ylläpidetään aktiivisesti.

Mitä ilmaisversio tarjoaa:

• Yhden klikkauksen kirjautuminen ja rekisteröityminen Facebookin, Googlen ja X:n (entinen Twitter) kautta
• Sosiaalisten tilien linkittäminen olemassa olevaan WordPress-tiliin käyttäjäprofiilissa
• Avatar sosiaalisesta profiilista Gravatarin sijaan
• Widget ja shortcodet painikkeiden sijoittamiseen minne tahansa sivustolla
• Painikkeiden ulkoasun ja tekstin mukauttaminen

Pro-versio lisää yhteensopivuuden WooCommercen, BuddyPressin, Ultimate Memberin ja yli kahdenkymmenen muun tarjoajan kanssa: Apple, Microsoft, LinkedIn, GitHub, Discord, TikTok ja muut.

Lisäosa toimii suoraan laatikosta: tarjoajan määrittämisen jälkeen painikkeet ilmestyvät automaattisesti /wp-login.php-sivulle, wp_login_form()-lomakkeeseen ja käyttäjäprofiiliin.

Facebook-kirjautumisen käyttöönotto

Siirry kohtaan Asetukset → Nextend Social Login ja klikkaa Aloitus Facebook-osiossa:

Lisäosa opastaa sinut vaiheiden läpi. Järjestys on kuitenkin tämä: luo ensin sovellus Facebookin puolella ja syötä sitten avaimet takaisin WordPressiin.

Vaihe 1: Luo Facebook-sovellus

Avaa Meta for Developers ja napsauta Create App:

Syötä ponnahdusikkunaan display name (näyttönimi, jonka käyttäjät näkevät kirjautuessaan; sivustosi nimi toimii hyvin) ja contact email (yhteyssähköposti):

Napsauta Create App ID.

Olet nyt sovelluksen asetuksissa. Etsi Facebook Login ja napsauta Set Up:

Valitse seuraavalla näytöllä Web:

Syötä sivustosi URL-osoite ja napsauta Save ja sitten Continue:

Facebook näyttää tämän jälkeen useita lisävalintoja; lisäosa hoitaa ne puolestasi, selaa vain eteenpäin.

Kaksi tärkeää toimenpidettä on vielä jäljellä.

Ensimmäinen: siirry kohtaan Facebook Login → Settings ja lisää OAuth-uudelleenohjaus-URL Valid OAuth Redirect URIs -kenttään. URL-muoto on: https://yoursite.com/wp-login.php?loginSocial=facebook:

Toinen: siirry kohtaan Settings → Basic ja lisää sivustosi verkkotunnus App Domains -kohtaan. Kun olet tallentanut, napsauta Show-painiketta App Secret -kentän vieressä. Tarvitset App ID:n ja App Secret:in seuraavaa vaihetta varten:

Facebookin puolen asetukset ovat nyt valmiit.

Vaihe 2: Syötä avaimet lisäosaan

Palaa WordPressiin. Napsauta I am done setting up my Facebook App:

Liitä App ID ja App Secret kehittäjäkonsolista ja napsauta Save Changes:

Lisäosa pyytää sinua vahvistamaan yhteyden. Napsauta Verify Settings:

Jos kaikki on oikein, Facebookin kirjautumisponnahdusikkuna avautuu. Kirjaudu sisään vahvistaaksesi:

Onnistuneen vahvistuksen jälkeen ota tarjoaja käyttöön klikkaamalla Enable:

Valmista. Continue with Facebook -painike näkyy nyt /wp-login.php-sivulla:

Liitännäisen asetuksissa voit muuttaa painikkeen tekstiä, ulkoasua ja kirjautumisen jälkeistä toimintaa (esimerkiksi asettaa mukautetun uudelleenohjaus-URL:n rekisteröitymisen jälkeen).

Miten Google-kirjautuminen otetaan käyttöön

Kohdassa Settings → Nextend Social Login klikkaa Getting Started Google-osiossa:

Vaihe 1: Luo Google-sovellus

Avaa Google Cloud Console ja luo uusi projekti tai valitse olemassa oleva:

Valitse sivupalkista OAuth consent screen. Lisää sivustosi verkkotunnus kohtaan Authorized domains ja täytä yhteystiedot:

Tallennuksen jälkeen siirry kohtaan Credentials. Klikkaa Create Credentials ja valitse OAuth client ID:

Täytä lomake:

• Application type: Web application
• Name: mikä tahansa kuvaava nimi
• Authorized redirect URIs: https://yoursite.com/wp-login.php?loginSocial=google

Klikkaa Luo (Create). Google näyttää Client ID:n ja Client Secretin ponnahdusikkunassa. Älä sulje sitä:

Vaihe 2: Syötä avaimet lisäosaan

Palaa WordPressiin ja klikkaa Olen määrittänyt Google-sovellukseni valmiiksi (I am done setting up my Google App):

Liitä Client ID ja Client Secret Google-konsolista ja tallenna:

Lisäosa kehottaa sinua vahvistamaan yhteyden. Klikkaa Vahvista asetukset (Verify Settings):

Tavallinen Googlen valtuutusikkuna avautuu. Kirjaudu sisään vahvistaaksesi:

Ota palveluntarjoaja käyttöön:

Nyt WordPressin kirjautumissivulla näkyy Google-painike:

⁉️🤔 Usein kysytyt kysymykset

Toimiiko somekirjautuminen mukautetun kirjautumissivun kanssa?

Kyllä. Jos teemasi tai lisäosasi käyttää wp_login_form()-funktiota lomakkeen näyttämiseen, Nextend-painikkeet ilmestyvät automaattisesti. Epästandardeille ratkaisuille on tarjolla vimpain ja [nextend_social_login]-lyhytkoodi.

Vaaditaanko Facebook-kirjautumiseen HTTPS?

Kyllä. Facebook on vaatinut HTTPS:ää OAuth-uudelleenohjauksiin vuodesta 2018 lähtien. Ilman SSL-varmennetta Facebook-painike ei yksinkertaisesti toimi. Saat virheilmoituksen asetusten vahvistusvaiheessa.

Voinko yhdistää Twitterin (X) ilmaisversiossa?

Kyllä. Nextend Social Login tukee X:ää (entinen Twitter) ilmaisversiossa Facebookin ja Googlen rinnalla. Asennus on samankaltainen: luo sovellus Twitter Developer Portalissa ja syötä avaimet.

Mitä teen, jos lisäosa luo satunnaisia käyttäjänimiä?

WordPress kieltää erikoismerkit käyttäjänimissä. Kun somepalvelu palauttaa nimen, jossa on välilyöntejä, kyrillisiä merkkejä tai emojeita, lisäosa ei voi luoda kelvollista käyttäjänimeä ja luo satunnaisen nimen. Pro-versiossa voit pyytää käyttäjää antamaan nimen rekisteröinnin yhteydessä.

Tallennetaanko käyttäjien salasanat sivustolle?

Ei. Nextend ei tallenna somepalveluiden salasanoja. Lisäosa vastaanottaa ainoastaan henkilöllisyyden vahvistuksen palveluntarjoajalta (Facebook/Google) ja linkittää someprofiilin WordPress-tiliin. Käyttäjät voivat katkaista linkityksen profiilissaan milloin tahansa.

Täytyykö Facebook- ja Google-sovellukset luoda uudelleen lisäosapäivitysten jälkeen?

Ei. App ID ja Secret eivät riipu lisäosan versiosta. Luot sovelluksen kerran, elleivät Facebook tai Google muuta vaatimuksiaan (tyypillisesti muutaman vuoden välein). Jos vaihdat sivustosi verkkotunnuksen, sinun on päivitettävä OAuth URI -osoite sovelluksen asetuksiin.

Katkeaako kirjautuminen, jos poistan lisäosan?

Somepalveluiden kautta rekisteröityneet käyttäjät säilyvät tavallisina WordPress-tileinä. He voivat kuitenkin kirjautua sisään vain salasanan palautuksen kautta; somepainikkeet katoavat. Ennen lisäosan poistamista varmista, että ylläpitäjillä on pääsy tavallisen kirjautumisen kautta.

Kirjautuminen on nyt käytössä, mitä seuraavaksi?

Facebook ja Google kattavat 98% somekirjautumisen tarpeista tyypillisellä verkkosivustolla. Käytännössä Nextendin ilmaisversio riittää blogiin, WooCommerce-verkkokauppaan tai jäsensivustolle.

Jos tarvitset kirjautumisen Applen, Microsoftin tai GitHubin kautta, harkitse Pro-versiota. Se ratkaisee myös ongelman, jossa sähköpostia pyydetään palveluntarjoajilta, jotka eivät jaa sitä automaattisesti.

Koko käyttöönotto tiivistyy kolmeen toimenpiteeseen: luo sovellus palveluntarjoajan hallinnassa → kopioi avaimet lisäosaan → varmista ja ota käyttöön. Jokaisen palveluntarjoajan kohdalla menee 10-15 minuuttia ensimmäisellä kerralla ja 3-5 minuuttia, kun olet tehnyt sen aiemmin.

Tarkista, että painikkeet näkyvät sekä työpöytä- että mobiiliversiossa sivustostasi. Joskus teemat, joissa on epästandardit kirjautumislomakkeet, ohittavat wp_login_form()-funktion. Käytä sellaisissa tapauksissa lisäosan shortcodea.