Forums de discussion

Utiliser differents main.css sur la meme instance de liferay

Pierre Gonon, modifié il y a 7 années.

Utiliser differents main.css sur la meme instance de liferay

New Member Publications: 11 Date d'inscription: 31/08/16 Publications récentes
Bonjour,

J'ai une appli web qui tourne sur une instance de liferay.
Pour le moment, cette appli possède des couleurs définies par defaut (scss + css).

Pour faire simple: je souhaite avoir des couleurs différentes en fonction de l'utilisateur qui se connecte.

Je ne suis pas super calé en liferay ni même en css, mais je pensais avoir pleins de main.css en de charger le bon en fonction de l'utilisateur qui charge la page.
Un truc du genre:
- main_DEFAULT.css
- main_RED.css
etc.
Je bloque un peu parce que je n'ai pas la main sur le chargement du main.css.

Merci de me dire si je suis dans la bonne voie, ou si liferay permettrait de faire ca de maniere plus simple?
thumbnail
Eric COQUELIN, modifié il y a 7 années.

RE: Utiliser differents main.css sur la meme instance de liferay

Expert Publications: 254 Date d'inscription: 03/11/13 Publications récentes
Quelle est la question ?

Chaque thème a sa série de CSS et chaque portlet peut aussi avoir son propre CSS. Evidemment, il faut gérer les conflits. Mais la logique consiste à déporter l'aspect esthétique/ergonomique dans le thème pour pouvoir faire évoluer le visuel facilement par la suite.
Pierre Gonon, modifié il y a 7 années.

RE: Utiliser differents main.css sur la meme instance de liferay

New Member Publications: 11 Date d'inscription: 31/08/16 Publications récentes
Pardon j'ai clique sur POST par erreur avant de mettre ma question...;)
thumbnail
Eric COQUELIN, modifié il y a 7 années.

RE: Utiliser differents main.css sur la meme instance de liferay

Expert Publications: 254 Date d'inscription: 03/11/13 Publications récentes
Je ne sais pas si ma solution est la meilleure mais elle fonctionne.

Le problème est que l'intégration d'un CSS se fait soit dans le head soit inline (lire ici)

Au niveau de votre utilisateur, vous pouvez définir un champ expando qui va prendre l'une des valeurs suivantes : ROUGE, BLEU, MARRON, etc. Au moment du chargement du JSP (et donc de la génération du HTML), vous insérez automatiquement le contenu du CSS qui convient.

En alternative, sur un projet, nous avions défini trois champs expando qui correspondaient aux 3 couleurs principales (ainsi chacun pouvait avoir sa combinaison). Le CSS était déjà intégré dans le thème (Velocity or Freemarker) et on remplaçait les valeurs lors de la génération avec les valeurs des champs expando. Cette modification peut se faire dans le JSP aussi.

Dans les exemples, ci dessous, on récupère la valeur du champ expando depuis le site et non pas l'utilisateur (car nous avons le même gabarit de site qui est personnalisé par client, chaque client ayant son site)

#set ($couleur1 = $themeDisplay.getSiteGroup().getExpandoBridge().getAttribute("couleur1")) 
...
#if ($validator.isNotNull($couleur1)  )
<style>
...
.aui a {
    color: $couleur1;
}
.aui .main-header .main-navigation {
    
    background-color: $couleur1;
}
...
</style>
#end
...


Toujours en alternative, plutot que d'avoir le CSS "inline", depuis le thème, il possible de charger le CSS qui va bien en fonction de la valeur du champ expando.

#set ($couleur1 = $themeDisplay.getSiteGroup().getExpandoBridge().getAttribute("couleur1")) 
...

...
<link rel="stylesheet" href="$css_folder/custom_css_$couleur1.css">
...

...
Pierre Gonon, modifié il y a 7 années.

RE: Utiliser differents main.css sur la meme instance de liferay

New Member Publications: 11 Date d'inscription: 31/08/16 Publications récentes
Oui c'est effectivement un idée dans ce genre à laquelle je pensais.
Quelques questions:

#1
Dans quel fichier codez-vous cela? portal_normal.vm, init_vm, init_custom-vm?

#2
Si je comprends bien, ce genre de syntaxe ("$themeDisplay.getSiteGroup().") me donne acces a la base de données de Liferay ?
Ou seulement aux propriétés "expando" de l'utilisateur connecté?

#3
Dans mon cas, nous utilisons un service externe pour gérer l'authentification et l'autorisation des utilisateurs (keycloack). Un programme synchronise cela avec les utilisateurs de liferay.
Je me dis que je pourrais, lors de cette synchronisation, alimenter un champ expando pour chaque utilisateur. Et ainsi le lire lors du chargement avec la syntaxe que vous m'avez donné.
J'ai la version 6.1 de liferay. Est-ce que ces champs expando sont visible dans la section "Custom fields" de chaque user ?

Merci beaucoup
thumbnail
Eric COQUELIN, modifié il y a 7 années.

RE: Utiliser differents main.css sur la meme instance de liferay

Expert Publications: 254 Date d'inscription: 03/11/13 Publications récentes
#1
On a choisit portal_normal.vm mais c'est à vous de voir. Si cela doit être dans le <HEAD>, il faut inclure le code dans le fichier qui génère la balise.

#2
Je n'ai pas la syntaxe User en tête mais elle sera facile à trouver. Et effectivement, la syntaxe exposée permet d’accéder aux données en base pour le site. Globalement, vous pouvez accéder aux données en base à partir d'un thème mais c'est un autre sujet... emoticon

La syntaxe devrait ressembler à ça:
user.getExpandoBridge().getAttribute("couleur1");

Et la variable "user" existe bien

#3
Je ne connais pas la 6.1 mais en 6.2, on voit les champs depuis le control panel dans la section utilisateurs.
Pierre Gonon, modifié il y a 7 années.

RE: Utiliser differents main.css sur la meme instance de liferay

New Member Publications: 11 Date d'inscription: 31/08/16 Publications récentes
Je vais essayer d'implémenter cette solution et je viendrais mettre le résultat ici.

Merci pour les réponses hyper rapides en tout cas!