Escal

Un jeu de squelettes proposant un affichage en 2 ou 3 colonnes avec un large choix de noisettes à insérer ou pas, fortement paramétrable depuis l’espace privé.

La version 3 n’est plus maintenue (sauf gros bug éventuel). Il est donc fortement conseillé d’utiliser la version 4 qui nécessite spip 3.2 minimum.

Présentation

Escal est en grande partie paramétrable directement depuis l’espace privé :
-  choix de la mise en page (position des colonnes, fluide ou pas)
-  choix de la présence (ou absence) des blocs latéraux et centraux, choix de leur colonne et choix de leur ordre
-  choix de l’image de fond et de l’image du bandeau
-  choix des couleurs de fond, du texte et des bords
-  choix du menu
-  choix de la zone d’identification
-  présence ou absence de certains éléments (ombres latérales, titre du site dans le bandeau ...)
-  choix des arrondis
etc

Escal est maintenant en HTML5.

Escal s’internationalise de plus en plus avec les langues suivantes : allemand, anglais, espagnol, espéranto, italien, japonais(en test), letton et néerlandais.

De plus, Escal installe maintenant (version 3.72 et suivantes) pour vous le groupe de mots-clés “affichage” avec tous les mots-clés utilisables dans Escal plus une rubrique avec 2 articles de base : “Edito” et “Accès direct”.

Ainsi, en quelques clics, on peut personnaliser son site.

Bien sur, on peut toujours mettre le nez dans le moteur pour aller plus loin dans la personnalisation, comme avec Escal-V2. Toutes les règles CSS que vous mettrez dans /squelettes/styles/perso.css continueront à prendre le pas sur les règles CSS d’Escal.

Escal nécessite les plugins “Agenda” , “Calendrier-mini” et “svpstats”. Ceux-ci sont donc automatiquement téléchargés et activés lors de l’activation d’Escal.

Documentation et démonstration

Vous pourrez trouver des explications nombreuses et détaillées sur le site de démonstration où vous pourrez aussi utiliser le forum du site pour faire part de vos questions, suggestions, remarques, ... Ce site n’est un modèle d’esthétique et d’ergonomie car il veut montrer un maximum de possibilités d’Escal.

En discuter

Pour discuter d’Escal, proposer des améliorations ou évolutions, résoudre un problème, 3 solutions :

  • écrire un message dans le forum de cet article
  • écrire un message sur le site de démonstration (sous un article ou dans le forum du site)
  • écrire un message à la liste de discussion « spip-avec-escal@rezo.net » : vous abonner et participer

Tester en ligne

L’association Spipfactory vous propose via le Site de test d’Escal de découvrir le squelette.

  • Login & Pass pour tester ...
Type Login Pass
Visiteur visiteur visiteur
Rédacteur redacteur redacteur
Webmestre webmestre webmestre

Si vous avez des idées de paramétrage à rajouter, n’hésitez pas à m’en faire part. Je les mettrais en place ... ou pas !

updated on 24 September 2019

Discussion

62 discussions

  • 5

    Bonjour,

    Comment faire pour avoir du texte dans la couleur que je veux ? Là franchement je ne vois plus. J’ai paramétré les h1 etc. ainsi que le body dans les couleurs que je voulais, que ce soit dans perso.css ou dans general.css et rien du tout le texte reste désespérément, horriblement noir.

    Merci.

    • Hello

      Je te conseille d’utiliser l’extension Firebug pour Firefox qui t’aidera à repérer sur quel class ou id il faut intervenir.
      Parfois, il te faudra rajouter la règle !important pour passer au-dessus des réglages d’Escal
      Exemple :

      .laune  .titre a {
      color: red !important;
      }

      pour mettre en rouge le titre de l’article en exergue sur la page d’accueil.

      Bien sur on met ça dans /squelettes/styles/perso.css et on ne touche pas au reste

    • Mais c’est tout le texte que je veux avoir en bleu et les titres dans un autre bleu c’est pas compliqué... et plus gros. Je ne veux pas avoir un atome de noir sur ce site.

      J’ai donc paramétré body et h1 etc., mais rien du tout. C’est ce que je n’arrive pas à comprendre. Pourquoi ça ne veut pas marcher ?

    • alors le truc radical c’est

      *{
      color: blue ;
      }

      et ça ne marche pas car presque tous les textes ont une surcharge de couleur

    • Donc ça :

      body
      font-size: 1.2em;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      text-align: left;
      color: #17195e; !important;

      et ça :

      h1, h2, h3, h4, h5
      color: #376b91;

      avec les accolades que Spip me vire évidemment, ça ne peut plus marcher ? Je ne comprends pas pourquoi tout l texte est en noir et pourquoi je ne peux pas tout changer d’un coup. Ça devrait, étant donné que c’est en haut de la feuille, passer en premier.

    • Bon d"abord quand spip voit des accolades, il met le texte entre accolades en italiques. C’est un raccourci spip. Il fait donc bien son boulot. Pour voir ces accolades, il faut entourer le code entre des balises < code > et < /code > (sans les espaces) pour que spip n’interprète pas les accolades comme un raccourci.

      Ensuite, tu raisonnes à l’envers : en CSS, c’est le dernier qui parle qui a raison. Si tu écris

      .toto{
      color: red;
      }
      .toto{
      color: blue;
      }

      le texte de la class toto sera bleu, pas rouge.
      C’est pourquoi, j’ai fait en sorte que le fichier /squelettes/styles/perso.css soit appelé en dernier, pour surcharger tous les autres fichiers.css

      Enfin, Escal colle une couleur de texte à tous les blocs séparément, en fonction de leur couleur de fond : blanc sur les fonds foncés et noir sur les fonds clairs

      Pour les surcharger, il faut donc les redéfinir dans /squelettes/styles/perso.css, soit 1 par 1 avec des couleurs différentes, soit globalement comme indiqué plus haut.

    Reply to this message

  • 7

    Bonjour,
    J’utilise Escal 3.66.6 et SPIP 3.01 avec bonheur mais j’ai une petite question (peut-être hors sujet ...) :
    Je n’arrive pas à obtenir une pétition sur un article. j’ai beau activer et préciser le fonctionnement de la pétition, rien n’apparait dans mon article.
    Qu’ai-je donc bien pu oublier ?
    merci d’avance

    • Hello

      tu as bien lu cet article ?

      Je viens de tester sur le site de test et tout fonctionne

    • bonjour,

      l’article évoque l’usage d’une pétition pour faire un annuaire, mais pas l’affichage des pétitions existantes sur un article... inc-article n’affiche pas la pétition associée à l’article.

      Je viens de m’en rendre compte en faisant un site qui est justement centré sur une pétition... Escal me semblait intéressant pour faire facilement un zpip, par rapport à mon expérience sarka... mais...

      j’essaie de compléter pour voir...

      cordialement
      pam

    • Bonjour

      En effet, Escal ne prévoit pas d’afficher les pétitions dans la page article mais dans une page spéciale annuaire.html qui affiche la pétition de l’article avec le mot-clé “annuaire”

      Tu voudrais que chaque article puisse afficher une pétition ?

      Escal n’est pas en zpip mais en spip classique.

    • merci de la réactivité !

      oui, j’avoue ne pas bien voir le rapport entre annuaire et pétition.... j’ai effectivement des sites ou des pétitions se succèdent, et je viens de terminer une v0 pour un nouveau centré sur une pétition

      j’ai donc spécialisé inc-article et inc-annonce... voir http://macommunejytiens.fr
      j’ai pas trop (pas du tout) travaillé le style... c’est du copie/coller brut de la dist standard dans les inc escal... il faudrait certainement faire mieux...

      bon, ce n’est pas zpip... j’avoue que je me suis perdu dans mes essais... et que je n’arrive toujours pas à faire du zpip... il m’avait semblé que le principe des noisettes sélectionnables dans escal était un peu zpipien... ?

      mais bon, comparé à sarka, ca fait une configuration plus simple et graphiquement moins carré...

      pam

    • Ben c’est très bien ce que tu as fait. Où coinces-tu ?

    • je coince pas vraiment, c’est juste du temps qu’il faut ;-o)

      Mais la pétition tel quel est dans le même style que le texte de l’annonce, et je trouve qu’il faudrait lui mettre un style qui apparaisse comme un sous-pavé, écrit plus petit...

      et l’idéal serait de l’avoir dépliable, pour qu’on voit s’il y a une pétition, et par exemple le nb de signatures, mais qu’on ne l’affiche que sur demande...

      bon, je vais l’apprivoiser progressivement...

      pam

    • OK

      N’hésites pas à me contacter si tu as besoin d’un coup de main.
      Je peux aussi regarder de mon côté pour l’intégrer dans Escal.

    Reply to this message

  • 3

    Bonjour,

    il semble super intéressant ce squelette et très flexible ! Il est Z3C effectivement mais alors excusez, ... mais pour le référencement sous Bing ou Google de ses sites, cela promet ! ils doivent tous promouvoir des cadres ! ;-)

    Affichez le code source des pages (http://projetice.crdp.ac-lyon.fr/escal/-Installer-?lang=fr, ou http://projetice.crdp.ac-lyon.fr/escal/Presentation?lang=fr par ex, : il y a 4 champs “cadre ..” par page entre balise H1 :or il en faut un maxi par page, et qui signale de quoi on y parle. Voir outils pour les Webmaster de Bing et Google.....
    A reprendre en profondeur sur le thème des balises Hx.

    Bien cordialement

    WP

    • Bonjour

      Je suis toujours preneur de bonnes idées pour l’amélioration d’Escal mais là je ne vois pas où est le problème. Peux-tu me donner des url qui parlent de ces cadres limités à 1 par page ?

      A noter qu’en l’occurrence, il ne s’agit que d’un nom de class donné aux balises h1. Qu’appelles-tu un “champ” exactement ?

    • bien sur :
      voici les consignes de base: http://www.bing.com/webmaster/help/webmaster-guidelines-30fba23a pour Bing et http://support.google.com/webmasters/?hl=fr pour Google

      il ne disent pas qu’il en faut un seul H1 mais quand j’en avais 4 avec Sarkaspip par ex, sous mon compte de webmaster , j’avais des remarques négatives graves. Maintenant je viens de refaire mes sites avec Zpip : http://www.saisie-mobile.eu/ ou http://www.productivix.com/ ou encore http://www.yanfouom.net/ et c’est propre de ce côté. la balise “title” = le titre de l’article +“-”+ le titre du site, sous H1 = le titre de l’article, ou de la rubrique, ou de la brève ou du mot clé, selon. Mais un seul H1. Ensuite sous le H1 tu as des H2, sous les H2 des H3 (hiérarchie à respecter), etc

      Tu passes aussi ta page dans le W3C validator http://validator.w3.org/ pour les css .

      Sinon il y a aussi ce site avec son forum où il y a plein de conseils très pointus sur le référencement http://www.webrankinfo.com/ . Ton ref est lié au contenu et aussi à la “pureté du code” ;-) .

      Les effets ne sont pas visibles immédiatement, parfois qq mois avant d’en voir le résultat: alors mieux vaut faire attention.
      Bon courage et travail !

    • Ok merci pour ces liens. Je vais potasser le sujet.

      Néanmoins, je me permets de te faire remarquer que tes title sont trop longs d’après ce qu’en dit webrankinfo

      De plus il semblerait que le critère principal d’un bon positionnement est avant tout le contenu du site, et c’est tant mieux !

    Reply to this message

  • j’avais oublié de répondre à la question “champ” :
    champ pour moi c’est ce qui a entre H1 et /H1, ou entre Title et /Title

    Reply to this message

  • 6
    http://www.openidfrance.fr/ysabeau

    N’empêche, ça serait bien dans la description du squelette de donner la liste des plugins dont il dépend :-(

    D’autre part, je ne comprends pas pourquoi l’adresse de téléchargement n’est plus utilisable par Spip3, si c’est un fichier zip, mais justement Spip3 n’accepte pas.

    • Hello, je viens de noter les dépendances d’Escal. Ceci dit, je ne vois pas où est le problème ...

      En revanche, je ne comprends pas ton souci de téléchargement. Je viens de faire une formation avec activation d’Escal sans aucun souci.

    • http://www.openidfrance.fr/ysabeau

      Ben parce qu’ils n’ont pas été automatiquement téléchargés justement.

    • tu passes bien par “ajouter des plugins” de l’espace privé de spip3 ?

    • http://www.openidfrance.fr/ysabeau

      Il y a un autre endroit où ajouter des plugins dans l’espace privé ?

      Donc oui, évidemment.

    • Tu aurais pu télécharger le plugin sur ton ordi et le transférer par ftp (tu ne savais pas qu’on pouvait faire ça ?)

    • Ysabeau

      Directement dans l’espace privé il n’y a a pas d’autre moyen. J’ai du effectivement passer par l’équivalent ftp en local.

    Reply to this message

  • 7

    bonjour,

    des suggestions de personnalisations :

    • dans les colonnes, pouvoir déplacer les blocs verticalement (plus haut ou plus bas)
    • intégrer le bloc recherche dans les panneaux latéraux
    • lorsqu’on choisit le 2e menu vertical, pouvoir afficher également les articles
    • Pour déplacer les blocs dans les colonnes, j’y ai déjà pensé mais aucune solution ne m’est encore venue à l’esprit.

      Pour le bloc recherche, ça doit pouvoir se faire.

      Pour les articles dans le 2e menu vertical, ça doit aussi pouvoir se faire.

      Merci pour ces suggestions.

    • La version 3.61.0 répond à 2 de tes suggestions (pas la première ...)

    • Ta première suggestion m’a donné envie de me replonger plus à fond dans cette option et j’ai trouvé une idée pour mettre ça en place. Patience ...

    • autre chose : certaines noisettes ne sont affichables que dans une colonne ; par exemple l’identification plus développée, on ne peut pas la mettre à gauche.

    • Bonjour sarah,

      si si depuis la version 3.62.3
      les noisettes peuvent ce déplacer de droite a gauche ou de gauche a droite et aussi du bas vers le haut ou du haut vers le bas

      pour faire simple tu la positionne ou tu veux ;)

      ps;/ ya t’il moyen d’avoir l’URL de ton site pour l’epingler sur spipfactory.com & a tu penser a referencer ton site sur http://nout.crdp.ac-lyon.fr/escal/spip.php?page=annuaire

      @micalement

    • le site est là : http://www.piedsdanslepaf.com/

      (ça a été un peu long avant la mise en ligne !)

      Je suis à la version 3.60.
      Il n’y a pas de problème de mise à jour ? je peux la faire tranquille ?

    • Bien sur que tu peux faire la mise à jour.
      Tu verras que tu pourras gérer l’image du bandeau facilement, ce qui te permettras de virer le logo de l’académie de Lyon.

    Reply to this message

  • 1

    bonjour,

    Est-il possible, dans le menu, d’exclure certaines rubriques ?

    Reply to this message

  • 3

    Bonsoir

    J’essaie de mettre en place un site avec escal que je trouve extraordinaire. Celui est hébergé sur infomaniak mais comme c’est en cours de dvp, je ne peux transmettre l’adresse. Mes problèmes sont les suivants:
    -  le message “Cette page ne peut pas fonctionner correctement sans JavaScript. Veuillez le réactiver” s’affiche or javascript est activé dans mon firefox
    -  lorsque je clique sur les onglets de la partie centrale, rien ne se passe
    -  le mini calendrier ne s’affiche pas
    -  les photos au hasard non plus.

    Il est certain que j’ai du passer a coté de qqch d’important mais je ne vois pas :-(

    Merci d’avance pour votre aide

    SPIP 3.0.5 [19905]

    • Visiblement, c’est en effet un problème de javascript. Je suis très étonné que le message d’alerte alors que le javascript est activé !

      Tu es sur que dans “options” onglet “contenu” la case “Activer JavaScript” est bien cochée ?

    • C’est à n’y rien comprendre. Mon mail EST renseigné.
      Je joins une copie d’écran pour javascript. D’autant plus bizarre que le site de test http://spipfactory.com/testescal/ fonctionne parfaitement donc le problème vient clairement de moi...

    • Ok, j’ai eu ton URL par spipfactory

      A mon avis, c’est au niveau de l’hébergeur qu’il faut regarder.

    Reply to this message

  • 1
    Sébastien

    “Photos- en-Une”, c’est bien.
    Quel contrôle peut-on avoir sur cet affichage parmi toutes les photos dont les articles possèdent ce mot-clef ?
    Depuis le temps que je choisis des articles avec ce mot-clé, ce sont toujours les mêmes photos qui s’affichent, dans un ordre quasi-fixe. Ce serait bien s’il y avait un petit désordre, ici
    La diversité, c’est bien.
    Ce serait intéressant que ce soit, par exemple, les photos les plus anciennes, ou bien les plus récentes, etc.
    Je ne sais pas comment agir sur cet aspect.
    S

    Reply to this message

  • 6

    bonjour. je suis tout nouveau. sous spip et sous escal.

    merci pour à tous pour tout ce travail de fou.

    par contre, j’ai un soucis: je pense que la version d’escal disponible sur le dépot n’est pas la dernière.
    comment fait on pour upgrader?

    • La dernière version est la 3.56.0
      Ce n’est pas celle que tu vois ?
      Pour upgrader avec spip3 c’est très simple : dès qu’une mise à jour est disponible, quand tu vas dans l’espace privé -> Configuration-> gestion des plugins, tu vois un bouton “Mettre à jour” quand tu survoles la ligne d’un plugin. Y’a plus qu’à cliquer !

      Merci pour les fleurs, je transmettrai à tous, c’est à dire ... moi !

      J’espère que tu prendras beaucoup de plaisir avec Escal.

    • bonjour et merci pour ta réponse.
      vérification:
      par Jean-Christophe Villeneuve
      Version : 3.55.2 SVN [66967]
      Répertoire : plugins/auto/escal/v3.55.2/

      et je ne vois pas l la possibilité de mise à jour... je ne dois pas regarder au bon endroit

      et dans cette version, on dirait que le design n’est pas stable: parfaois il prend toute la page, parfois c’est tout bon, parfois tout est en blanc. quand je n’ai pas le bon design, il faut que je rafraîchisse plusieurs fois la page,

    • je te donne deux url
      l’une est chez one.com et l’autre...
      heu... je ne sais pas. one peut être aussi,
      http://www.thierrydetournay.be/eschool1/
      http://logitheque2.rasquinet.be

      j’ai installé escal via le dépot officiel des plugin, par l’interface privée

      j’utilise SPIP3.0

    • Bon le problème a été résolu hors forum de contrib pour éviter de polluer.

      effectivement , la maitrise de mise a jour du plugin n’est pas facile pour un néophyte en spip; je m’en vais de ce pas réaliser un tuto.

      @micalement

    • Attends, avec Spip3, si on installe un plugin par l’interface d’installation de Spip (ce qui est le plus facile), ensuite la mise à jour est on ne peut plus simple !

    Reply to this message

Comment on this article

Who are you?
  • [Log in]

To show your avatar with your message, register it first on gravatar.com (free et painless) and don’t forget to indicate your Email addresse here.

Enter your comment here

This form accepts SPIP shortcuts {{bold}} {italic} -*list [text->url] <quote> <code> and HTML code <q> <del> <ins>. To create paragraphs, just leave empty lines.

Add a document

Follow the comments: RSS 2.0 | Atom