Passage de Styler5 à Styler6

Bonjour,
Je vous explique mon problème.
Je gère un site internet créer sur Scenari avec le module Optim et un skin créé sur Styler5
Suite au passage à la version 6 je suis un peu largué pour l’appel de mes ressources.
Par exemple jusqu’ici au niveau de l’utilisation des fonts et des images l’appel de mes ressources ressemblait à:
@font-face {
font-family: ‹ mapleBold ›;
src: url(‹ Maple-Bold.otf ›) format(‹ opentype ›);
font-weight: normal;
font-style: normal;

background-image: url(…/img/co/mnuTgle.png);

Lorsque j’importe mon ancien skin, que je crée un habillage guidé et que je mets en ressources le dossier site.skin.doss aucune de mes ressources n’est utilisée.

Je cherche les modifications à faire dans mon fichier CSS pour que les bonnes ressources dans ce dossier là soient appelés…

quelqu’un pourrait m’éclairer sur la déclaration de mes ressources ?

Je vous remercie d’avance

Bonjour,

Si vous voulez réutilisez un dossier skin.doss existant, il faut passer par le mode libre et non guidé.
Certaines choses ont été modifié entre l’ancienne et la nouvelle version d’Optim, je vous conseille de lire OptimOffice 2

Mickaël

D’accord je vous remercie !
J’ai pu modifier mon css et voir comment les définir et appeler les ressources.
Maintenant mon plus gros soucis c’est mon affichage de menu qui est décalé en bas de la page.
Est-ce lié à la suppression des div div .tplFra , .tplColLft , .tplColMid , .tplColRgt , .tplColWrp et .tplColPad ?

Possible en effet, mais difficile à dire sans voir d’exemple.
Avez-vous un lien à partager où je pourrais regarder ça ?

Alors normalement le menu ressemble à ca (fait avec Styler5 et scenari chain 5) gpip . cnam . fr
Mais lorsque je fais le rendu sur Styler6 j’obtiens cela

C’est en effet lié à la suppression de toutes ces div. Nous avons revu le template d’Optim 2 afin de le simplifier.

Il va falloir revoir un peu votre skin pour supprimer les règles associés à ces div et les reporter dans les div restantes.

Pour vous aider, vous pouvez vous appuyer sur le skin par défaut pour voir comment sont positionnés les éléments, un exemple se trouve ici : Site web

Ensuite, si vous en avez le temps et l’envie, je vous suggère d’essayer de basculer sur le mode guidé, il permet de surcharger le skin par défaut (via l’encar « Styles CSS »), ainsi lors des futures montées de version, vous n’aurez plus à vous soucier de la migration du skin.

Juste une chose, passer au mode guidé n’est pas vraiment simple.
Pour ma part j’ai temporairement abandonné l’idée, le rendu du skin final étant bien en utilisant le mode avancé (seul mode permettant d’utiliser les ressources skin.doss.
Une pise de réflexion est que, dans le mode guidé, il n’y a plus qu’un seul CSS.
Dès que j’ai un peu de temps, je vais copier les contenu de tous mes CSS séparés en surcharge pour voir si cela donne le résultat…
A suivre !

Le mode guidé sert en fait à éditer le fichier « skin.css » qu’on retrouve dans les skin.doss, ce fichier est dédié à la surcharge, ainsi, en ne touchant pas au fichier « main.css », aucun problème de migration lors d’une mise à jour du modèle.

1 « J'aime »

@ClementH : Voici comment j’ai réglé le même problème avec le style guidé d’Optim2. J’ai créé un Item Maple.skin.doss, dans lequel j’ai créé un dossier FontMapple, dans lequel j’ai copié-collé le fichier de police maison « Maple-Bold.oft ».
L’item Maple.skin.doss, je l’ai mis dans Répertoire de ressources du style guidé.
Dans la fenêtre Style CSS en haut j’ai écris le code suivant :
@font-face {
font-family: ‹ MapleBold ›;
src: url(‹ res/FontMaple/Maple-Bold.otf ›) format(‹ opentype ›);}
Toujours dans cette fenêtre, dans :root {…}, j’ai créé une nouvelle variable – fontmaple: MapleBold;
Puis après :root {…}, tu peux appliquer cette variable aux titres de ton choix, ex :
h2.slideBk_ti {
font-family: var(–fontmaple) ;
}
Ca n’a pas été facile à comprendre pour moi. Cette façon de faire fonctionne, je ne sais pas si c’est la bonne pratique.
PS: Je n’ai pas migré un skin cependant. J’ai créé un skin à partir de Fool. Voir le tuto ici pour récupérer le code d’un ancien skin.doss : Comment migrer ses skins de scenari 5 au mode guidé de scenari 6 - PicaTube

1 « J'aime »