# Paramétrage de la page de login

**URL:** <https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881>\
**Category:** Support\
**Tags:** v5\
**Created:** [January 20, 2021, 10:58am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881 "2021-01-20T10:58:23Z")\
**Posts on this page:** 18\
**Page:** 1

<div class="post-metadata">

**Author:** ![rosanneQuily](https://community.simplicite.io/user_avatar/community.simplicite.io/rosannequily/32/1921_2.png) [@rosanneQuily](https://community.simplicite.io/u/rosanneQuily)\
**Post date:** [January 20, 2021, 10:58am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/1 "2021-01-20T10:58:23Z")

</div>

Bonjour,

en V4, le paramétrage de la page de login se faisait via les zones Web (Menu Web\>Zone)  
En V5, quels sont les paramètres disponibles pour customiser la page de login ?

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 11:02am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/2 "2021-01-20T11:02:34Z")

</div>

En V5 les “web zones” legacy ont été supprimées au profit de l’utilisation plus souple des ressources.

Pour les pages de “logon” il y en a 4:

- `LOGON_TITLE` et `LOGON_ADDON` pour la page de login/password du provider interne
- `LOGON_PROVIDERS_TITLE` et `LOGON_PROVIDERS_ADDON` pour la page de sélection du provider

Attention à bien associer ces ressources à la disposition `default`

---

<div class="post-metadata">

**Author:** ![rosanneQuily](https://community.simplicite.io/user_avatar/community.simplicite.io/rosannequily/32/1921_2.png) [@rosanneQuily](https://community.simplicite.io/u/rosanneQuily)\
**Post date:** [January 20, 2021, 11:22am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/3 "2021-01-20T11:22:25Z")

</div>

en 5.0.4, seule la LOGON\_ADDON existe.

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 11:42am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/4 "2021-01-20T11:42:50Z")

</div>

Oui les autres peuvent être créés (type HTML)  
Je ne sais pas trop pourquoi `LOGON_ADDON` existe par défaut…

Attention à bien tous les associer à la **disposition** `default`

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 11:47am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/5 "2021-01-20T11:47:45Z")

</div>

Pour customiser le logo et les styles il faut ajouter les resources: `OAUTH2_LOGO` (type image) et `OAUTH2_STYLES` (type CSS) (les nomages en `OAUTH2_*` sont “historiques”)

Ex de styles custom:

```plaintext
.auth-signin { background-color: #152935; }
.auth-signin-with img, .auth-signin button { border: none 0; box-shadow: 5px 5px 10px #3A3A3A; }
.auth-signin-logo { border-radius: 10px; }
.auth-signin-form { border-radius: 20px; max-width: 600px; background-color: #394b54; box-shadow: 5px 5px 10px #131b21; border: solid 1px #152935; }
.auth-signin-version { color: #C0C0C0; }
.auth-signin-fp a, .auth-signin-fp p, .auth-signin-reg a, .auth-signin-reg p { color: #D0D0D0; }
.auth-signin-fpz p { color: #404040; }
.auth-signin-title { color: #FFFFFF; background: transparent; text-align: center; }
.auth-signin-addon { border-radius: 5px; background: #F0F0F0; color: #202020; }

```

Ce qui donne ça:

 ![image](https://community.simplicite.io/uploads/default/original/2X/b/bc60d8c8e0e70c92d10806d5fe82765a82ab87fc.png)

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 11:54am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/6 "2021-01-20T11:54:02Z")

</div>

Enfin, pour customiser l’image “bouton” du provider il faut aussi ajouter une ressource (idéalement un SVG ou un PNG de 400x100px) `OAUTH2_SIGNIN_<nom du provider en majuscules>`

L’idéal c’est de mettre toutes ces ressources dans un module ad hoc (qui contient aussi, par exemple, vos thèmes)

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 12:57pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/7 "2021-01-20T12:57:56Z")

</div>

PS: il y avait un pb avec l’addon de la page de choix du provider ce sera corrigé dans le build de ce soir (5.0.5)

---

<div class="post-metadata">

**Author:** ![Francois](https://community.simplicite.io/user_avatar/community.simplicite.io/francois/32/6448_2.png) [@Francois](https://community.simplicite.io/u/Francois)\
**Post date:** [January 20, 2021, 2:24pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/8 "2021-01-20T14:24:08Z")

</div>

Ok,

Cela étant il faudrait revoir le templating de la page des providers pour ne pas a avoir à gérer des images qui mélange le logo, la font, le texte au sein d’un SVG. et permettre plus de souplesse sur l’affichage (ex mapping de champ des providers avec mustache + css via une ressource de la disposition responsive5).

Le cas d’usage qu’on me remonte souvent :

- de mettre un des providers en avant et d’autres en complément pas forcement sous forme de gros boutons
- voire de mettre le login/pwd local et les autres providers au sein d’une même page. Avoir 1 clique sur “Simplicité” pou accéder au login/pwd local (2 écrans) n’apporte rien terme d’UX

---

<div class="post-metadata">

**Author:** ![Francois](https://community.simplicite.io/user_avatar/community.simplicite.io/francois/32/6448_2.png) [@Francois](https://community.simplicite.io/u/Francois)\
**Post date:** [January 20, 2021, 2:29pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/9 "2021-01-20T14:29:33Z")

</div>

(ps : je veux bien le SVG pour KeyCloak)

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 2:34pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/10 "2021-01-20T14:34:48Z")

</div>

Oui on va faire évoluer tout cas en 5.2+ mais en l’état dans le cas de @rosanneQuily ce que j’ai indiqué doit permettre de se rapprocher de ce qu’elle souhaite (hormis le choix de la langue)

Pour le SVG KeyCloak il faut demander à @Etienne c’est lui qui dessine nos boutons standards

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 2:37pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/11 "2021-01-20T14:37:39Z")

</div>

L’astuce temporaire pour rester sur la page de choix du provider sans montrer le provider interne :

```css
#auth-signin-with-simplicite { display: none; }

```

A mettre dans le `OAUTH2_STYLES` custom.

 ![image](https://community.simplicite.io/uploads/default/original/2X/1/146b669a257210b6e0560cef752632dc02830f34.png)

**Attention** : Ne **pas** le mettre hidden dans `AUTH_PROVIDERS`

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 2:43pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/12 "2021-01-20T14:43:38Z")

</div>

Demo:

 ![image](https://community.simplicite.io/uploads/default/original/2X/4/4482bf352a94683bacd907832ca827ee50b4261f.png)

---

<div class="post-metadata">

**Author:** ![Etienne](https://community.simplicite.io/user_avatar/community.simplicite.io/etienne/32/9431_2.png) [@Etienne](https://community.simplicite.io/u/Etienne)\
**Post date:** [January 20, 2021, 3:18pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/13 "2021-01-20T15:18:39Z")

</div>

Voici les SVG pour Keycloak en ENG et FR si besoin 😉

![Sign in Keycloak ENG](https://community.simplicite.io/uploads/default/original/2X/3/3515247161c1fe894abb552c059c811c32688a1b.svg)

![Sign in Keycloak FR](https://community.simplicite.io/uploads/default/original/2X/6/647b762ba508b2a5b4e024176bb108e8d595d317.svg)

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [January 20, 2021, 3:22pm UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/14 "2021-01-20T15:22:47Z")

</div>

Ok ajoutés au socle V5, merci @Etienne

---

<div class="post-metadata">

**Author:** ![Lezenn](https://community.simplicite.io/user_avatar/community.simplicite.io/lezenn/32/3370_2.png) [@Lezenn](https://community.simplicite.io/u/Lezenn)\
**Post date:** [March 3, 2021, 10:16am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/15 "2021-03-03T10:16:52Z")

</div>

Hello,

J’essais de voir pour supprimer les liens “_I forgot my password_” et “_S’inscrire_” de la page de connexion à une appli Simplicité, par le provider de base.  
Dans le cas du premier lien, j’ai trouvé un paramètre système: `USE_FORGOT_PWD`, que j’ai alors passé à `no` et le résultat est correct.  
Cependant, pour le second lien, je ne trouve aucun paramètre système ni autre façons de l’enlever. Faut-il le définir soi même ? Est-ce possible de l’enlever ?  
J’aurais pensé à une option permettant de désactiver la création de comptes par Simplicité, étant donné qu’ils nous viennent tous d’un provider secondaire.

Merci d’avance :)

---

<div class="post-metadata">

**Author:** ![david](https://community.simplicite.io/user_avatar/community.simplicite.io/david/32/5703_2.png) [@david](https://community.simplicite.io/u/david)\
**Post date:** [March 3, 2021, 10:18am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/16 "2021-03-03T10:18:41Z")

</div>

Le lien “register” est lié au paramétrage de vos groupes de droits.

Si au moins un de vos groupes est registrable vous aurez ce lien, sinon non.

---

<div class="post-metadata">

**Author:** ![Lezenn](https://community.simplicite.io/user_avatar/community.simplicite.io/lezenn/32/3370_2.png) [@Lezenn](https://community.simplicite.io/u/Lezenn)\
**Post date:** [March 3, 2021, 10:27am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/17 "2021-03-03T10:27:18Z")

</div>

C’est bon, merci de la réponse réactive !

---

<div class="post-metadata">

**Author:** ![system](https://community.simplicite.io/user_avatar/community.simplicite.io/system/32/4700_2.png) [@system](https://community.simplicite.io/u/system)\
**Post date:** [April 2, 2021, 10:27am UTC](https://community.simplicite.io/t/parametrage-de-la-page-de-login/2881/18 "2021-04-02T10:27:42Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.