1. Hlavní stránka
  2. Aplikace
  3. Přihlašování přes sociální sítě

Přihlašování přes sociální sítě

Nastavení funkcí z tohoto návodu naleznete ve své administraci pouze při aplikovaných šablonách verze 4.0. Na starších šablonách tato funkce není podporována.

Po aktivaci této funkce se budou moci vaši zákazníci do e-shopu registrovat a posléze přihlašovat pomocí svých uživatelských účtů na různých sociálních sítích. Výrazně tak urychlíte nejen přihlašování, ale na pár vteřin zkrátíte i celý registrační proces zákazníka.

Defaultně je v administraci e-shopu aktivováno přihlášení pomocí služby mojeID viz. obrázek. Aktivovat můžete přihlašování také přes Facebook, Google, Twitter a Instagram. V tomto návodu si ukážeme, jak aktivovat Facebook a Google.  

Přihlášení přes sociální sítě
Po správné aktivaci funkce přihlášení zákazníků pomocí Facebook se vám v červeném poli zobrazí tlačítko Přihlásit přes Facebook. Pokud nemáte aktivovanou žádnou z možností pole je prázdné viz. obrázek.

 

Aktivace a nastavení přihlášení přes Facebook

Běžte do administrace e-shopu sekce Aplikace-Přihlašování přes sociální sítě-záložka Faceboook. Zaškrtněte Aktivovat možnost přihlašování zákazníků pomocí Facebook.

Přihlášení přes sociální sítě

Pro aktivaci funkce Přihlášení přes sociální síť Facebook je nutné získat požadované kódy, které vložíte do pole ID respektive SECRET. Jak a kde kódy získáte?

Pokud již máte běžný Facebook účet, je nutné vytvořit také tzv. developerský účet.

  1. Přihlaste se do svého Facebook účtu
  2. Přejděte na stránku https://developers.facebook.com/  a založte developerský účet kliknutím na Register Now
  3. Vyskočí vám okno, kde propojíte svůj facebookový účet s developerským kliknutím na Next

Pojmenujte si libovolně aplikaci, např. „Facebook login“ a nechte e-mail, který vám formulář předvyplní.

V aplikace Facebook for developers v nabídce My Apps zvolte Create a new App

Přihlášení přes sociální sítě

 

Pojmenujte aplikaci např. Facebook login App.  Email již bude předvyplněn. Dále pokračujte na Create App ID

Přihlášení přes sociální sítě

 

V záložce Add a product vyberte Facebook Login a zvolte Set Up

Přihlášení přes sociální sítě

 

V levé nabídce vyberte Settings. V okně je pole Valid OAuth redirect URIs, do kterého je zapotřebí vložit speciální URL adresu. Tuto adresu naleznete v administraci e-shopu. 

Přihlášení přes sociální síť Google

 

Běžte do administrace e-shopu Aplikace-Přihlašování přes sociální sítě-záložka Faceboook. V poli Valid OAuth redirect URIs vám systém automaticky vygeneruje příslušný kód. Vy vložíte pouze do pole VASEDOMENA název vaší domény ve tvaru např: www.bushcraftshop.cz celá URL pak bude mít tvar: https://www.vasedomena.cz/vasedomena/e-login-social-end?hauth_done=Facebook

Upozornění
Pokud by se váš eshop nacházel např. na URL  https://www.bushcraftshop.cz  pak by speciální URL měla tvar: https://www.bushcraftshop.cz/bushcraftshop/e-login-social-end?hauth_done=Facebook  U novějších e-shopů je rovněž možné, že adresa za lomítkem bude mít číselný tvar např:  https://www.bushcraftshop.cz/751942747/e-login-social-end?hauth_done=Facebook 

Příslušnou adresu pak vložte do pole Valid OAuth redirect URIs a pokračujte uložením změn.

Přihlášení přes sociální sítě

 

V dalším okně se již dostanete k požadovaným kódům App ID a App Secret. App Secret je potřeba odkrýt pomocí hvězdičky (aplikace může požadovat opětovné přihlášení). Nyní si zkopírujte oba kódy a stránku facebook developer ještě neopouštějte!   

Přihlášení přes sociální sítě

 

Běžte zpět do administrace e-shopu a App ID a Secret vložte do příslušných políček viz. obrázek a uložte.

Přihlášení přes sociální sítě

Nyní se znovu vraťte do aplikace Facebook developer do menu App review. Zde přepněte tlačítko viditelnost aplikace na Yes a potvrďte.

Přihlášení přes sociální sítě

Nyní ověřte, že vše proběhlo v pořádku. Otevřete váš e-shop a najeďte myší na horní lištu do sekce Přihlášení. Pokud vše proběhlo správně, zobrazí se tlačítko Přihlásit přes Facebook a vaši zákazníci se tak mohou na snadno a rychle přihlásit.  

 

Aktivace a nastavení přihlášení přes Google

Stejnou funkcionalitu nabízí také Google. I proces implementace této funkce do vašeho e-shopu je podobný, jako při aktivaci Facebooku. K aktivaci je nutné mít účet na Google a ve službě Google Search Console.

Pokud jste dosud nevyužívali služby v Google Search Console je nejprve nutné získat Google kód na ověření vlastnictví domény a vložit jej do příslušného pole v administraci e-shopu viz. obrázek.  

Přihlášení přes sociální síť Google

Návod na verifikaci vaší domény naleznete na:

https://helpdesk.eshop-rychle.cz/docs/nejcastejsi-dotazy/google-po-mne-chce-abych-provedl-overeni-vlastnictvi-domeny-jak-na-to/  

Teprve po úspěšném ověření vaší domény lze pokračovat v samotném nastavení funkce Přihlášení přes sociální síť Google!

Dále se již přihlaste se na https://console.developers.google.com

Pokud máte Google účet (nebo více účtů), vyberte příslušný Google účet, který požadujete spárovat se službou Google Search Concole. Pokud účet Google prozatím nemáte, účet nejprve založte a poté pokračujte na výše jmenovanou adresu služby Google Search Console.

Po propojení účtů se vám zobrazí rozhraní Google APIs Services pro aktivaci a nastavení požadované funkce.

V levém horním menu vyberte Select a project a po otevření pop up okna vyberte NEW PROJECT

Přihlášení přes sociální síť Google

Vyplňte jméno vašeho projektu a zvolte CREATE

Přihlášení přes sociální síť Google

Pokračujte v levém horním menu APIs & Services-Credentials  

Přihlášení přes sociální síť Google

Nyní je nutné nastavení tzv. consent screen

Přihlášení přes sociální síť Google

Vstupte do sekce Credentials a zde vyplňte pole Authorized domains. Do příslušného pole vložte jméno vaší domény ve tvaru vasedomena.cz a uložte. Zvolená doména musí být registrována ve službě Google Search Console viz. úvod tohoto návodu!

Přihlášení přes sociální síť Google  

V dalším okně vyberte Web application a Create

Přihlášení přes sociální síť Google

Vyplňte jméno aplikace a do pole Authorized redirect URIs vložte speciální URL adresu v příslušném tvaru. 

Přihlášení přes sociální síť facebook

Běžte do administrace e-shopu Aplikace-Přihlašování přes sociální sítě-záložka Google. V poli Valid OAuth redirect URIs vám systém automaticky vygeneruje příslušný kód. Vy vložíte pouze do pole VASEDOMENA název vaší domény ve tvaru např: www.bushcraftshop.cz celá URL pak bude mít tvar: https://www.vasedomena.cz/vasedomena/e-login-social-end?hauth_done=Facebook

Pokud by se váš eshop nacházel např. na URL https://www.bushcraftshop.cz  pak finální tvar URL byl:

https://www.bushcraftshop.cz/bushcraftshop/e-login-social-end?hauth_done=Facebook 

U novějších e-shopů je rovněž možné, že adresa za lomítkem bude mít číselný tvar např: https://www.bushcraftshop.cz/751942747/e-login-social-end?hauth_done=Facebook 

Příslušnou adresu pak vložte do pole Valid OAuth redirect URIs a pokračujte uložením změn.

Přihlášení přes sociální síť Google

POZOR
Po vyplnění pole Authorized redirect URIs je nutné změny aplikovat-tlačítko Create. Pokud vložíte příslušnou URL adresu a ihned přejdete na tlačítko Create a kliknete nedojde k vytvoření-uložení změn! Po vložení speciální URL je nutné kliknout do libovolného prázdného místa vedle pole. Poté dojde k zašednutí pole a je možné kliknout na tlačítko Create. Takto dojde k správnému uložení změn. Jedná se o technologickou komplikaci ve vlastní aplikaci Google APIs. 

Poté se již zobrazí pop up okno s požadovanými kódy Client ID a client Secret.

Přihlášení přes sociální síť Google

Kódy zkopírujte do příslušného pole v administraci e-shopu. Běžte do sekce Aplikace-Přihlašování přes sociální sítě-záložka Google. Zaškrtněte Aktivovat možnost přihlašování zákazníků pomocí Google a vložte kódy a uložte.

Přihlášení přes sociální síť Google

Ověřte, zdali implementace proběhla v pořádku a tlačítko Přihlásit přes Google se zobrazuje a správně funguje.

Přihlášení přes sociální síť Google

 

Návody na implementaci funkce Přihlášení přes sociální sítě Instagram a Twitter budou doplněny v nejbližším možném termínu. 

Pomohl Vám tento návod? Ano Ne