logo site
SpipFactory.fr
Slogan du site

C’est une plateforme d’hébergement autogéré en association de loi 1901.
Propulsée par la mutualisation de Spip. Habillage Escal .

logo article ou rubrique
Documentation Escal - SpipFactory
Article mis en ligne le 15 décembre 2018
dernière modification le 14 octobre 2019

L’article que vous allez lire est issu des différentes sources de documentation existantes. Il existe car le web est volatile, il serait dommageable pour les utilisateurs de la plateforme SpipFactory, du cms Spip et du squelette d’Escal de ne pas retrouver l’information.

Ça y est ... ?

Suite à votre inscription via la page contact de SpipFactory, votre compte est ouvert, conformément aux statuts et au réglement intérieur

Article 8 : Admission - Adhésion & Article 4.3 : La procédure d’adhésion

Vous avez reçu un e-mail pour confirmer votre inscription avec votre fiche membre, celle-ci vous fournissant les login et pass.

Tout ce dont vous avez besoin, c’est d’un navigateur Web (n’importe lequel, j’ai une préférence pour "Firefox")

A Connaître le Concept d’utilisabilité

L’utilisabilité ou usabilité est définie par la norme ISO 9241 comme le degré selon lequel un produit peut être utilisé, par des utilisateurs identifiés, pour atteindre des buts définis avec efficacité, efficience et satisfaction, dans un contexte d’utilisation spécifié.

C’est une notion proche de celle d’ergonomie, qui est cependant plus large.

Le concept d’utilisabilité lui-même a été utilisé plus tard notamment par Nielsen (1993). Ses travaux portent sur l’ergonomie des systèmes d’information et plus particulièrement sur les sites Web auxquels se réfèrent des milliers d’articles aujourd’hui. Nielsen propose cinq critères d’utilisabilité :

Les critères de l’utilisabilité sont :

  • l’efficience : qui se réfère au fait d’atteindre le but fixé sans perdre de temps,
  • l’apprenabilité : qui est la facilité et/ou la rapidité avec laquelle l’utilisateur se familiarise avec le système d’information,
  • la mémorisation : qui consiste à pouvoir mémoriser comment fonctionne l’outil et ce qu’a fait l’utilisateur,
  • la fiabilité : qui concerne la prévention des erreurs,
  • la satisfaction de l’utilisateur.

Voici donc les concepts-clés de l’utilisabilité et définitions que toute personne s’intéressant à l’ergonomie et à l’utilisabilité devrait connaître.

Le principe des 7+2 éléments

Le cerveau humain étant limité dans sa capacité à traiter l’information, celui-ci aborde la complexité en traitant l’information par blocs.

Les études menées par George A. Miller tendent à montrer que notre mémoire à court-terme ne peut retenir que 5 à 9 éléments à la fois.

Ce fait est souvent utilisé comme un argument pour limiter le nombre d’options de navigation d’un menu à 7.

Essayer dans votre Menu horizontal ou vertical d’escal de respecter

La règle des 2 secondes

En vertu de ce principe, un utilisateur ne devrait pas avoir à attendre plus de 2 secondes certaines réponses du système, comme le passage d’une application à une autre, ou le lancement d’un programme.

Le choix des 2 secondes est arbitraire, mais il s’agit d’un ordre de grandeur raisonnable.

Ce qui est sûr, c’est que moins l’utilisateur attend, meilleure est son expérience.

Nous essayons de maintenir ce délai sur le serveur de la plateforme

La règle des 3 clics

Selon cette règle, les utilisateurs tendent à abandonner un site lorsqu’ils ne sont pas capables d’accéder à l’information ou au service en l’espace de 3 clics.

Cette règle met donc l’accent sur la nécessité d’une navigation claire, d’une structuration logique et d’une arborescence simple à appréhender.

Le chiffre de 3 clics n’est cependant pas critique : le plus important est que l’utilisateur sache où il en est et qu’il n’ait pas l’impression de perdre le contrôle.

Essayer de ne pas allez au delà d’une sous-sous rubrique pour atteindre un article
Escal propose un fil d’Ariane & propose un moteur de recherche

La loi de Pareto ou la règle des 20/80

Cette loi postule que 80% des effets viennent de 20% des causes. Bien connue du marketing, cette loi peut aussi s’appliquer en matière d’utilisabilité. Par exemple, des progrès très importants peuvent souvent être accomplis en identifiant les 20% d’utilisateurs, des activités ou des processus qui représentent 80% du profit et en ciblant les efforts sur cette population.

Utiliser les statistique d’escal, du server, des évènements ou des trace sur le site.

Les 8 règles d’or de la conception d’interface

Suite à ses recherches sur la conception d’interfaces, Ben Shneiderman a proposé un ensemble de règles empiriques, applicables dans la plupart des systèmes interactifs. Ces règles concernent tout aussi bien les interfaces utilisateurs que les interfaces web.

  • Recherchez la cohérence avant tout.
  • Offrez des raccourcis aux utilisateurs avancés.
  • Offrez un retour d’information (feedback).
  • Concevez des dialogues avec une fin explicite.
  • Offrez des moyens simples de gestion des erreurs.
  • Permettez des retours en arrière simples.
  • Faites en sorte que l’utilisateur se sente le maître.
  • Ne sollicitez pas trop la mémoire à court-terme de l’utilisateur.

Et bien voilà, 30% a vous de faire, 70% a Escal de faire

La loi de Fitts

Énoncé par Paul Fitts en 1954, ce modèle du mouvement humain prévoit que le temps nécessaires pour atteindre rapidement une zone cible est fonction de la distance et de la taille de la cible. C’est le cas par exemple d’un mouvement de souris. Jouer sur la taille et la distance de la cible peut alors influer sur l’accessibilité et l’efficacité de l’interface.

A Escal de faire via les CSS

La pyramide inversée

La pyramide inversée est un mode d’écriture ou le résumé d’un article est présenté dés le début de celui-ci. Cette approche est bien connue des journalistes : l’article débute donc par une conclusion suivie d’éléments-clés et finalement d’éléments de moindre importance. Les internautes recherchant une gratification immédiate, la pyramide inversée est importante aussi bien en matière d’écriture qu’en matière d’expérience utilisateur.

ç’est vous qui voyez pour votre article, mais spip via le chapeau, surtitre, titre, résumé, vous permet de le faire

Satisfaction

Les utilisateurs du web ne recherchent pas la meilleure façon de résoudre leur problèmes, mais bien la résolution effective de ceux-ci. Ils ne sont pas intéressés par la solution la plus intelligente, mais au contraire favorisent les solutions qu’ils jugent "satisfaisantes", même s’il existe des solutions plus performantes sur le long terme.

Voilà bien à quoi elle sert la liste escal : https://listes.rezo.net/mailman/listinfo/spip-avec-escal

Le syndrome de l’oisillon

Ce syndrome décrit la tendance naturelle des utilisateurs à adhérer au premier type d’interface expérimenté et à juger les autres en fonction de leur degré de similarité avec le premier. La conséquence est que les utilisateurs préfèrent en général les systèmes auxquels ils sont habitués et rejettent ceux qui ne leur sont pas familiers. Ce qui posent des problèmes en matière de design : les utilisateurs, habitués à un design, se sentent souvent mal à l’aise lorsqu’une nouvelle interface est mise en place.

La c’est plus spip qui gère sont interface "back office" et "Escal" le coté public
ceci étant il existe d’autre visuel, on les proposent, mais vous disposez

Les internautes tendent à ignorer tout ce qui ressemble à de la publicité et ils sont même assez bons à ce jeu. La publicité est bien perçue, mais elle est ignorée la plupart du temps. La raison en est que les utilisateurs cherchant de l’information se concentrent uniquement sur les zones où ils pensent pouvoir trouver celle-ci, c’est-à -dire les liens et les zones de texte.

L’association n’affichera jammais de publicité, c’est écrit noir sur blanc dans les status

Les effets Cliffhanger et Zeigarnik

L’être humain ne supporte pas l’incertitude : qu’une question lui vienne à l’esprit, il lui faut absolument une réponse. L’effet Cliffhanger, qui est fréquemment utilisé pour pimenter les intrigues, exploite cette tendance en introduisant une interruption soudaine qui laisse l’utilisateur face à une révélation choc ou à une situation non-résolue. Cet effet est aussi très souvent utilisé dans la publicité, où poser des questions ouvertes ou provocantes pousse l’utilisateur à lire une publicité ou à cliquer sur une bannière.

Découvert en 1927, l’effet Zeigarnik désigne le fait qu’une tâche a tendance à être mieux mémorisée lorsque elle est interrompue. Appliqué au web, cet effet établit une connexion émotionnelle avec les lecteurs et est extrêmement efficace en terme de marketing. Les internautes mémorisent alors mieux les publicités. Cet effet est aussi exploité pour fidéliser les utilisateurs d’un site (ex : "Abonnez-vous à notre fil RSS pour ne pas manquer la suite de l’article").

la plateforme via sa communication en joue parfois

Les lois de la Gestalt

Aussi appelé "psychologie de la forme", cet ensemble de principes constitue un des fondamentaux de la conception d’interfaces.

  • Loi de proximité : lorsque nous percevons une collection d’objets, nous considérons les objets proches les uns des autres comme formant un groupe.
  • Loi de similitude : lorsque nous percevons des objets jugés similaires, nous les voyons comme formant un groupe.
  • Loi de Prégnanz : au sein de notre champ visuel, certains objets sont perçus comme étant de premier plan (les figures), tandis que les autres sont perçus comme d’arrière plan (le fond).
  • Loi de symétrie : nous concevons souvent les objets comme des formes symétriques ayant un centre.
  • Loi de bonne continuité : nous tendons naturellement à clore ou compléter des objets qui ne sont en réalités pas clos (ex : le logo IBM)

L’effet d’auto-référence

L’auto-référence est particulièrement importante en matière d’écriture web et peut améliorer significativement la communication entre l’auteur et le lecteur. Nous nous souvenons en effet davantage des choses lorsqu’elles ont un lien avec nos concepts, nos expériences. Il est donc souhaitable d’exploiter l’auto référence quand on souhaite communiquer plus efficacement.

L’eye-tracking (ou oculométrie)

L’eye-tracking est un procédé qui consiste à enregistrer le parcours du regard sur une interface, pour ensuite dresser une carte des zones les plus vues. Cette technique permet notamment d’évaluer la facilité de navigation d’un site.

Le "pli" (fold)

Le "pli" se définit comme étant la limite inférieure en dessous de laquelle le contenu du site n’est plus visible. Cette limite est dépendante de la résolution de l’écran. La région au dessus du pli, visible sans scrolling, est appelée "page écran".

La zone fovéale

La fovéa est la partie de l’oeil humain en charge de la vision centrale. Cette vision centrale nous sert à lire, conduire, regarder la télévision et à accomplir toutes les activités où le besoin de détail est très important. La zone fovéale désigne la zone du regard où le maximum de détail peut être perçu. Cette zone occupe un angle de vision d’environ 2 degrés.

Les annotations

L’annotation est une action automatique fournissant des informations sur la destination d’un lien ou la fonction d’un contrôle. Concernant les liens, une annotation peut être délivrée grâce à l’attribut "title". Les annotations participent à l’utilisabilité d’un site, en permettant aux utilisateurs de savoir précisément où ils vont.

Escal utilise l’attibut "title", spip pour ldifférencier les liens interne et externe

Dégradation élégante

La dégradation élégante désigne la capacité d’un site ou d’une page à fournir une information ou un service même si certains de ses composants ne peuvent être utilisés. En pratique, cela revient à s’assurer que le site reste utilisable quelle que soit la configuration de l’utilisateur.

La granularité

La granularité mesure à quel degré un ensemble complexe d’informations a été réduit en un nombre plus petit d’éléments. La granularité de l’information peut être adaptée en fonction du public visé.

Les zones sensibles

Les zones sensibles sont des zones cliquables qui changent de forme ou d’apparence une fois survolées ou cliquées. Ces zones utilisent souvent la propriété CSS ":focus".

Utilisé par escal sur les bloc latéraux

La lisibilité perceptive

La lisibilité perceptive (legibility) mesure la facilité d’un texte à être lu. Elle ne s’intéresse qu’à la perception visuelle et non à la compréhension du texte.

la barre de texte dans la création d’article aide a la mise en page

La navigation en "démineur"

Ce terme (minesweeping) désigne un mode de navigation à l’aveugle où l’utilisateur proméne sa souris, sur la page, en utilisant le changement d’apparence du curseur pour détecter les liens. Un tel comportement indique la plupart du temps un défaut de conception de l’interface.

Heureusement c’est pas le cas

La navigation "mystère"

La "navigation mystère" (mystery meat navigation) est un terme décrivant des interfaces de navigation difficilement utilisables du fait que les destinations des liens ne sont pas clairement identifiables. C’est souvent le cas des éléments de navigation à base d’icônes non-standards.

Spipfactory, escal et spip ne propose que des icones standard

La cohérence visuelle

Ce concept décrit la cohérence de l’agencement physique du site (places du logo, des éléments de navigation, typographie...). La cohérence est essentielle pour un repérage et une navigation efficaces.

Escal de par sa conception et modularité tente a maintenir la cohérence

L’enrichissement progressif

L’enrichissement progressif est une stratégie de conception d’interfaces où les fonctionnalités sont ajoutées par couches. À la couche de base, accessible à tous les navigateurs, sont ajoutées des fonctionnalités supplémentaires pour les utilisateurs de navigateurs modernes. L’avantage principal de ce mode de conception est l’accessibilité des interfaces ainsi produites.

La lisibilité cognitive

La lisibilité cognitive (readability) mesure la facilité d’un texte à être compris en se basant sur la complexité des phrases et sur le vocabulaire employé. Le plus souvent, ce type de lisibilité se mesure en terme d’âge ou d’années d’étude nécessaires pour comprendre le texte. La lisibilité cognitive est à distinguer de la lisibilité perceptive.

La conception centrée utilisateur

La conception centrée utilisateur (CCU) est un mode de conception où les utilisateurs, leurs besoins, leurs intérêts et leurs comportements définissent les fondations d’un site en termes de structure, de navigation et d’information. La CCU est aujourd’hui devenue un standard, en particulier grâce à l’essor du web 2.0 où le contenu est généré pour une large part par les utilisateurs.

Que dire ; c’est bien ce qu’on tente de faire

La vigilance

La vigilance, ou état de veille, est la capacité à rester attentif lors de l’accomplissement de tâches longues, monotones ou répétitives, comme la relecture de documents, la gestion d’emplois du temps, la sauvegarde régulière de fichiers, etc. Dans les applications web modernes, les tâches de cet ordre sont automatisées et gérées en arrière-plan, ce qui améliore l’utilisabilité puisque la vigilance des utilisateurs est limitée.

Spipfactory gére la mise a jour du contenant, préoccuppé vous du contenu

Le design intuitif (Walk-Up-And-Use design)

Le design d’une interface est dit intuitif quand un utilisateur est capable d’utiliser l’interface dès la premiére fois, sans aucune introduction ou formation.

Bravo SPIP

Les Wireframes

Le wireframe, ou "maquette fonctionnelle", est un squelette qui décrit les idées, les concepts et la structure d’une interface ou d’un site (exemples ici et là ). Les wireframes peuvent être utilisés pour présenter un projet de site aux parties prenantes. Le design d’un wireframe est en général très sommaire et il s’agit même fréquemment de simples croquis (JPG) réalisés sur papier.

Configurer votre site

Un site créé avec SPIP est divisé entre deux parties distinctes :

  • Le site public
    C’est l’ensemble des pages accessibles à tout visiteur. Il s’agit de l’affichage des articles, rubriques que vous avez publiés, ainsi que des interventions dans les forums qui y sont associés.
    Interface Public sous habillage "Escal"
  • L’espace privé
    C’est l’espace à accès restreint dans lequel les administrateurs et rédacteurs peuvent écrire des articles, modifier la structure du site, suivre et modérer les contributions postées dans les forums, etc.
    Interface Privé

Il est nécessaire d’être enregistré pour accéder à cet espace, c’est-à-dire d’avoir un login et un mot de passe.

L’espace privé est accessible depuis l’adresse via votre navigateur : http://localhost/spip/ecrire/ localhost est a remplacé par l’url de votre site

Configurer votre Spip

La première chose à faire sur votre site SPIP et d’indiquer son identité : son nom, son slogan, son adresse Web, etc.

Vous trouverez tout dans Configuration -> Identité du site.
Interface Privé de Spip

Notez au passage que ces informations importantes sont utilisées par des balises ou des formulaires présents dans les squelettes de votre site ; ces informations agissent sur le contenu de vos pages et donc sur le référencement de votre site.
Interface Privé de Spip

  • Nom de votre site
    Le premier champ du formulaire, intitulé « Nom de votre site », permet de saisir et d’enregistrer le texte qui deviendra le nom du site affiché dans le titre de chacune des pages. Par défaut celui-ci contient « [Mon site SPIP] » : n’oubliez pas de changer ce nom et d’y mettre le vôtre !
  • Slogan du site
    C’est la description courte de votre site / activité.
  • Adresse (URL) du site
    Ce champ doit contenir l’adresse URL de votre site public.
    Astuce : laissez ce champ vide et validez le formulaire. Le champ sera automatiquement rempli.
  • Descriptif rapide
    Rédigez quelques phrases courtes et descriptives qui permettront aux visiteurs de savoir rapidement de quoi parle votre site.
    Note : ce descriptif peut être utilisée pour remplir la balise meta description destinée aux moteurs de recherche. Dans ce cas, la description doit contenir moins de 160 caractères.
  • Adresse e-mail du webmestre
    Par défaut, SPIP prend l’adresse de celui qui a installé le site (le premier administrateur).
  • Logo du site
    ce logo est affiché dans le bandeau. Choisissez-le donc de dimensions raisonnables.

Mon site Public est vide, que dois-je faire ?

Un site SPIP fraîchement installé est vide. La première chose à faire est de commencer à créer l’arborescence du site, que vous pourrez bien sûr compléter par la suite.
Il vous faut créer au moins une rubrique.

Pour cela, cliquez sur le lien « Créer une rubrique ».

Saisissez les informations dans le formulaire.

Et ainsi de suite pour chaque nouvelle rubrique ou sous-rubrique.

  • J’ai créé une rubrique, mais elle n’apparaît pas dans le site public !
    Seules apparaissent les rubriques contenant au moins un élément (article, site, rubrique) publié (nous soulignons), ainsi que les rubriques englobant celles-ci. Il faut donc au minimum écrire un article et le publier.

Vous pouvez bien sûr publier un article fantoche afin de tester le système.

  • J’ai fait tout cela, mais rien n’apparaît !
    Le site public utilise un système de cache, c’est-à-dire que les fichiers sont recalculés à intervalles réguliers (toutes les heures ou toutes les deux heures, en fonction des réglages à l’intérieur des scripts PHP). Ce système permet d’économiser les accès à la base MySQL, et de continuer à fonctionner au cas où MySQL est planté (ce qui est fréquent chez certains hébergeurs de piètre qualité).

Il faut donc forcer la régénération de la page que vous pensez erronée. "CTRL+F5" ou Empty-Cache-Button Addons de Firefox

Exemple de création de "Rubrique et d’un article publié .
(note : La mise en page public est réalisé par le squelette "Escal", voir la partie le concernant)

Qu’y a-t-il au menu ?

les items de navigation se répartissent, comme une tranche napolitaine, en trois registres horizontaux de faible encombrement et aux rôles bien distincts :

le premier registre est identifiant : il me rappelle le site sur lequel je travaille (à droite) et ma session (à gauche) et... c’est tout, car les noms du site et de l’utilisateur peuvent être longs et encombrants. Ce registre donne les repères élémentaires, actuellement absents de l’espace privé de SPIP, et qui permettent de se situer : où suis-je ? avec quel compte suis-je connecté ? dans quelle langue ?


Vient ensuite une indispensable barre de navigation complète, qui permet d’accéder à l’ensemble des pages de l’interface, dotée d’icônes, déplie ses menus au survol.


Le troisième registre propose des outils et des raccourcis d’accès rapide, non indispensables mais si pratiques qu’on ne sait plus s’en passer : liens de création directe, plongeur de rubriques, recherche, etc.

A savoir : Chaque menu regroupe les tâches susceptibles d’être effectuées par une même personne et les informations qui lui seraient utiles, selon les différents rôles possibles : rédacteur, modérateur, administrateur, webmestre.
Il s’agit surtout de fournir un menu à chacun, sans l’encombrer avec des tâches qui ne le concernent pas.

  1. Le premier menu, « Édition », permet aux rédacteurs de consulter et d’éditer (c’est-à-dire créer, modifier ou supprimer) les contenus du site : lister et trier les articles, écrire une nouvelle brève, ajouter un document, modifier le rubriquage, mais aussi éditer d’autres types d’objets, ajoutés par les plugins ;
  2. le menu suivant permet, si les options correspondantes sont activées, de suivre l’activité éditoriale du site (suivi de versions, calendrier, messagerie et forums internes, etc) ; serait-ce le rôle du rédac’ chef ?
  3. le menu suivant permet de gérer, s’il y a lieu, les contributions externes et tout ce qui relève de l’interactivité du site avec ses internautes (forums, pétitions, listes de diffusion, abonnements, etc.), ce qui est généralement le rôle des modérateurs ;
  4. le menu suivant regroupe les opérations d’administration et de maintenance ordinaire : sauvegarde de la base, gestion du cache et des accès, etc. que seuls les administrateurs peuvent effectuer ;
  5. tandis que le dernier, « configuration », ne sert logiquement qu’une fois dans la vie du site puisqu’il regroupe les réglages qu’effectue le webmestre après l’installation.

C’est donc celui-là, que l’on va configurer a minima pour que votre site soit opérationnel et profite de toute la puissance d’Escal.

Trois façon pour écrire votre article

Préalable quelque soit la façon dont vous écriviez votre article, il faut être connecté et avoir les droits suffisant de rédaction

Dirigez-vous dans la zone d’administration d’écriture d’un article, se positionner dans la rubrique où l’article sera rédigé (c’est un impératif et si aucune rubrique n’est présente, il vous suffit d’en créer une) et cliquer sur « Écrire un nouvel article »

Remplir si besoin les éléments complétant l’article, celles-ci viendront se placer automatiquement dans votre site. Si le chapeau n’est pas rempli, ce sera le descriptif qui sera affiché à sa place (si celui-ci est lui rempli bien entendu)

  • Choisir un titre et un descriptif simple améliora votre référencement

Ensuite vous pouvez commencer a rédiger le contenu de l’article dans la partie « Texte »

Plusieurs outils sont inclus sur la plateforme pour vous faciliter la rédaction :

Écrire un article

Avec Spip, dans l’Espace Privé ou Public

Les raccourcis SPIP

Pour faciliter la mise en forme des textes, le système propose un certain nombre de « raccourcis SPIP » destinés à :

  • simplifier la vie des utilisateurs ne connaissant pas le langage HTML ;
  • faciliter le traitement automatique de la mise en page.

Qu’est-ce c’est ?
Ces raccourcis reposent sur les touches rarement utilisées dans un texte - les accolades notamment - pour créer rapidement de l’italique et du gras, par exemple.

Antisèche SPIP

Ces raccourcis permettent de rédiger en ligne presque aussi simplement que l’on écrit un courrier électronique, SPIP respecte automatiquement les principales règles d’espacement de la typographie française.

Via le « Back-Office » l’interface privée

Écrire un article dans l’interface privée : le back-office.
La saisie d’un article dans l’espace privé de SPIP est découpée en deux pages

  • La première permet de renseigner, le titre, le descriptif et le texte de l’article. Elle permet également de changer la rubrique de l’article, le cas échéant. Elle offre deux fonctionnalités supplémentaires lorsque l’article est enregistré (ajout d’une image et ajout d’un document).
  • La seconde permet d’affecter certaines options à l’article

La saisie d’un article dans SPIP présente certaines complexités, particularités qui ne facilitent pas le travail du débutant :

pour insérer un document dans le texte de l’article, il faut enregistrer l’article, ensuite, il faut copier le raccourci du document dans le texte (ou double cliquer dessus) ; écessité d’enregistrer l’article avant de pouvoir ajouter une image (sinon le formulaire d’upload d’image n’apparaît pas) ; il faut cliquer sur un triangle pour déplier certains blocs ; lorsque l’on modifie le texte de l’article et que l’on ajoute un document via la colonne de gauche, on perd les modifications apportées au texte ; lorsque l’on supprime un document, cela ne supprime pas le raccourci inséré dans le texte de l’article ; si un groupe de mots-clés a plus de 50 éléments, les mots-clés ne sont pas affichés, mais une fonction de recherche est proposée.

Pour celui qui découvre SPIP sans formation, ni manuel, cela n’est pas très intuitif. Pour ceux qui sont familiarisés avec SPIP, le nombre élevé de clics constitue une perte de temps.

Il existe une contribution pour SPIP intitulée « Les crayons » qui permet d’éditer les contenus sur les pages publiques du site, sans passer par l’espace privé. Toutefois elle ne permet pas de créer un article et elle utilise la technologie AJAX, ce qui ne va pas dans le sens de l’accessibilité.

La barre

Au survol de la souris, des boutons supplémentaires apparaissent :

Décortiquons la barre
bouton fonction raccourci aperçu remarque
Intertitre {{{Intertitre}}} - ne fonctionne pas dans un bloc
Intertitre {{{Intertitre}}} - ne fonctionne pas dans un bloc
Intertitre de niveau 2 {{{**Intertitre de niveau 2}}}

Intertitre de niveau 2

Intertitre niveau 3 {{{***Intertitre niveau 3}}}
Intertitre niveau 3
Aligner à droite le paragraphe [/Aligner à droite le paragraphe/]
Aligner à droite le paragraphe
Encadrer le paragraphe [(Encadrer le paragraphe)]
Encadrer le paragraphe
placer dans un cadre une zone de saisie de texte <cadre>placer dans un cadre une zone de saisie de texte</cadre> Spécificité d’Escal, pour le cadre, vous pouvez changé l’image
insérer un bloc replié
<bloc>Un titre
_ Placez votre texte ici
</bloc>

Un titre Placez votre texte



Un titre

Placez votre texte ici

les bloc peuvent numéroté pour imbrication dans d’autre bloc
inseré un bloc déplié
<visible>Un titre
_ Placez votre texte ici
</visible>

Un titre Placez votre texte



Un titre

Placez votre texte ici

les bloc peuvent numéroté pour imbrication dans d’autre bloc
Texte en gras {{Texte en gras}} Texte en gras
Texte en italique Texte en italique Texte en italique
Mettre le texte en petite capital Mettre le texte en petite capital Mettre le texte en petite capital
Barrer le texte <del>Barrer le texte</del> Barrer le texte
Mettre le texte en évidence [*Mettre le texte en évidence*] Mettre le texte en évidence
Mettre le texte en évidence deuxième couleur [**Mettre le texte en évidence deuxiéme couleur*] Mettre le texte en évidence deuxième couleur
mettre le texte en exposant <sup>mettre le texte en exposant</sup> mettre le texte en exposant
mettre le texte en indice <sub>mettre le texte en indice</sub> mettre le texte en indice
mettre en forme un code informatique < code> votre code < /code>
/* ====================
  Enlever le bouton forum de la page sommaire
  ====================*/
img#boutonForum {
   display: none;
}
attention il n’y a pas d’espace derrière le < de code
colorer le texte [orange]colorer le texte[/orange] colorer le texte
colorer le fond [fond vert clair]colorer le fond[/fond vert clair] colorer le fond
mettre en liste -* mettre en liste
  • bla bla bla
mettre en liste numérotée -# mettre en liste numéroté
  1. bla bla bla
désindenter une liste
indenter une liste
transformer en lien hypertexte [->transformer en lien hypertexte] transformer en lien hypertexte devant la flèche -> vous pouvez mettre le texte qui vous va bien
transformer en note de bas de page [[transformer en note de bas de page]] [1] dans le bas de votre page vous verrez :
Notes :

[1] transformer en note de bas de page
En savoir plus : Les Ancres
création de tableau
|||||
|{{ }}|{{ }}|{{ }}|
||||
||||
citer un message <quote>citer un message</quote>

citer un message

mettre en forme comme une poésie
<poesie>
Le geai gélatineux geignait dans le jasmin
_ Voici mes infins le plus beau vers de la langue française.
</poesie>

Le geai gélatineux geignait dans le jasmin

Voici mes infins le plus beau vers de la langue française.
</poesie

entourer de guillemets «entourer de guillemets» « entourer de guillemets »
entourer de guillemets de second niveau “entourer de guillemets de second niveau” “entourer de guillemets de second niveau”
Insérer des caractères spécifiques
Insérer un À
Insérer un É
Insérer un È
Insérer un æ
Insérer un Æ
Insérer un œ
Insérer un Œ
Insérer un Ç
Passer en Majuscules
Passer en Minuscules
Insérer un →
Utiliser un outil d’Escal
apporter une aide <aide>apporter une aide</aide>
apporter une aide
une remarque importante <important>une remarque importante</important>
une remarque importante
une remarque moyennement importante <avertissement>une remarque moyennement importante</avertissement>
une remarque moyennement importante
une information <info>une information</info>
une information
centrer le paragraphe <centrer>centrer le paragraphe</centrer>
centrer le paragraphe
c’est là où écrivez votre article
vous visualisez votre article
sur 2 colonnes modification et visualisation

Directement depuis le site public

En termes d’ergonomie, saisir sur le site public constitue l’approche la plus simple. En effet, la navigation s’effectue uniquement sur le site public. Aussi, il y a un seul environnement à connaître pour le rédacteur (au lieu de deux).

Si l’on s’est authentifié et que l’on dispose des droits nécessaires pour créer un article dans cette rubrique, un bouton « Ecrire un nouvel article » apparaît en haut de l’écran. on active automatiquement le cookie de correspondance pour les auteurs dont le statut est « rédacteur » afin que ces boutons s’affichent.

Remarques :

  • si un auteur a le droit de publier un article et si le statut enregistré de cet article n’est pas « publié », alors un bouton « publier » figurera en bas du formulaire. L’action de ce bouton consistera à enregistrer l’article, le publier et à le voir en ligne (ce qui évite certains clics).
  • Deux boutons ont été ajoutés à la barre d’outil de SPIP pour ajouter un document ou une image dans le texte, à l’endroit où se trouvait le curseur de la souris (de manière similaire à l’insertion d’une image dans un traitement de texte)
  • L’article est enregistré automatiquement quand on déclenche une action (ajout d’un document, clic sur une option avancée, clic sur "Voir en ligne", etc.), pour ne pas perdre le texte saisi.

Bon a savoir : Une modification à été apporté pour supprimer la colonne de droite et augmenter la colonne d’édition

Décortiquons la page.

  • sur la droite la partie rédaction de l’article avec la barre d’enrichissement de texte (voir l’explication dans le bloc " Via le « Back-Office » l’interface privée")

Avec les deux boutons supplémentaire :

bouton « Ajouter un document » bouton « Ajouter une image »
en bas de page

Pour insérer un document ou une image dans le texte ou le descriptif de l’article, à l’endroit où se trouvait le curseur de la souris (de manière similaire à la procédure d’insertion d’une image dans un traitement de texte),

trois possibilités :

  • Ajouter un document depuis son ordinateur.
  • Ajouter un document depuis la médiathèque, c’est-à-dire la liste des documents déjà présents sur le site web.
  • Référencer un document distant.

A savoir : Dans le bloc pour ajouter un document depuis la médiathèque, lorsque l’on clique sur le bouton [Parcourir], on obtient la liste des documents présents sur le site et il suffit de cliquer sur l’un des boutons [Choisir] pour attacher le document à l’article.

Utiliser les options avancées d’un article

Pour accéder à une option avancée d’un article, il suffit de cliquer sur l’un des items de la colonne de gauche dans l’écran de création ou de modification d’article.

Les options avancées, déjà affectées à l’article, figurent dans la partie basse du formulaire ci-dessus, dans le rectangle intitulé « Options avancées affectées à cet article ». A noter que lorsque l’on clique sur une option avancée, l’article est automatiquement sauvegardé afin d’éviter de perdre le texte saisi.

À partir de fichiers OpenOffice Writer

Utilisation du plugin odt2spip, qui permet de convertir un fichier odt (créé avec le traitement de texte de la suite bureautique OpenOffice) en article SPIP
possibilité de convertir automatiquement des documents Word ou HTML

Il s’agit donc de créer un article dans le traitement de texte d’Open Office, en utilisant les styles prédéfinis (Titre 1 pour le titre de l’article, Titre 2 pour les titres de niveau 2, etc), les outils de mise en forme du texte (gras, italique, lien hypertexte, listes, etc.), les éléments insérés (tableaux, images, notes de bas de page, etc.)

Attention : certains éléments ne « passent » pas : textes en couleur, fonds colorés, en-têtes et pieds de page, textes soulignés…)

Une fois ce document mis en forme, il suffit de le transmettre à un des administrateurs du site ; celui-ci pourra alors l’injecter dans SPIP en se positionnant dans la rubrique adéquate.

Plus de précisions :

  • il est nécessaire d’avoir utilisé les styles pour définir les titres dans le fichier OpenOffice si vous voulez que le plugin les détecte. La conversion se fait selon les règles suivante (que les puristes passent leur chemin, il n’y a ici aucun respect des aspects sémantiques habituellement liés à l’utilisation des raccourcis typographiques !) :
    • si il existe au moins un paragraphe avec le style Titre, son contenu est utilisé pour générer le titre de l’article. Sinon c’est le Titre de niveau le plus important qui est utilisé : Titre 1 > Titre 2 > Titre 3... .
    • Le premier niveau de Titre est transformé en intertitre SPIP {{{Titre niveau 1 intertitre}}}(si Titre 1 n’existe pas, Titre 2 est utilisé à sa place, Titre 3 à la place de Titre 2, et ainsi de suite)
    • le deuxième niveau est mis en gras et séparé du restant par des sauts de lignes Titre niveau 2 en gras
    • tous les autres niveaux de titre sont passés en italique et séparés par des sauts de ligne Titres de niveau 3, 4, 5... en italique
  • Le plugin récupère les images intégrées dans le fichier d’origine à condition qu’elles soient au format jpg ou png ou gif (n’espérez rien si vous avez des fichier BMP ou TIFF intégrés !), les retaille pour approximer du mieux possible la taille qu’elles avaient dans le texte, les intègre comme documents SPIP et les place avec un raccourci de la forme ou ou en fonction de la position à laquelle se trouvait l’image dans le texte d’origine.
  • Les notes de bas de page sont gérées sans problèmes ni restrictions.
  • Pour les tableaux, pas de problème tant que vous n’essayez pas de faire des tableaux imbriqués (c’est à dire un tableau dans une cellule de tableau) : les fusions de cellules horizontales et verticales sont gérées en principe correctement.
  • Les listes à puce et numérotées, imbriquées ou non, sont en principe correctement gérées tant qu’elles ne sont pas interrompues par d’autres éléments (donc pas de reprise de numérotation d’une liste à la suivante).
  • Pour les tableaux et les listes le plugin ne gère pas les contenus ayant un style de Titre.
  • Les fioritures de style de texte sont limitées à celles autorisées par les raccourcis typographiques : gras et italique donc pas de texte de couleur ni avec des fonds colorés (beurk !), pas de variations de police ni de taille de texte (ce qui évitera que les rédacteurs pourrissent la charte graphique du site !)
  • Les en-têtes, pieds de page, index ou table des matières sont purement et simplement supprimés.
  • Les dessins (flêches, bulles et autres formes crées avec l’outil de dessin d’OOo Writer) ne sont pas (encore ?) supportés

- Bien évidemment il est tout à fait possible que certains éléments ne soient pas satisfaisants après la conversion ; il est alors possible de reprendre l’article dans SPIP pour lui appliquer les quelques modifications et corrections nécessaires.

Ajouté, protégé, illustré un article avec une image

Ajouter une image, mais quel est le bon format d’image à utiliser ?

Le format d’image peut être différent selon le type d’utilisation de cette image.

Il existe deux types d’images :

  • Les images fixes, par exemple les photos.
  • Les images animées, comme les vidéos.

L’image est constituée d’un ensemble de points, appelés des « pixels ».
La résolution de l’image est exprimée en DPI (Dots Per Inch), une unité de mesure anglaise, appelé PPP en français (points par pouce) et également « pixels par pouce ».

Par exemple :
700 DPI = 700 colonnes et 700 lignes de pixels par pouce carré.

La résolution est le rapport entre le nombre de pixels de l’image et la taille réelle de sa représentation sur un support physique, tels qu’une imprimante ou un scanner.

Quel format d’image et quelle résolution pour le web ?

Pour avoir un beau visuel non pixelisé, il est important de respecter le format d’image demandé.

Aussi, la résolution standard sur le web est de 72 dpi soit 72 pixels x 72 pixels pour un carré de 2,54 cm de côté. La colorimétrie standard est le RVB (Rouge, Bleu, Vert)

  • Le format d’image .jpg ou .jpeg (Joint photographic experts group) est l’un des premiers formats compressés pour le web, c’est de très loin le format d’image le plus répandu. Il est également conseillé pour la photographie, à la fois pour la bonne qualité de la photographie après compression et l’amplitude des résolutions possibles. Il gère des millions de couleurs.
  • Le gif (Graphics Interchange Format) est inventé en 1987 par Compuserve pour l’Apple II. Ce format d’image utilise un système de compression non destructif. Il est codé en 8 bits, il gère la transparence et il est limité à 256 couleurs. C’est un format de moins en moins utilisé (sauf pour les gifs animés, ex : les smileys).
  • Le png (Portable Network Graphic) est un format datant de 1996, c’est une version améliorée du gif, elle gère plus de 16.7 millions de couleurs. Sa qualité est supérieure au .gif et la transparence est gérée. Le poids d’une image au format png est supérieur au .jpg.

Que choisir ?

Pour le web, le format GIF est à éviter, vous pouvez encore l’utiliser pour les des pictogrammes ou la favicon.

Le format PNG permet d’afficher une belle image de bonne qualité et de grandes tailles. C’est idéal pour des grandes photos, des fonds d’écrans.

Le .gif et le .png permettent de gérer la transparence. Le format JPEG, c’est pour “tout le reste”.

Si vous souhaitez optimiser le référencement naturel d’un site internet, la diminution du poids des images permet très souvent de baisser le temps de chargement d’une page web.

Si vous souhaitez réaliser un site internet avec des images de qualité sur des écrans HD, vous devrez en plus respecter les contraintes du retina.
Le format d’image adapté au responsive.

Depuis que les sites internet sont responsive (ils s’adaptent à toute taille d’écran : Écran, ordinateur, tablette, smartphone), il est possible de remplacer les images par un format d’image léger, le SVG (Scalable Vector Graphics).

Le format d’image SVG est un format de dessin vectoriel idéal pour représenter des formes simples. Ces formes sont étirables à volonté sans perte de qualité et sans effet de pixellisation.

Le SVG présente de nombreuses qualités, il est issu d’un code ouvert et libre, il peut -être :

  • Édité avec un éditeur de texte de type Notepad++ car c’est du XML,
  • Stylé grâce au CSS,
  • Manipulé via JavaScript.

un tableau récapitulatif :

Format JPG GIF PNG 24 PNG 8 SVG
Avantages Léger

Possibilité de choisir le niveau de compression

16 millions de couleurs

Gestion des animations

Pas de pixellisation

Gestion de la transparence

Pas de pixellisation

16 millions de couleurs

Gestion de la transparence, même partielle

Léger

Pas de pixellisation

Gestion de la transparence

Possibilité de choisir le nombre de couleurs indexées

Léger
Pas de pixellisation

Vectoriel : agrandissement de l’image sans perte de qualité, sans pixellisation

Gestion de la transparence

Inconvénients Pas de gestion de la transparence

Mauvais rendu sur les aplats et textes

Pixellisation

Limité à 256 couleurs maximum

Pas de transparence partielle (seulement des zones entièrement transparentes)

Lourd
Limité à 256 couleurs maximum

Pas de transparence partielle (seulement des zones entièrement transparentes)

Non supporté par Internet Explorer 8 et ses versions antérieures

Uniquement pour les images vectorielles

Implémentation variable de la balise selon les navigateurs

Utilisation Photos sans transparence Images animées
Visuels nécessitant une transparence partielle (dégradé sur fond transparent, opacité partielle…)
Visuels nécessitants beaucoup de couleurs et des aplats
Visuels avec aplats et sans transparence partielle : logos, schémas, icônes… Icônes, logos et pictogrammes

À Savoir :

  • Voici ce qui est défini dans le fichier escal_options.php :

// les images de plus de 2000 pixels de largeur ou de hauteur ne seront pas enregistrées

define('_IMG_MAX_WIDTH', 2000);
define('_IMG_MAX_HEIGHT', 2000);

// Et pour éviter de faire planter GD2 :

define('_IMG_GD_MAX_PIXELS', 2000000);
  • Modification des valeurs pour votre site

Ces valeurs peuvent être modifiées en créant un fichier mes_options.php dans le dossier /config dans lequel on écrira

<?php
// les images de plus de 2000 pixels de largeur ou de hauteur ne seront pas enregistrées
define('_IMG_MAX_WIDTH', 2000);
define('_IMG_MAX_HEIGHT', 2000);
// Et pour éviter de faire planter GD2 :
define('_IMG_GD_MAX_PIXELS', 2000000);

il ne restera plus qu’à modifier les valeurs selon son souhait

Pour le poids en octets, cela dépend de l’hébergeur mais on peut écrire dans ce même fichier

// les images de plus de 350 Ko ne seront pas enregistrées
define('_IMG_MAX_SIZE', 350);

Comment protéger mes images ?

Sachant qu’il est impossible de protéger une photo à 100%, car pour que ça soit efficace il faut que le code source soit invisible ; mais s’il est invisible pour les internautes il est *aussi* invisible pour les machines et les navigateurs donc c’est pas possible.

Que dit la loi ?

Il est pourtant facile de trancher : utiliser la photographie (au sens de production photographique) d’une tierce personne sans son autorisation est illégal.

Légalement, vous pouvez choisir la licence selon laquelle vous placez vos œuvres sur internet ; la licence par défaut étant le copyright : dans ce cas, toute reproduction de vos œuvres est illégale

Cependant :

Quand on place une image sur un serveur internet sans user de précautions particulières telles qu’accès privé ou protection contre la copie, le monde entier peut y accéder. Pour en faire quel usage ?

Pour en faire une exploitation commerciale : impression, vente en banque d’image, ou non commerciale comme en reprendre un extrait pour en faire un avatar ou illustrer un sujet sur un forum... dans un message avec lequel vous n’êtes pas nécessairement d’accord. Les exemples pullulent.

La seule manière de protéger complètement une photo c’est de ne pas la publier ni sur internet ni même, en allant plus loin, dans le cadre d’une exposition (une photographie de l’œuvre est toujours possible à votre insu). Il n’est donc pas possible de protéger complètement une photographie contre l’utilisation que pourrait en faire une autre personne.

Il est par contre possible de compliquer la tâche de l’indélicat.

Donc voici quelques méthodes qui peuvent gêner le visiteur "Lambda", mais pas l’informaticien averti.

la mise en place d’un javascript qui empêche le clic-droit. En outre, cette mesure est assez irritante pour le visiteur qui souhaite, par exemple, utiliser le clic droit pour ouvrir un lien dans une nouvelle fenêtre.

C’est inutile, pour plusieurs raisons :

- ces codes ne fonctionnent pas forcément avec tous les navigateurs et il y en a de plus en plus ...
- si JavaScript est désactivé du côté client, votre code n’aura aucune incidence
- Il y aura peut-être quelques internautes qui seront ’coincés’, parmi les débutants,
mais soit ils ne reviendront plus, soit ils trouveront la ou les parades ...
- afficher le code source de la page où l’on se trouve, on copie tout ce que l’on veut.
- enregistrer la page et hop, on obtient tout en local !
soit avec la fonction ’enregistrer sous’ soit avec les touches : CTRL et S du clavier

L’utilisation d’un JavaScript pour les images ce qui empêche l’enregistrement via le clic-droit

- Choisir l’image à protéger.
- Préparer une image transparente
Créer une image transparente de taille 100*100px, un .GIF est conseillé, car pris en charge par tous les navigateurs (Même IE ...).
- Superposer vos images avec du CSS
Insérer le code suivant pour afficher votre image. La taille de votre GIF doit être adaptée à celle de votre photo avec les propriétés height et width.

C’est inutile, pour plusieurs raisons :

Effectivement, on peut récupérer l’image avec un peu de ruse ; la preuve :

- Utilisez firefox avec le plugin Firebug
- Inspectez avec le plugin Firebug l’image protégée
Vous devriez obtenir l’architecture HTML qui a été utilisée.
Vous pourrez alors voir quelle image a été mise en background (Même si elle est renseignée dans une feuille de style et pas directement dans le code source).
- Copiez cette adresse dans votre navigateur et voila !

Protéger ses images avec la CSS

L’avantage par rapport à JavaScript est quand même que la CSS ne demande pas d’activation dans les navigateurs, mais bien sûr, si cela va détourner, une fois de plus pas mal de "copieurs" potentiels, elle aussi peut toujours réussir à être contournée ...

Nous allons donc essayer de faire en sorte que l’internaute qui va vouloir copier cette image, se retrouve avec une image ... vide et inutilisable. Sur cette page la protection contre le clic droit n’est donc pas activée par JavaScript, vous pouvez le vérifier, et si vous prenez l’image ci-dessous, ’ à consommer avec modération...’, faites un clic-droit dessus et enregistrez l’image, vous aurez vite compris la fonction de cette ’class’ en CSS. Vous pouvez d’ailleurs en trouver les composants en faisant une petite recherche dans le code-source de la page.

Cette propriété CSS est cependant bien plus simple que l’on peut le penser :

Donc :

  • En copiant l’image au clic-droit vous récupérez une image vide !
  • En faisant un glisser/déposer sur le bureau , vous récupérer une image vide !
  • En faisant (dans FireFox) "afficher l’image" , vous voyez une image vide !
  • Certains plugins vous proposent de copier l’image vide !
  • Désactiver le javascript dans ce cas ne sert à rien ! Toujours cette image vide ! ...
  • Désactiver la css va la faire disparaître totalement !

En bref 3 lignes de css pour protéger une image :

  • sa hauteur.
  • sa largeur.
  • et son adresse mise en background.

Une autre solution bien sympa, dans la CSS, pour interdire l’impression de la page :

Essayez et vous verrez bien ...

Bien sur dans ce cas particulier, une copie d’écran est facilement réalisable pour récupérer l’image, mais si vous avez à faire à un fond d’écran, de très grandes dimensions, plus grandes que votre taille d’écran, là le problème se posera un peu plus sérieusement !

Il existe également d’autres moyens de protection via la CSS par exemple, surtout pour les images, via l’intégration de codes plus lourds ou de fonctions en Php, via également l’insertion de copyright sur les créations.

Il n’y a donc plus la possibilité de faire un clic-droit pour ’enregistrer l’image sous’, même si, comme moi sous FireFox, vous disposez de plugins pour le faire cela ne changera rien, et si vous regardez ou copiez le lien vers cette image, cela vous ne vous donnera rien non plus...

Bon, une fois encore, ce n’est pas la fonction ultime, loin de là, mais on peut quand même dire qu’avec JavaScript ou CSS, l’internaute ’lambda’ sera débouté, le copieur-expert, lui, parviendra toujours à ses fins ... mais dans quel but ?

Pourquoi copier des images qui n’ont de valeur que dans leur contexte la grande majorité du temps ?

Après ces petites démonstrations avec la CSS, qui en décourageront quand même plus d’un, soyons honnêtes mais qui restent toujours ’contournables’, pour protéger des images dans une page web, on peut encore envisager d’autres solutions "ultimes" celles-ci ...

4° Le "watermark"

Wikipédia nous le définit ainsi : "Le tatouage numérique ou watermarking est une technique permettant d’ajouter des informations de copyright ou d’autres messages de vérification à un fichier ou signal audio, vidéo, une image ou un autre document numérique. Le message caché dans le signal hôte, généralement appelé marque ou bien simplement message, est un ensemble de bits, dont le contenu dépend de l’application. La marque peut être le nom ou un identifiant du créateur, du propriétaire, de l’acheteur ou encore une forme de signature décrivant le signal hôte. Le nom de cette technique provient du marquage des documents papier et des billets. "

Quand au copyright, il nous dit ceci : " Le copyright, souvent indiqué par le symbole officiel ©, est, dans les pays de common law, l’ensemble des prérogatives exclusives dont dispose une personne physique ou morale sur une œuvre de l’esprit originale. Il désigne donc un ensemble de lois en application, notamment, dans les pays du Commonwealth des Nations et aux États-Unis ; et qui diffère du droit d’auteur appliqué dans les pays de droit civil (tels que la France ou la Belgique).
Bien que les deux corpus de lois tendent à se rejoindre sur la forme grâce à l’harmonisation internationale opérée par la convention de Berne, ils diffèrent notablement sur le fond. Le copyright relève plus d’une logique économique et accorde un droit moral restreint, là où le droit d’auteur assure un droit moral fort en s’appuyant sur le lien entre l’auteur et son œuvre. "

De nombreux logiciels, de retouche d’image, vous permettent d’insérer ce genre de ’marquage’ sur vos images, encore faut-il le placer de manière à ne pas la défigurer complétement ! Vous pouvez y ajouter les mentions que vous désirez, votre nom, l’adresse de votre site web ou autre ...

Certains scripts ou sites en ligne peuvent également les insérer automatiquement à votre place. Mais il reste encore la possibilité de se faire prendre son ’image’ par un individu qui va la retoucher et faire disparaître ce watermark !

Dans ce cas, me direz-vous, quelle est alors la meilleure des solutions ? La réponse est simple : ne rien mettre en ligne !

et si vous êtes sous Linux, allez lire l’explication de momo
ImageMagick : Watermarking : en ligne de commande

La qualité de la photo

Enregistrez l’image dans un format de fichier JPEG en qualité moyenne, à la résolution à 72 DPI et au format maximum de 700 * 460 pixels.

La première utilisation qui pourrait être faite de l’image est la vente ou l’impression. Dans ce cas, on a besoin la plupart du temps du fichier en taille originale. La première mesure à prendre est donc de ne jamais diffuser vos images en taille réelle.

6° Le Digimark

est un procédé de marquage invisible qui n’empêche rien mais permet de prouver que l’image vous appartient ; la technique n’est pas infaillible puisque dans la plupart des cas, un léger flou appliqué à l’image peut en venir à bout.

7° La stéganographie

c’est à dire l’ajout de texte dans le fichier lui-même, n’empêche rien du tout mais permet d’identifier le fichier de façon formelle.

Et après... que faire ?

En cas de vol, un escroc pourra toujours prétendre que la photo est issue de son travail et non du vôtre, et que le copieur, c’est vous ! Il lui sera plus difficile de vous causer ce tort si vous possédez le fichier RAW.

Si votre appareil photo ne propose pas le format RAW, il vous faut être en mesure de prouver l’antériorité. Pour cela, il est possible d’utiliser une mesure telle que le stockage sur internet en galerie privée sur un site sur lequel les dates de stockage peuvent apparaître.

En cas de hotlinking, votre image est souvent utilisée par une personne privée qui souhaite illustrer ses propos. Le plus souvent, et bien que nul ne soit censé ignorer la loi, cette personne est de bonne foi. Généralement, un petit mot demandant le retrait ou une compensation, le plus souvent sous forme de lien, est suffisant.

Il est par ailleurs toujours possible (mais pas nécessairement facile ni gratuit) d’intenter une action en justice, ce qui nécessitera de prouver le dommage que ces pratiques vous causent.


Si vous utilisez le squelette Escal pour partager vos photos, vous pouvez indiquer le type de licence souhaité pour chaque photo, notamment de choisir une forme de licence Creative Commons.

Voilà, comme vous l’avez compris on ne peut pas protéger à 100%, mais on peut toutefois limiter la copie et faire en sorte de prouver que le document nous appartient.

Je vous laisse le soin de choisir votre méthode ...

Illustré votre article

Ajouter une image dans votre article

  • Comprendre les raccourcis images de SPIP, qui proposent une syntaxe complète pour intégrer les images dans les articles.
    • Pour les gens pressés ...
Raccourci Signification Illustration Portfolio
<img> image Image Vignette + Lien
<doc> document Image + Titre Vignette + Titre + Lien
<emb> embed (« embarqué ») Image + Titre Image + Titre
<image_exif>
ajoute la visibilité des données EXIF/IPTC/GPS

Vous pouvez déposer les images sous deux formes :

  • En tant qu’illustration : sert à illustrer le texte de votre article.
  • En tant que documents joints ou portfolio : sert à placer des images plus lourdes, pour créer un diaporama, une planche contact...

    Note : Cette option n’est valable que si le webmaster a activé l’option Configuration > Contenu du site > Documents joints > Activer le téléversement pour les contenus : Articles

Cas particulier de _exif :
permetre d’afficher différents types de métadonnées stockées dans les fichiers graphiques :

  • les données IPTC (commentaires insérés « manuellement » par le photographe),
  • les données EXIF (données techniques insérées automatiquement lors de la prise de vue),
  • les données GPS (situation géographique tirée d’un positionnement GPS).

<img_exif411>

Les métadonnées au survol

Par défaut, les données apparaissent condensées dans un pavé vert de gris (oui : vert de gris... l’idée est d’imiter approximativement les afficheurs de certains appareils reflex). Ce pavé réduit affiche les données suivantes :
— des pictogrammes indiquent quelles métadonnées ont été récupérées : EXIF, GPS et/ou IPTC ;
— le nom et la marque de l’appareil de prise de vue ;
— pour de nombreux appareils photo, une petite vignette représentant ce modèle.

Lorsque l’on survole le pavé vert, il affiche immédiatement quelques données techniques (lorsque ces données sont présentes dans l’image, évidemment) :
— la sensibilité (ISO),
— la vitesse de la prise de vue (secondes),
— l’ouverture,
— la focale de l’objectif.

Les pavés « dépliés »

Lorsque l’on clique dans le pavé (ou sur le petit bouton « plus »), celui-ci s’agrandit et affiche toutes les métadonnées :
— les données EXIF : sensibilité, vitesse, ouverture, focale, utilisation du flash, ouverture maximale, objectif utilisé...
— les données IPTC : légende, copyright...
— les données GPS : latitude, longitude, et petite croix de l’emplacement sur une mappemonde.

La vignette de l’appareil est alors plus grosse. On peut encore cliquer sur la vignette de l’appareil et afficher l’image du modèle utilisé dans sa plus grande taille. (Note : les fichiers graphiques fournis par le plugin ont une dimension maximale de 256 pixels ; on peut donc encore utiliser une image plus grande, par exemple pour l’affichage sur le site public.)

Pour l’affichage des métadonnées sur votre site public (dans des squelettes

Il est donc possible d’ajouter des images (ou documents) de plusieurs façons :

  • depuis mon ordinateur : permet d’uploader (télécharger) un fichier stocké depuis son disque dur,
  • depuis la médiathèque : permet de sélectionner un document déjà ajouté sur le site grâce à une page centralisant touts les documents « multimédias »,
  • depuis le serveur : permet de charger des documents ayant été déposés par FTP dans le répertoire /tmp/upload du serveur,
  • depuis internet : permet d’ajouter une ressource distante comme par exemple une image flickr, un zip de github, une vidéo youtube...
  • Ajouter une image en tant qu’illustration
    • Allez sur votre article
    • Le formulaire d’ajout d’image (en mode édition d’article)
    • Choisir une image "parcourir" et "téléverser"
    • L’image se charge ensuite sur le côté de votre article

Attention
Pour visualiser votre image téléchargée en vignette, il vous faudra dans configuration/fonction avancées, activé la Génération de miniatures des images
de plus vous avez également la possibilité de choisir la taille maximale des vignettes générées par le système

Dans le cas contraire, ça serais ballot

  • Quels sont boutons (options) proposés pour gérer notre image téléchargée ?
    • Déposer dans le portofolio (retirer du portofolio)
      Rappel : Cette option n’est valable que si le webmaster a activé l’option Documents joints. .
    • supprimer l’image
    • Détacher l’image
    • modifié l’image
      Astuce : Si vous ajoutez vos images en les regroupant dans un zip, au moment de l’extraction du zip, SPIP vous propose diverses options pour déposer toutes les images dans le portfolio, les titrer automatiquement...
  • Distinguer Image illustration et Portfolio
    • En mode édition d’article
      Lorsque vous éditez votre article, l’ensemble des médias est listé sur le côté.
      Les icônes permettent de distinguer les médias :
icône type d’image code d’insertion proposé
Carte postale Illustration <img>
Pièce jointe (trombone) Portfolio <doc>,<emb>
    • En mode consultation d’article
      Les illustrations et portfolio sont listés dans leur section respective
    • Comment passer une image d’un statut illustration à un statut portfolio ou inversement ?
      Sur chaque panel de prévisualisation de l’image, vous disposez d’un lien "Déposer dans le portfolio" ou "Retirer du portfolio"

C’est pas tout, ça mais comment insérer une image à l’intérieur du texte ?
il vous reste à indiquer à quel endroit de votre texte vous voulez les insérer.

  • Images sans commentaire
    Pour chaque image, voyez la mention des 3 raccourcis :
    • <imgxx|left>
    • <imgxx|center>
    • <imgxx|right>
      xx étant le numéro de votre image, il change donc pour chaque fichier

Recopiez-le à l’intérieur de la case « Texte », là où vous désirez le situer dans votre article.
« left » aligne l’image à gauche, « right » à droite, et « center » place votre image au centre du texte.

  • Images avec titre et description
    Si vous avez indiqué un titre et/ou une description, les mentions sont remplacées par :
    • <docxx|left>
    • <docxx|center>
    • <docxx|right>
      xx étant le numéro de votre image, il change donc pour chaque fichier

Recopiez-le à l’intérieur de la case « Texte », là où vous désirez le situer dans votre article.
« left » aligne l’image à gauche, « right » à droite, et « center » place votre image au centre du texte. ; cependant, lorsque vous insérez un « raccourci » de ce type, SPIP insère dans votre texte non seulement l’image, mais le titre et la description que vous lui avez donnés. Votre image apparaît ainsi avec, éventuellement, une explication et des mentions de copyright, le nom de l’artiste, etc.

Ce qui donne ....

Je finirai sur les images en vous disant de remplir les informations sur chaque image que vous mettez à disposition sur votre site.

Pourquoi faut-il ajouter ces informations ?

  • Permet une meilleure gestion de la médiathèque.
    On peut chercher et trouver plus facilement des images et vérifier si celle que l’on veut ajouter n’existe pas déjà.
  • Les informations qu’on a rajoutées sur l’image facilitent la recherche interne dans la médiathèque du site.
    La médiathèque gérant tous les médias, elle s’occupe aussi des autres types de documents, pdf, epub, zip, etc. Prendre l’habitude de les nommer et décrire eux aussi permet également un meilleur suivi de votre bibliothèque de fichiers et de les insérer proprement avec des titres et une description qui peut être un résumé en une ou deux lignes.
  • C’est bon pour le référencement, car on peut diversifier le vocabulaire, donc enrichir les fameux « mots-clés » de référencement.
  • Un site accessible : enfin en renseignant correctement ces informations, vous permettez à des personnes qui ont une connexion de mauvaise qualité de télécharger les images (et autres documents) à bon escient et aux aveugles et mal-voyants de savoir ce qui illustre l’article.

Je sais c’est du travail…

  • Les informations liées à votre image


Une fois votre image envoyée au serveur, une case apparaît sur la gauche de l’écran. Il y a là toutes les informations nécessaires qui la concernent.

    • le nom de l’image
    • le titre de l’image si renseigné
    • Affichage sous forme de vignette. Une prévisualisation de votre image apparaît. Si l’image est de grande taille (plus de 200 pixels de large), c’est une version de taille réduite qui est affichée.
    • Les icônes de rotation de l’image
    • Raccourcis SPIP. Voir ci-après : SPIP vous rappelle les 3 « raccourcis » qui vous permettent d’insérer cette image à l’intérieur de votre texte. Notez que chaque image est « numérotée » ainsi : « IMG1 », « IMG2 »... Ces « raccourcis » sont utilisés dans la troisième étape.
  • Déposer l’image dans le portofolio
  • Supprimer cette image. Comme son nom l’indique, le bouton « Supprimer cette image » permet d’effacer ce fichier, si vous avez fait une erreur de manipulation, ou si vous décidez finalement de ne pas utiliser l’image dans ce texte. Il est conseillé d’effacer les images inutilisées, afin d’éviter d’encombrer votre serveur avec des fichiers inutiles.
  • Détacher l’image
  • Modifier vous ouvrira

  • Taille de l’image. Juste au-dessus de l’image, la largeur et la hauteur de votre image (en pixels - ou « points ») sont rappelées.
  • Titre et description de l’image. Vous pouvez, si vous le désirez, indiquer un nom et une description pour chaque image. Par exemple une explication, ou une mention du copyright du photographe...
  • rajouter une vignette ou laisser faire spip

Vous pouvez, ou devrais-je dire, devez recommencer l’opération avec autant d’images que vous le désirez (un article peu contenir autant d’images que nécessaire).

Conclusion

Raccourci Signification Illustration Portfolio
<img> image Image Vignette + Lien
<doc> document Image + Titre Vignette + Titre + Lien
<emb> embed (« embarqué ») Image + Titre Image + Titre

Configurer votre Escal

Lors de l’installation, Escal préinstalle :

  • une rubrique cachée avec deux articles, constatez la présence des mots-clés sous le titre de l’article
  • les Groupes de mots-clé, affichage et Agenda_couleur

Donc sur le public, vous visionner ceci
Public sous habillage "Escal"

vous avez créé vos rubriques, pleines d’articles passionnants mais vous trouvez votre site un peu trop stéréotypé.

Alors vous avez envie de personnaliser un peu ce site.

Ok ! Commençons par la base.

Important :
On ne touche pas aux fichiers du plugin mais dans votre dossier /squelettes qu’on met a disposition (accessible via "FTP").

On copie le fichier que l’on veut modifier du dossier /escal en respectant l’arborescence. Et on modifie le fichier copié.

  • Le dossier /squelettes
    • Mais à quoi sert-il ?
      Ce dossier /squelettes va contenir toutes vos personnalisations, qu’elles concernent certaines images, une personnalisation CSS ou un fichier HTML.
    • L’intérêt d’un tel dossier est double :
      • vos personnalisations ne sont pas écrasées par une mise à jour de la plateforme
      • une erreur qui fait planter le site est vite corrigée en renommant le fichier concerné ou, au pire, en renommant le dossier /squelettes lui-même
personaliser Escal

la page de configuration dans l’espace privé permet de faire pas mal de chose

Mise en page - Concerne tous le site

soit la configuration des mots-clés, des couleurs, selon la langue, selon le secteur, les css, les cadres, les logos, Les langues Internationalisation

Les mots-clés

Pour profiter pleinement du jeu de squelettes ESCAL, il faut utiliser quelques mots-clés, au moment où vous activez ou mettez à jour, les groupes affichage et Agenda_couleur sont créés ainsi que les mots-clés à l’intérieur de ces groupes s’ils n’existent pas.


Si vous désactivez Escal, ces groupes perdureront mais si vous désinstallez Escal, ces groupes seront supprimés, ainsi que tout votre paramétrage d’Escal.

Le groupe affichage
mot-clérôle
acces-direct choisir l’article qui sera affiché dans le bloc "Accès direct" (noisette inc-acces_direct.html)
accueil choisir l’article affiché en onglet d’accueil seulement)(noisette inc-accueil.html)
actus choisir les articles qui seront affichés dans le bloc "Actus" (noisette inc-actus.html)
agenda choisir les articles ou la ou les rubriques dont les articles seront affichés dans l’agenda
annonce choisir l’article dont le texte sera affiché dans le bloc "Annonce" de la page d’accueil (noisette inc-annonce.html)
annonce-defilant choisir les articles dont le texte sera affiché dans le bloc "Annonces défilante" de la page d’accueil (noisette inc-annonce_defilant.html)
annuaire choisir l’article qui sera utilisé par la page annuaire.html
archive choisir la rubrique dont un article pris au hasard sera affiché dans l’onglet "Article archive" de la page d’accueil
articles-de-rubrique choisir la rubrique dont les articles seront affichés dans la noisette "Articles de rubrique" (inc-articles_de_rubrique.html)
article-libreN (N = 1 à 5) choisir l’article à afficher en bloc latéral
article-sans-date ne pas afficher les dates de publication et de modification pour un article précis
chrono pour afficher les articles d’une rubrique dans les menus en ordre anté-chronologique, comportement non transmis aux rubriques-filles seulement)
citations choisir l’article qui servira de réservoir pour les citations dans le pied de page
edito choisir l’article qui sera affiché dans le bloc "Edito" (noisette inc-edito.html)
favori choisir les sites dont les vignettes seront affichées dans le bloc "Sites favoris" (noisette inc-sites_favoris.html) seulement)
forum choisir le secteur qui sera utilisé pour le forum du site
invisible ce mot-clé équivaut aux 4 mots-clés suivants à la fois : pas-a-la-une + pas-au-menu + pas-au-menu-vertical + pas-au-plan
mon-article, mon-article2, mon-article3 choisir un à 3 articles qui seront affichés chacun dans un onglet du bloc central de la page d’accueil
pas-a-decouvrir choisir les rubriques et les articles à exclure de l’affichage dans la noisette "A découvrir" si on choisit "dans tout le site" (inc-decouvrir-articles-sites.html)
pas-a-la-une ne pas afficher une rubrique (et ses articles) ou des articles dans le bloc "les derniers articles ..." de la page d’accueil
pas-au-menu ne pas afficher une rubrique ou un article dans le menu horizontal. Ce mot-clé empêche aussi l’affichage de la rubrique dans la liste des sous-rubriques de la page rubrique
pas-au-menu-vertical ne pas afficher une rubrique ou un article dans les 2 menus verticaux
pas-au-plan ne pas afficher une rubrique (et ses articles) ou des articles dans le bloc "Plan du site" de la page d’accueil
photo-une choisir les articles dont les images seront affichées dans le bloc "Quelques images au hasard" (noisette inc-photos.html)
pleinepage choisir les articles ou les rubriques qui seront affichés en pleine page sans blocs latéraux
RubriqueOngletN (N = 1 à 5) choisir une ou des rubriques qui seront affichées dans les onglets en page d’accueil
site-exclu exclure des sites dans le bloc "Sur le web" (noisette inc-sites.html)
special choisir la rubrique et/ou les articles qui seront affichés dans le bloc à personnaliser (noisette inc-perso.html)
texte2colonnes pour afficher le texte d’un article en 2 colonnes
video-une choisir les articles dont les vidéos seront affichées dans le bloc "Vidéo" (noisette inc-video_accueil.html)
Le groupe type_rubrique
mot-clérôle
trombino appeler inc-rubrique_trombino à la place de inc-rubrique_normal dans la partie principale de la page rubrique afin d’afficher la rubrique avec ce mot-clé, donc le trombinoscope
votre-mot appeler inc-rubrique_votre_mot (à créer) à la place de inc-rubrique_normal dans la partie principale de la page rubrique
Le groupe type_article
mot-clérôle
votre-mot appeler inc-article_votre-mot (à créer) à la place de inc-article dans la partie principale de la page article pour tous les articles de la rubrique avec le mot-clé "votre-mot"
Le groupe Agenda_couleur
mot-clérôle
votre_mot pour choisir la couleur de fond des évènements dans l’agenda
Marron Quelques couleurs proposées par défaut pour colorer le fond de chaque événement
Noir
Rouge
Vert
Violet
  • Créer les mots-clés avec le titre que vous voulez
  • Pour chaque mot-clé, écrire dans le descriptif du mot-clé la couleur que vous voulez
    Vous pouvez mettre une couleur nommée comme red ou green, une couleur en code hexa comme #000 ou #9900CC et même une couleur en rvb comme rgb(255,0,0)
  • Renseignez le "texte explicatif" pour chaque mot-clé, celui-ci s’affichera en légende dans l’agenda avec la couleur correspondante
  • Attribuer le mot-clé que vous voulez à chaque événement (un événement sans mot-clé sera par défaut bleu foncé), préférez des couleurs foncées car le texte sera écrit en blanc. |
Le groupe trombino
mot-clérôle
votre-mot pour classer vos trombines si vous utilisez la noisette inc-rubrique_trombino

les couleurs

Une page de configuration dans l’espace privé permet de choisir les couleurs pour l’ensemble du site
fonds du site
fonds et texte des blocs
textes spécifiques
bordures

Mais on peut avoir envie de jouer un peu plus.

Selon la langue

Si on utilise le multilinguisme, on peut définir un fond en fonction du contexte de langue dans le site, en créant un fichier css pour chaque langue.

Ces fichiers doivent s’appeler XX.css où XX correspond au code de langue (fr, en, de, es, it, ....) et doivent se trouver dans le dossier /squelettes/styles
mettre dans ces fichiers le code suivant où couleur sera la couleur choisie pour chaque secteur.

Cette couleur pourra être
une couleur en code hexadécimal -> exemple : #0000FF
une couleur nommée -> exemple : grey
une couleur en code rgb -> exemple : rgb(24,125,255)

On peut évidemment définir d’autres règles CSS dans ces fichiers lang.css

Selon le secteur

On peut aussi définir le fond des pages en fonction du secteur dans lequel on se trouve. Il suffit de créer un fichier css pour chaque secteur.

Ces fichiers doivent s’appeler secteurXX.css (où XX correspond au numéro du secteur) et doivent se trouver dans le dossier /squelettes/styles
mettre dans ces fichiers le code suivant où couleur sera la couleur choisie pour chaque secteur

Cette couleur pourra être
une couleur en code hexadécimal -> exemple : #0000FF
une couleur nommée -> exemple : grey
une couleur en code rgb -> exemple : rgb(24,125,255)

On peut évidemment définir d’autres règles CSS dans ces fichiers secteurXX.css

les css

Très simplement, il suffit de créer un dossier /styles dans le dossier /squelettes avec dedans un fichier perso.css qui contiendra vos modifications.

les cadres

Tous les cadres latéraux que ce soit dans la page sommaire, rubrique, article ou autre, ont une class spécifique. On peut donc personnaliser les couleurs de chacun d’entre eux.
Tous ces cadres sont appelés de la même manière, "fichier" correspondant au nom de la noisette appelée.

  • Modifier leur position
    il suffit d’aller sur la page de configuration d’Escal et de choisir les noisettes qu’on garde et de les afficher où on veut et dans l’ordre souhaité.
  • changer la couleur
    une page de configuration dans l’espace privé permet de changer la couleur des noisettes (une seule couleur pour toutes les noisettes) .

Néanmoins, on peut changer l’aspect de chaque bloc individuellement en définissant ses propriétés CSS dans le fichier perso.css qui doit être placé dans le dossier /squelettes/styles.

A noter que les sélecteurs css correspondent au nom de la noisette concernée mais attention, en cas de nom composé, c’est bien le tiret du 6 qu’il faut employer, pas l’underscore (tiret du 8), comme pour cet exemple avec acces-direct.

Exemple : modifier l’aspect du bloc "Accès direct (inc-acces_direct)


- affichera un bloc rouge avec un texte blanc, même pour les liens.

Un autre exemple pour être plus clair avec le bloc "Dans la même rubrique" de la page article (inc-meme_rub)

on peut choisir la même couleur que le fond qui se trouve en-dessous ou rajouter dans perso.css le code suivant :

pour enlever le fond et les bords du texte de la noisette "Évènements" ou

pour enlever le fond et les bords de toutes les noisettes.

les logos

Vous avez vu les petits logos dans le coins des cadres et les logos des rubriques.

  • Les logos de rubriques ou d’articles
    Pour associer un logo à une rubrique ou a un article, c’est du SPIP pur. On joint le logo à la rubrique dans l’espace privé et il sera affiché.
  • Les logos des cadres
    Pour changer ou rajouter un logo de cadre, il faut aller dans le code et repérer ou rajouter à l’intérieur de la noisette correspondante une ligne de ce genre juste avant la balise fermante

en remplaçant (toujours après copie dans /squelettes/inclusions) acces-direct.png par le nom de votre fichier-logo que vous aurez placé dans le dossier /squelettes/images, en adaptant les valeurs pour la largeur et la hauteur et en remplaçant le texte de la balise alt par celui que vous voulez.

Si vous voulez que ce logo soit à droite, rajouter la class "a-droite" à la balise h1 comme sur cet exemple

Les langues Internationalisation

Tous les textes affichés sont paramétrés par une chaîne de langue.
Exemple :
on trouve ce texte :

"Vous aussi, vous utilisez ESCAL ?
Alors ajoutez votre site dans cette page."

Et ce n’est évidemment pas adapté à votre besoin. Vous préféreriez un simple

"Et si vous inscriviez votre site sur notre annuaire ?"

Pour cela, il vous faut créer un dossier /squelettes/lang dans lequel on va créer un fichier local_fr.php qui contiendra ce code :

On peut bien sur modifier n’importe quelle chaîne de langue ainsi.

Toutes les chaînes de langue d’origine se trouvent dans le fichier /escal/lang/escal_fr.php. Attention à bien respecter la syntaxe du fichier !

- Escal est international, d’autres fichiers de langue sont disponibles dans le dossier escal/lang et sont bien sur modifiables de la même façon. pour l’instant, traduit en :

  • albanais
  • Allemand [de] Deutch
  • Anglais [en] English
  • Espéranto [eo] Esperanto
  • Espagnol [es] Espanôl
  • Italien [it] Italiano
  • Letton [lv] Latvieŝu
  • Néerlandais [nl] Nederlands
  • ukrainien
  • Russe [ru] русский

Toutefois, si les traductions doivent être à jour pour la partie publique, en revanche, seul l’italien et l’anglais doivent être presque à jour pour la partie privée.

Afin d’accélérer les choses nous allons utiliser l’outil en ligne Traduire SPIP

En effet, si la partie publique est bien traduite en plusieurs langues, ce n’est pas le cas des pages de configuration d’Escal.

Pour cela, il faudrait traduire tous les textes des pages de configuration, ce qui est un énorme travail que je n’ai ni les compétences, ni le temps de réaliser.

L’espace des traducteurs accueille tous ceux qui souhaitent aider la communauté des utilisateurs de SPIP, en participant aux travaux de traduction de SPIP lui-même et de ses diverses contributions.

- Pour commencer le travail de traduction, vous devez :

  • vous inscrire sur le site : https://trad.spip.net/
  • vous connecter avec vos identifiants
  • choisir le module de langue à traduire (Escal donc !)
  • la langue d’origine qui vous servira de modèle (privilégiez la langue mère si vous le pouvez) ;
  • la langue cible qui est la langue vers laquelle vous traduisez ;

Pour la langue cible, vous devez choisir si vous travaillez vers une langue déjà existante, ou si vous créez une nouvelle langue.

Le head

Cette noisette n’affiche rien mais elle est essentielle.
Nom du fichier inc-head.html
pages concernées Toutes les pages
mots-clés aucun
C’est elle qui contient
l’appel au favicon, en le créant automatiquement à partir du logo de votre site, sinon on affiche le favicon à partir du logo d’Escal.
les balises meta pour (entre autres) le charset
la version de spip
l’email du webmaster
l’auteur du site
les directives pour les moteurs de recherche
les appels aux feuilles de style celle qui définit la mise en page générale (layout.css)
la feuille de style générale (general.css)
celle pour le menu (menu.css)
celle pour le forum (forum.css)
celle pour les couleurs (couleurs.css)
celle pour l’impression
celle pour vos surcharges personnelles (perso.css)
les appels aux javascripts pour le menu horizontal (menu.js)
pour le premier menu vertical (menu_vertical.js)
pour changer la taille du texte dans les articles (changetaille.js)
pour les effets de rotation des articles ou images dans les noisettes inc-actus et inc-photos (rotative.js)
(menu.js) pour le menu horizontal, pour Internet Explorer
(ie.css) pour que le menu horizontal et le menu vertical 2, pour Internet Explorer
(tabs_ie.css) pour les derniers articles de la page d’accueil, pour Internet Explorer

Ce n’est pas moins de 13 mises en pages possibles qui sont proposées :

5 mises en pages fixes avec paramétrage de la largeur totale et de celle des colonnes latérales
3 mises en pages fluides, c’est à dire s’adaptant à la taille de l’écran
5 mises en pages mixtes, c’est à dire avec une partie centrale fluide et les 2 colonnes latérales fixes. La largeur de ces colonnes étant paramétrable.

Chacun peut donc choisir sa mise en page mais je conseille d’utiliser une mise en page fluide en indiquant une largeur maximum. On profite ainsi du "Responsive Web Design" sans avoir un site trop large sur les grands écrans, ce qui peut gêner la lecture avec des lignes trop longues.

On peut aussi envisager des mises en page différentes selon la page sommaire, rubrique, article ou autre mais là il faut enlever cet appel du fichier inc-head et mettre celui qu’on veut dans le "head" de chaque page.

Exemple : Pour avoir une page d’accueil en 3 colonnes (layout PMP) et les autres avec 2 colonnes (layout PM)

on va procéder ainsi :

  • on paramètre le layout PM dans la configuration d’Escal
  • on copie le fichier inc-head.html de /escal/inclusions vers /squelettes/inclusions et on le renomme inc-head-sommaire.html par exemple
    dans cette copie, on modifie les lignes

par

on copie ensuite le fichier sommaire.html de /escal vers /squelettes
dans cette copie, on remplace

par

A noter
- que la feuille de style et le javascript spécifiques pour le bloc central de la page sommaire est dans la partie "head" du fichier sommaire.html, soit :

  • (alaune.css) la feuille de style du bloc central
  • (onglets.js) et (jquery.tabs.pack.js) permet l’affichage de l’onglet actif et l’effet d’enroulement/déroulement

- que la feuille de style pour l’agenda (agenda.css) est dans la partie "head" du fichier agenda.html

- rotative.js permet aussi les effets de rotation des articles ou des images pour les noisettes inc-annonce_defilant, inc-sites_favoris et l’éventuelle noisette inc-perso

- on rajoute l’appel vers la feuille de style pour la configuration d’Escal dans la partie privé du site (config.css)

- on rajoute l’appel javascript pour déplier/replier les noisettes (bloc_depliant.js) ou les forums des articles (bloc_depliant2.js)

configurer certaine balises meta du site
Paramétrage via le back office « https:// URL /ecrire/ ?exec=configurer_escal&cfg=meta »
Balise "Keyword"
Balise "Author" (déplacé dans sommaire.html)
  • choisir le layout qui définit la mise en page générale
    Paramétrage via le back office « https:// URL /ecrire/ ?exec=configurer_escal&cfg=layout »
  • choisir votre favicon
    Paramétrage via le back office « https:// URL /ecrire/ ?exec=configurer_escal&cfg=elements »

Bandeau

C’est le premier élément que verra un visiteur. Alors autant s’appliquer pour qu’il reflète au mieux l’identité de votre site. En fonction du secteur, de la langue, en "slider", avec un menu horizontal, une Identification simplifiée

Bandeau

Nom du fichier inc-bandeau.html
pages concernées Toutes les pages
mots-clés aucun

Par défaut, Escal affiche son logo mais cette image n’est pas libre de droits et ne peut être utilisée que par les établissements de l’académie de Lyon., le titre du site et, s’ils existent, le descriptif et le slogan du site.

  • Paramétrage via le back office « https:// URL /ecrire/ ?exec=configurer_escal&cfg=bandeau », permet de supprimer ce titre et/ou le slogan et le descriptif du site, la taille du texte en pixels est configurable.

Pour la remplacer le logo, 2 solutions :

  • on modifie cette image dans ce fichier (pas conseillé)
  • on remplace cette image par le logo du site. Le remplacement est automatique dès que vous avez téléchargé le logo du site dans l’espace privé de votre site.

Dans les 2 cas, l’image aura un lien vers la page d’accueil, de plus vous pouvez choisir la position de l’image du bandeau

le nom du site (celui que vous mettez dans l’espace privé) est affiché mais cet affichage est commandé par une ligne de code dans chacun des fichiers principaux (sommaire, rubrique, articles et pages spéciales). L’intérêt de procéder ainsi c’est qu’on peut donner un titre différent selon le contexte.

Toutefois pour avoir un joli bandeau correspondant exactement à vos désirs, le plus simple est de fabriquer une image avec les éléments que vous désirez : photo, texte, logo,

  • Cette image de bandeau doit
    • avoir une largeur au moins égale à celle de votre site.
    • avoir une hauteur limitée pour ne pas "envahir" l’écran
    • avoir une résolution adaptée au web
      Cette image s’adaptera automatiquement à la largeur de votre site.
  • Nous conseillons une image d’environ
    • 2000px de largeur
    • 150 à 200px de hauteur
    • 72 ppp (ou dpi) de résolution

Mettre en place le bandeau
Votre image de bandeau doit être téléversée dans un dossier /squelettes/images/bandeau.
Pour le mettre en place, se rendre dans l’espace privé du site

  • cocher "Option3" dans le premier bloc de configuration
  • choisissez enfin l’image de bandeau dans le menu déroulant du deuxième bloc de configuration
  • cocher "Non" pour le titre, le slogan et le descriptif du site
  • N’oubliez pas de valider vos choix en bas de la page de configuration

Il n’y a plus qu’à vous rendre sur la partie publique de votre site et de recalculer la page pour voir apparaître votre magnifique bandeau.

- Vous pourriez avoir envie d’aller encore plus loin et d’avoir un bandeau

En fonction du secteur

On peut vouloir un bandeau différent pour tel ou tel secteur (rubrique de premier niveau). Pour cela, il faut avoir choisi l’option 3 "affichage d’un bandeau personnalisé" dans la configuration d’Escal partie "Généralités" puis "Bandeau".

Il suffit ensuite de nommer une image rubriqueXX.jpg ou rubriqueXX.png où XX est le numéro du secteur et de placer cette image dans un dossier /squelettes/images/bandeau.
Bien sur, les sous-rubriques et leurs articles hériteront de ce bandeau.

En fonction de la langue

On peut aussi changer l’image du bandeau en fonction de la langue de la rubrique.

  • Copier inc-bandeau.html de /escal/inclusions vers /squelettes/inclusions dans ce fichier, remplacer tout le code existant par ceci
  • créer un bandeau par langue appelé ainsi bandeau-XX.jpg où XX correspond au code de langue (fr, en, de, es, it, ....)
  • déposer ces images dans un dossier /squelettes/images/bandeau (à créer s’il n’existe pas).

Un bandeau slider

Pour mettre un tel bandeau en place, on va :

  • installer le plugin SPIP Cycle2 celui-ci est préinstallé sur la plateforme
  • créer un article dans une rubrique invisible dans les menus grâce aux mots clés adéquats
  • joindre à cet article les images que l’on veut en les ayant retaillées en amont (largeur = celle du site, hauteur au choix mais identique pour toutes les images)
  • publier l’article
  • dans la configuration de SPIP Cycle2, régler la largeur et la hauteur en fonction de vos images et indiquer l’article créé comme réservoir d’images (les autres réglages sont à votre convenance)
  • reste à faire une copie de inc-bandeau.html de /escal/inclusions vers /squelettes/inclusions et dans ce fichier, effacer tout le code et mettre juste

Le menu horizontal

Cette noisette affiche un menu horizontal en cascade automatique avec toutes les rubriques de premier niveau sauf celles à qui l’on attribue le mot-clé pas-au-menu.

Nom des fichiers inc-menu.html
inc-menuart.html
inc-menu2eniveau.html
inc-menu2eniveauart.html
pages concernées Toutes les pages
mots-clés pas-au-menu, invisible, chrono

Une rubrique sans article ne sera pas affichée.

Si une rubrique ou une sous-rubrique contient des sous-rubriques, un petit triangle noir apparaît à côté du titre de la rubrique.

Les sous-rubriques apparaissent alors au passage de la souris.

Évidemment, un clic sur une rubrique ou une sous-rubrique renvoie vers cette rubrique.

  • ce menu est limité à 5 niveaux de sous-rubriques, ce qui est largement suffisant (plus serait anti-ergonomique)
  • on peut choisir d’afficher ou non les articles grâce à une option dans la page de configuration d’Escal (onglet "Généralités")
  • de plus, les articles d’une rubrique qui a le mot-clé chrono seront classés par ordre antéchronologique et ceux des autres rubriques seront classés par nom ou par numéro si vous les avez numérotés
  • on peut choisir d’afficher le logo des secteurs ou pas, toujours dans la page de configuration d’Escal (onglet "Généralités")
  • enfin, si on a un site multilingue où on a choisi d’utiliser un secteur (rubrique de premier niveau) par langue, on peut ne faire apparaître que les rubriques de deuxième niveau. Pour cela, il faut choisir cette option dans "Généralités" → "Multilinguisme" de la configuration d’Escal.

Identification simplifiée

Cette noisette d’identification est la version allégée de la noisette inc-identification avec qui elle est donc redondante.

Nom du fichier inc-identification_light.html
pages concernées Toutes les pages
mots-clés aucun

Elle est destinée à se placer en haut de chaque page.

Elle se contente de proposer un lien "Se connecter" qui appelle le formulaire de login.
Une fois ce formulaire validé, vous retrouvez la page d’accueil mais avec 2 liens "Se déconnecter" et "Espace privé".

  • Paramétrage via le back office « Barre d’outils »
    https:// URL /ecrire/ ?exec=configurer_escal&cfg=elements

La colonne principale

C’est la colonne centrale de contenu, page sommaire, rubrique, article

Annonce

Une petite noisette simple pour afficher, si l’on veut une annonce importante au dessus du bloc central "à la une".

Nom du fichier inc-annonce.html
pages concernées page d’accueil
mots-clés annonce

Pour l’afficher on crée un article avec le texte que l’on veut et on associe le mot-clé annonce à cet article.

Et c’est tout ! Le titre et le texte de l’article seront affichés.

S’il existe plusieurs articles avec le mot-clé annonce, ce sera le plus récent qui sera affiché.

on peut aussi déterminer une période d’affichage de l’annonce. Pour cela, il faut :

  • dans l’espace privé -> Configuration -> Contenu du site -> Les articles -> cocher "oui" pour "Date de rédaction antérieure"
  • dans la configuration d’Escal -> Page d’accueil -> Partie centrale -> Le bloc "Annonce" -> cocher "Oui" pour "Choisir les dates d’affichage de l’article"
  • dans l’article à afficher, soit celui qui a le mot-clé annonce, changer la date publication en ligne pour déterminer la date du début de l’affichage de l’article
  • dans ce même article (évidemment !) indiquer une date de rédaction antérieure qui sera la date de fin d’affichage de l’article.

Annonces defilantes

Elle permet d’afficher plusieurs annonces importantes au dessus du bloc central à la une. Ces annonces défilent du bas vers le haut.

Nom des fichiers inc-annonce_defilant.html
inc-annonce_defilant_article.htm
pages concernées page d’accueil
mots-clés annonce-defilant

Les articles que l’on veut faire apparaître dans cette noisette doivent âtre associés au mot-clé annonce-defilant.

On peut choisir de les afficher

  • par ordre chronologique
  • par ordre antéchronologique
  • par numéro du titre
  • au hasard

On peut classer ces annonces en numérotant le titre des articles ainsi
10. titre du premier article
20. titre du deuxième article
30. titre du troisième article
etc

On choisit aussi d’afficher le descriptif et/ou le texte.


Quand on un texte avec des liens ou des images ou du son, cela peut parfois donner un affichage bizarre dans ce bloc puisqu’on coupe parfois le texte entre 2 balises. Dans ce cas, utiliser le descriptif peut régler le souci.

On choisit aussi la hauteur du bloc, le nombre d’annonces et la temporisation entre chaque annonce.

Le titre et le début du texte de l’article seront affichés avec un lien "lire la suite".


Attention
Comme le texte est coupé à X caractères, évitez de mettre des images ou autres raccourcis car si on coupe au milieu d’un raccourci, cela peut dégrader fortement l’affichage de la page.

On peut enfin afficher le nombre d’annonces.

Sommaire, Rubriques & Articles

Sommaire - A la une

Cette noisette destinée à être appelée au centre de la page d’accueil affiche 2 onglets par défaut mais on peut en rajouter facilement.
Petite précision utile : l’affichage de l’onglet actif et l’effet d’enroulement/déroulement sont gérés par un javascript

Nom du fichier inc-a_la_une.html
pages concernées page d’accueil
mots-clés aucun

On peut configurer de 1 à 5 onglets avec le choix suivant :

Derniers articles avec 3 présentations possibles

Cette noisette est appelée par une autre noisette : inc-a_la_une.

Nom du fichier inc-une_derniers.html
inc-une_derniers_bis.html
inc-une_derniers_ter.html
pages concernées page d’accueil
mots-clés pas-a-la-une, invisible

Il y a 3 types d’affichage possibles.

Derniers articles : 1 article en exergue configurable et d’autres en-dessous en 1 à 3 colonnes.

Un clic sur l’un d’eux le fait remonter en exergue.

Son rôle est d’afficher des articles du site avec l’un de ces articles en exergue.

A noter qu’au premier affichage, l’article en exergue est aussi dans les 10 autres affichés dessous mais dès qu’on clique sur l’un des articles proposés, celui en exergue disparaît de cette liste.

Les articles appartenant aux rubriques à qui on attribue le mot-clé pas-a-la-une ou invisible ne seront pas affichés.

On peut basculer d’un article à l’autre avec un effet javascript.

Vous pouvez paramétrer le nombre d’articles affichés et il est possible d’afficher ces articles soit :

  • par date inverse
  • par date de dernière modification
  • par hasard (du coup ce ne sont plus les derniers articles !)

Pour l’article en exergue, on peut choisir d’afficher ou non

  • le logo de l’article (ou de sa rubrique)
  • le surtitre
  • le sous titre
  • l’auteur
  • les dates de publication et de mise à jour
  • la rubrique
  • le descriptif
  • le chapeau
  • le texte en choisissant le nombre de caractères
  • la première image


A noter que c’est la première image qui est affichée par défaut sauf si l’une d’elles a un titre numéroté ainsi : numéro point espace titre (et si plusieurs images ont des titres numérotés, ce sera le numéro le plus faible qui sera prioritaire)
Exemple : 1. Mon titre

Pour les autres, on peut choisir

  • leur affichage en 1 à 3 colonnes
  • la taille du logo
  • l’affichage de l’auteur, de la rubrique mère et du début du texte
  • l’affichage du nombre de commentaires

Derniers articles bis

Une liste des derniers articles présentés comme l’article en exergue de la première option

Cette noisette affiche les derniers articles en ordre antéchronologique, sans effet "tiroir". La présentation sera la même que l’article en exergue de "Derniers articles. Les paramètres disponibles sont :

  • le nombre d’article à afficher
  • le pas de pagination
  • le modèle de pagination

Derniers articles ter

une présentation identique à Derniers articles, mais un clic sur un article renvoie directement à l’article

Cette noisette permet d’afficher une liste des X derniers articles en ordre antéchronologique en plusieurs colonnes. La présentation sera la même que les article en "tiroir" de "Derniers articles" avec les mêmes paramètres de configuration. Un clic sur un article redirigera donc directement vers la page de l’article.

Plan du site

Comme son nom l’indique, cette noisette permet d’afficher le plan du site, c’est à dire toutes les rubrique avec leurs sous-rubrique éventuelles et leurs articles.

Nom du fichier inc-plan.html
pages concernées page d’accueil
mots-clés pas-au-plan, invisible

Une rubrique vide ne sera pas affichée.

Tous les articles des rubriques à qui on attribue le mot-clé pas-au-plan ou invisible ne seront pas affichés.

Dans la configuration d’Escal, vous pouvez choisir d’afficher un lien vers le plan du site dans le pied de page ... ou pas

Article d’accueil qui affiche l’article avec le mot-clé accueil

Cette noisette est destinée à l’un ou l’autre des onglets de la page d’accueil.

Nom du fichier inc-article_accueil.html
pages concernées page d’accueil
mots-clés accueil

L’article affiché sera celui qui aura le mot-clé accueil.

Le titre de l"article s’affichera dans l’onglet.

On peut choisir d’afficher le forum de cet article ... ou pas.


Si aucun article n’a le mot-clé "accueil" on affiche alors le plus récent, histoire de ne pas avoir un bloc vide ...

Article avec mot-clé pour afficher la liste des articles avec le mot-clé de votre choix

Cette présentation aura le même aspect que Derniers articles ter

Une noisette qui permet de choisir d’afficher dans un onglet de la page d’accueil les articles avec un mot-clé de son choix.

Ce mot-clé est à indiquer dans la configuration d’Escal et sera utilisé pour le titre de l’onglet.

Le paramétrage sera le même que pour l’onglet "Derniers articles" ou "Derniers articles ter"

Article archive pour afficher un article pris au hasard dans la rubrique ayant le mot-clé archive

Noisette destinée à l’un ou l’autre des onglets de la page d’accueil.

Nom du fichier inc-article_archive.html
pages concernées page d’accueil
mots-clés archive

L’article affiché sera un article pris au hasard dans la rubrique ayant le mot-clé archive ou dans l’une de ses sous-rubriques.

Le titre de l’onglet sera "Souvenez-vous !" avec multilinguisme pris en charge dans les langues disponibles avec Escal.

A noter que les articles de cette rubrique qui ont le mot-clé "accueil" ou "annonce" ou "annonce-defilant" ne s’afficheront pas pour éviter les doublons.

Rubrique pour afficher les articles d’une rubrique avec 5 rubriques possibles

Noisette destinée à l’un ou l’autre des onglets de la page d’accueil.

Nom des fichiers inc-rubrique_accueil.html
inc-rubrique_accueil2.html
inc-rubrique_accueil3.html
inc-rubrique_accueil4.html
inc-rubrique_accueil5.html
pages concernées page d’accueil
mots-clés RubriqueOnglet, RubriqueOnglet2, RubriqueOnglet3, RubriqueOnglet4, RubriqueOnglet5

La rubrique concernée sera celle qui aura le mot-clé RubriqueOngletN.

Le titre de cette rubrique sera affiché dans l’onglet et les articles de cette rubrique seront affichés dessous.

On peut définir

  • le pas de pagination
  • la taille du logo de la rubrique

On peut choisir d’afficher ou non

  • le descriptif de la rubrique
  • afficher le texte de la rubrique
  • l’auteur des articles affichés

Mon article pour afficher l’article avec le mot-clé mon-articleN avec 3 articles possibles

Cette noisette destinée à être affichée dans un onglet de la partie centrale de la page d’accueil.

Nom du fichier inc-mon_article.html
inc-mon_article2.html
inc-mon_article3.html
pages concernées page d’accueil
mots-clés mon-article, mon-article2, mon-article3

Elle affichera l’article ayant le mot-clé mon-articleN.

Le titre de l’onglet sera celui de l’article par défaut mais on peut aussi lui donner un autre titre dans la page de configuration. Seuls le texte et le PS seront affichés.

A noter que si plusieurs articles ont l’un de ces 3mots-clés, c’est le plus récent qui sera pris en compte.

Sur le web pour afficher la liste des articles syndiqués dans l’ordre souhaité par vous même

Cette noisette affiche la liste des articles syndiqués sur votre site dans un onglet de la page d’accueil.

Nom du fichier inc-sites-accueil.html
pages concernées page d’accueil
mots-clés aucun

Les articles seront affichés avec leur site source et la date de parution.

Le titre de l’onglet est "Sur le web" sauf si vous lui donnez un titre différent.

Rubriques

Une seule noisette ici composée de 2 parties :

  • une pour le titre et le descriptif
  • une pour la liste des articles, des sous rubriques et des sites référencés

Cette noisette est évidemment appelée dans les pages "rubrique"

Nom du fichier inc-rubrique_normal.html
pages concernées page rubrique
mots-clés pas-au-menu, invisible

Elle affichera :

  • le chemin pour arriver dans cette rubrique ou sous-rubrique
  • le logo de la rubrique active ou de la rubrique parent et son titre
  • le logo du flux RSS de la rubrique (optionnel) avec un lien vers ce flux
  • la liste des articles de cette rubrique avec le nom de l’auteur (optionnel)
  • la liste des sous-rubriques de la rubrique active ( sauf celles avec le mot-clé pas-au-menu ou invisible) avec
    • le nombre d’articles dans cette sous-rubrique
    • le nombre de rubriques dans cette sous-rubrique
    • le nombre de sites référencés dans cette sous-rubrique
  • les sites référencés dans cette rubrique

Articles

Cette noisette est, comme vous l’avez deviné, appelée dans les pages "article".

Nom du fichier inc-article.html
pages concernées page article
mots-clés article-sans-date

Elle affichera l’article demandé avec :

  • le chemin pour arriver à cet article
  • le logo de l’article s’il existe ou sinon celui de sa rubrique ou de sa rubrique parent ...
  • le titre de l’article, son descriptif (s’il existe), sa date de publication et son auteur
  • un bouton pour imprimer l’article
  • une barre d’outils dont certains éléments dépendent des plugins installés. Les plugins rajoutant des boutons sont :
    • Article PDF
    • SpiPDF
    • Licence
  • les liens vers les traductions de l’article si elles existent
  • 2 boutons pour augmenter ou diminuer la taille des caractères du texte
  • le chapeau de l’article (s’il existe)
  • le texte de l’article
    • éditable dans la partie publique si on est administrateur et si on a installé et activé le plugin "Crayons"
    • les images du texte sont réduites à 400px de largeur si elles sont plus grandes (taille est modifiable)
  • les notes de bas de page avec les images réduites également (s’il y en a)
  • le post-scriptum (s’il existe)
  • le site web associé (s’il existe)
  • les documents joints aux articles pour le téléchargement (s’il y en a) sauf ceux déjà affichés dans l’article
  • un bouton pour revenir en haut de page (pour les articles longs)
  • le forum de l’article (si vous l’avez activé dans l’espace privé), Rien ne s’affiche pour les articles dont le forum n’est pas activé.

Le forum des articles

Cette noisette est appelée par la noisette inc-article et permet d’ajouter un forum au bas de l’article si on a activé cette possibilité dans l’espace privé de la configuration de SPIP.

Nom du fichier inc-forum_article.html
pages concernées page article
mots-clés aucun

Elle affichera les réactions des visiteurs à l’article ainsi que les réponses à ces réactions et les réponses à ces réponses et aussi les réponses aux réponses des réponses ...

Forum d’article

Nom du fichier forum.html
pages concernée message.html
mots-clés aucun

forum.html est la page qui s’affiche lorsqu’on clique en bas d’un article comme celui-ci sur "Répondre à cet article".

Elle affiche

  • le titre
  • l’auteur
  • la date de rédaction
  • le descriptif ou le début de l’article
    puis le formulaire de réponse.

Noter que la case "Votre nom" doit être remplie.

message.html est la page qui s’affiche lorsqu’on clique sur "Répondre à ce message".

Elle reprend la discussion en entier puis propose le formulaire de réponse.


Les dates de publication et de modification peuvent ne pas être affichés pour tous les articles (option de la configuration d’Escal) ou pour certains articles seulement (ceux avec le mot-clé article-sans-date)

On peut aussi choisir

  • la taille du logo
  • l’affichage ou non de l’auteur
  • la taille des images
  • l’affichage des réponses de forum dépliées ou repliées
  • l’affichage ou non du portfolio

Les colonnes latérales

Colonne de droite, de gauche

Plus communément appelé :

  • a droite : "Extra"
  • a gauche : "Menu"

On peu choisir de faire apparaître ou pas une noisette dans la page de son choix ( sommaire, Rubrique, Article, Forum du site, 404, annuaire, auteur, recherche, ... ), dans l’ordre que l’on souhaite, dans la colonne de son choix ou les deux (a gauche "menu", a droite "extra )

Accès direct (Sommaire,Rubrique,Article,Forum,Autres pages)

Cette noisette très simple permet d’afficher le contenu de l’article à qui on attribue le mot-clé acces-direct.

Nom du fichier inc-acces_direct.html
pages concernées Toutes les pages
mots-clés acces-direct

Cet article est prévu pour mettre des liens vers ...

  • un agenda
  • une rubrique ou un article spécifique
  • le plan du site
  • la liste des auteurs
  • une info speciale
  • le plan de l’etablissement
  • une page des articles les plus lus
  • des sites amis
  • ... que sais-je encore ?

Rappel sur les liens dans un article

  • vers une page spéciale (exemple : l’agenda)
  • vers un article ou un rubrique du site (exemple : rubrique N°1)

un lien qui reprend le titre de l’article

ou un lien avec le texte de que l’on veut et un texte au survol

Le titre de la noisette sera le titre de l’article.

S’il y a plusieurs articles avec le mot-clé acces-direct, ce sera le plus récent qui sera pris en compte.


Il est conseillé de mettre cet article dans une rubrique spéciale, "Rubrique technique" par exemple et d’empêcher l’affichage de cette rubrique et de ses articles dans le menu, dans la partie derniers articles et la partie plan de la page sommaire en lui attribuant les mots-clés pas-au-menu, pas-au-menu-vertical, pas-a-la-une et pas-au-plan ou tout simplement la mot-clé invisible

Dans la configuration d’Escal, vous pouvez choisir dans quelle colonne afficher la noisette et si celle-ci est repliée et dépliable.

Actus (Sommaire,Rubrique,Article,Forum, Autres pages)

Cette noisette, propose d’afficher les articles que l’on veut de façon défilante.

Nom du fichier inc-actus.html
pages concernées Accueil
Forum du site
Autres pages : contact, 404, annuaire, auteur, recherche, ...
mots-clés actus

Le titre des articles avec le début du texte apparait et on change d’article toutes les 5 secondes par défaut.

Les articles qui apparaîtront sont ceux à qui on aura associé le mot-clé actus, peu importe leur emplacement.

Dans la configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • la temporisation entre chaque actu
  • de faire disparaître la noisette s’il n’y a pas ou plus d’article à afficher

Escal modifie le comportement de la noisette en détournant la date de rédaction antérieure des articles :

  • les articles "Actus" sans date de rédaction antérieure s’affichent comme avant
  • ceux qui ont une date de rédaction antérieure dans le futur s’affichent
  • ceux qui ont une date de rédaction antérieure dans le passé ne s’affichent plus

Il faut bien sûr penser à cocher "Oui" pour la date de rédaction antérieure dans Configuration - Contenu du site - Les articles

Il ne restera plus qu’à donner une date de rédaction antérieure aux articles "Actus" qui sera la date de fin de parution de ces articles dans le bloc.

A découvrir (Rubrique)

Cette noisette n’est disponible que pour les rubriques et permet de faire ressortir des articles pas forcément lus souvent.

Nom des fichiers inc-decouvrir_articles.html
inc-decouvrir_articles_rub.html
inc-decouvrir_articles_site.html
pages concernées Rubriques
mots-clés pas-a-decouvrir

Elle présente

  • soit des articles de la rubrique en cours et de ses sous-rubriques
  • soit des articles de tout le site

Dans le cas où on choisit de piocher dans tout le site, on peut exclure des rubriques et des articles avec la mot-clé pas-a-decouvrir

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le nombre d’articles les plus récents
  • le nombre d’articles pris au hasard
  • le nombre d’articles les plus visités
  • le nombre d’articles les moins visités
    Tous ces articles sont ensuite mélangés au hasard.

On pourra aussi choisir :

  • le titre de la noisette
  • la source des articles (la rubrique en cours ou tout le site)
  • l’affichage ou non de l’auteur
  • l’affichage ou non de la date de publication

Annuaire auteurs (Sommaire)

Cette noisette présente un annuaire des auteurs.

Nom du fichier inc-liste_auteurs.html
pages concernées Accueil
mots-clés aucun

Elle affiche en titre le nombre total des auteurs avec un lien facultatif vers la page trombino-auteurs plus complète.
Elle affiche ensuite le nombre des auteurs selon leur statut : administrateur, rédacteur ou visiteur.

Elle affiche enfin la liste des tous les auteurs en ordre alphabétique avec une pagination. On peut aussi afficher les auteurs selon leur initiale.

Sont paramétrables dans la page de configuration d’Escal ("Paramétrage des blocs latéraux" → "Titres et contenus") :

  • l’affichage ou non du lien vers le trombinoscope des auteurs
  • l’affichage ou non des icones des auteurs
  • la couleur correspondante à chaque statut
  • le pas de pagination

Articles de rubrique (Sommaire)

Une noisette qui permet d’afficher la liste des articles de la rubrique à qui on aura donné le mot-clé articles-de-rubrique.

Nom du fichier inc-articles_de_rubrique.html
pages concernées Accueil
mots-clés articles-de-rubrique

La noisette affiche le titre de l’article avec un lien vers celui-ci.

Dans la configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", on peut choisir

  • le titre de la noisette
  • le nombre d’articles à afficher
  • le pas de pagination
  • l’affichage ou non de la date publication et de l’auteur

Articles les plus vus (Sommaire,Forum,Autres pages)

Une noisette qui liste les articles les plus lus.

Nom du fichier inc-top.html
pages concernées Accueil
Forum du site
Autres pages : contact, 404, annuaire, auteur, recherche, ...
mots-clés forum
invisible

Par défaut, elle affiche les 5 articles les plus visités mais on peut régler ce nombre dans la configuration d’Escal : "Paramétrage des blocs latéraux" → "Titres et contenus". On pourra aussi y définir son titre.

Elle affiche également le nombre de fois où cet article a été vu.

Les articles des rubriques avec le mot-clé forum ou invisible ainsi que les articles avec le mot-clé invisible ne seront pas pris en compte.

Article libre 1 à 5 (Sommaire,Rubrique,Article,Autres pages)

Ce sont en fait 5 nouvelles noisettes (N = 1 à 5) qui voient le jour

Nom du fichier inc-article_libreN.html
pages concernées Accueil
Rubriques
Articles
Autres pages
mots-clés article-libreN

Ces noisettes permettent d’afficher les articles que l’on veut sur les pages que l’on veut.

Les titres des noisettes seront les titres des articles choisis avec les mots-clés article-libreN et afficheront le texte des articles.

Pratique pour afficher un texte et/ou des liens et/ou des images ... ce qu’on veut, donc.

A télécharger (Rubrique,Article)

Cette noisette propose d’afficher les documents téléchargeables de la rubrique (pas de ses articles) dans les pages de type rubrique et/ou les documents téléchargeables de l’article dans les pages de type article (logique, non !?).

Nom des fichiers inc-documents_rubrique.html
inc-documents_article.html
pages concernées Rubriques
Articles
mots-clés aucun

Attention, dans les articles, elle fera doublon avec le portfolio que l’on pourra ne pas afficher en cochant la bonne case dans la page de configuration d’Escal "Colonne principale" → "Les articles"

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir le titre de la noisette.

Bloc à personnaliser (Sommaire,Rubrique,Article,Forum, Autres pages)

Cette noisette propose d’afficher tous les articles ayant le mot clé special et/ou tous les articles des rubriques avec ce même mot-clé special.

Nom du fichier inc-perso.html
pages concernées Toutes les pages
mots-clés special

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • l’ordre d’affichage des articles
  • le type d’affichage des articles dans la noisette :
    • liste avec titre (et lien), date de publication et auteur
    • liste avec titre (et lien) seul
    • liste défilante avec titre et début du texte
  • le nombre d’articles à afficher
  • la pagination
  • le temporisation dans le cas de la liste défilante

Dans la même rubrique (Article)

cette noisette est appelée dans la page article pour afficher les articles de la même rubrique que l’article actif.

Nom du fichier inc-meme_rub.html
pages concernées Articles
mots-clés aucun

Elle affiche

  • le titre
  • la date de rédaction
  • l’auteur
    de chacun de ces articles.

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • le nombre d’articles à afficher
  • la pagination
  • l’ordre d’affichage : antechronologique ou au hasard
  • l’affichage ou non de la date de publication
  • l’affichage ou non de l’auteur

Derniers articles

Derniers articles (Rubrique)

Cette noisette n’est utilisée que dans la page rubrique et permet d’afficher les derniers articles de la rubrique active.

Nom du fichier inc-derniers_articles.html
pages concernées Rubriques
mots-clés aucun

Elle affiche pour chacun d’eux :

  • son titre avec un lien vers l’article
  • sa date de publication
  • son auteur(s) avec un lien pour lui envoyer un message (s’il a renseigné son adresse e-mail)

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • le nombre d’articles à afficher
  • l’affichage ou non de la date de publication
  • l’affichage ou non de la date de l’auteur

Derniers articles syndiqués (Sommaire,Article)

Une noisette pour afficher les derniers articles de vos sites préférés.

Nom du fichier inc-sites_recents.html
pages concernées Accueil
Articles
mots-clés favori
site-exclu

En l’état, elle affichera les 5 derniers articles syndiqués, quelque soit leur site d’origine, avec un lien vers l’article. Chacun est suivi de l’indication de son site source avec un lien vers le site en question.

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

La configuration permet de choisir :

  • le titre de la noisette
  • le nombre d’articles à afficher

Les sites avec le mot-clé site-exclu ne seront pas pris en compte.

On peut aussi exclure les sites avec le mot-clé favori puisque déjà présents dans la noisette Sites favoris si vous l’utilisez.

Derniers commentaires (Sommaire,Forum,Autres pages)

Cette noisette, comme son nom l’indique, affiche une liste des derniers commentaires dans le site, hormis les messages du secteur "Forum" si celui-ci existe.

Nom du fichier inc-derniers_comments.html
pages concernées Accueil
Forum du site
Autres pages : contact, 404, annuaire, auteur, recherche, ...
mots-clés forum

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • le nombre de commentaires affichés
  • le pas de pagination

Edito (Sommaire,Forum,Autres pages)

Une noisette au code très simple dont le seul but est d’appeler un article avec le mot-clé edito. À vous d’y mettre ce que vous voulez dedans.

Nom du fichier inc-edito.html
pages concernées Accueil
Forum du site
Autres pages : contact, 404, annuaire, auteur, recherche, ...
mots-clés edito

Le titre de la noisette sera celui de l’article choisi.

S’il y a plusieurs articles avec le mot-clé edito, ce sera le plus récent qui sera pris en compte.


Il est conseillé de mettre cet article dans une rubrique spéciale, "Rubrique technique" par exemple et d’empêcher l’affichage de cette rubrique et de ses articles dans le menu, dans la partie derniers articles et la partie plan de la page sommaire en lui attribuant les mots-clés pas-au-menu, pas-au-menu-vertical, pas-a-la-une et pas-au-plan ou tout simplement la mot-clé invisible

Evènements à venir (Sommaire,Rubrique,Article,Forum, Autres pages)

Cette noisette permet d’afficher une simple liste d’événements à venir.

Nom du fichier inc-evenement.html
inc-evenements_events.html
inc-evenements-articles.html
pages concernées Toutes les pages
mots-clés agenda
event-exclus

2 choix sont possibles : ils sont détaillés pour la noisette Mini calendrier puisque le fonctionnement est le même que pour cette noisette.

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • le pas de pagination

Si vous utilisez l’option "Articles" cette noisette ne s’affichera pas tant qu’il n’y aura pas de rubrique ou d’article avec le mot-clé agenda.

Si vous utilisez l’option "Événements" les articles avec le mot-clé event-exclus ne seront pas pris en compte.

Identification (Sommaire)

Cette noisette destinée à s’afficher sur la page d’accueil permet à un rédacteur ou à un administrateur de s’identifier.

Nom du fichier inc-identification.html
pages concernées Accueil
mots-clés aucun

L’identification permet d’accéder aux rubriques à accès restreint, s’il fait partie des auteurs autorisés à y accéder.
Les rubriques en accés restreint n’apparaitront pas au menu si on n’est pas connecté ou si on n’y a pas accès.

Une fois connecté, cette noisette vous souhaite bienvenue car elle est bien polie et vous propose aussi

  • de vous déconnecter afin de "recacher" les rubriques à accès restreint.
  • d’accéder à l’espace privé mais le lien vers l’espace privé est aussi dans le pied de chaque page

Mais si vous trouvez ce bloc identification un peu lourd, vous pouvez lui préférer la version allégée, la noisette inc-identification_light qui, elle, est affichée sur toutes les pages

Menu vertical dépliant (Sommaire,Rubrique,Article,Forum, Autres pages)

Afficher un menu vertical sur un côté de vos pages.

Nom des fichiers inc-menu_vertical.html
inc-menu2eniveau_vertical
pages concernées Toutes les pages
mots-clés pas-au-menu-vertical
invisible
chrono

Ce menu affichera toutes les rubriques du site avec leurs sous-rubriques et même leurs articles sous la forme d’un menu dépliant où les rubriques et/ou les articles en cours sont mis en évidence par une icône spécifique et des caractères gras.

Les rubriques ayant le mot-clé pas-au-menu-vertical ou invisible ne seront pas affichées.

Les articles d’une rubrique avec le mot-clé chrono seront classés par ordre antéchronologique et ceux des autres rubriques seront classés par nom ou par numéro si vous les avez numérotés.
On peut aussi supprimer l’affichage des articles grâce à une option dans la page de configuration d’Escal : "Paramétrage des blocs latéraux" → "Titres et contenus".

Si on a un site multilingue où on a choisi d’utiliser un secteur (rubrique de premier niveau) par langue, on peut ne faire apparaitre que les rubriques de deuxième niveau. Pour cela, il faut choisir cette option dans "Généralités" → "Multilinguisme" de la configuration d’Escal.


Astuce : On peut avoir un menu horizontal qui affiche certaines rubriques et un menu vertical qui en affiche d’autres en jouant avec les mots-clés pas-au-menu et pas-au-menu-vertical.

Cette noisette nécessite un javascript menu_vertical.js et 4 petites icônes, le tout étant bien sûr fourni avec le plugin.

Menu vertical déroulant a droite (Sommaire,Rubrique,Article,Forum, Autres pages)

Le premier menu vertical ne vous plait pas ? En voilà un autre !

Nom des fichiers inc-menu_vertical_2.html
inc-menu_vertical_2art.html
inc-menu2eniveau_vertical_2.html
inc-menu2eniveau_vertical_2art.html
pages concernées Toutes les pages
mots-clés pas-au-menu-vertical2
invisible
chrono

Cette noisette affiche un menu vertical en cascade automatique avec toutes les rubriques de premier niveau sauf celles à qui l’on attribue le mot-clé pas-au-menu-vertical2 ou invisible.

Les articles d’une rubrique avec le mot-clé chrono seront classés par ordre antéchronologique et ceux des autres rubriques seront classés par nom ou par numéro si vous les avez numérotés.
On peut aussi supprimer l’affichage des articles grâce à une option dans la page de configuration d’Escal (onglet "Généralités")

Et comme pour le menu horizontal :

  • Une rubrique sans article ne sera pas affichée.
  • Si une rubrique ou une sous-rubrique contient des sous-rubriques, un petit triangle noir apparait à côté du titre de la rubrique.
  • Les sous-rubriques et les articles apparaissent alors au passage de la souris.
  • Évidemment, un clic sur une rubrique ou une sous-rubrique ou un article renvoie vers cette rubrique ou cet article.
    ce menu est limité à 5 niveaux de sous-rubriques, ce qui est largement suffisant. Plus serait anti-ergonomique.

Si on a un site multilingue où on a choisi d’utiliser un secteur (rubrique de premier niveau) par langue, on peut ne faire apparaitre que les rubriques de deuxième niveau. Pour cela, il faut choisir cette option dans "Généralités" → "Multilinguisme" de la configuration d’Escal.


Astuce : On peut avoir un menu horizontal qui affiche certaines rubriques et un menu vertical qui en affiche d’autres en jouant avec les mots-clés pas-au-menu et pas-au-menu-vertical.

Mini calendrier (Sommaire,Rubrique,Article,Forum, Autres pages)

Une noisette avec un calendrier pour des événements.

Nom des fichiers inc-calendrier.html
inc-calendrier_art.html
inc-calendrier_event.html
calendrier_quete.json
calendrier_mini_escal.json
pages concernées Toutes les pages
mots-clés agenda

Cette noisette fait doublon avec la noisette Événements.

La différence c’est que cette noisette est un peu plus évoluée. En effet, elle présente :

  • le calendrier du mois en cours avec
    • la date du jour mise en évidence
    • la date des évènements futurs dans ce mois mise en évidence également
  • la liste des évènements à venir (on peut ne pas l’afficher)
  • un bouton pour ajouter directement un évènement dans la rubrique Agenda, à condition d’être un rédacteur du site (on peut ne pas l’afficher)

2 fonctionnements sont possibles pour la création d’événements :

événements créés avec le plugin Agenda

Le fonctionnement 1 événement = 1 article ne permet pas d’utiliser un agenda pleine page et est assez limité.
Il est donc recommandé d’utiliser plutôt le plugin Agenda qui permet un fonctionnement simple mais permet aussi :

  • de gérer facilement les événement sur plusieurs jours
  • de gérer facilement les répétitions d’événements
  • de proposer une inscription à un événement

Et Escal vous permet de jouer avec les couleurs pour des catégories d’événements.

1 événement = 1 article

Mise en place

  • on choisit "Articles" dans la configuration d’Escal pour cette noisette ("Paramétrage des blocs latéraux" → "Titres et contenus")
  • on crée une rubrique Agenda
  • on crée des articles dans cette rubrique
  • on attribue le mot-clé agenda à la rubrique Agenda
  • on attribue ce mot-clé à n’importe quel article dans le site

Ainsi, on aura dans l’agenda tous les articles de la rubrique Agenda plus tous ceux que l’on souhaite.

Ces articles n’apparaîtront dans le mini-calendrier que si on leur a donné une date de rédaction antérieure (à activer dans l’espace privé : icône "Configuration" puis "Contenu des articles"), ce qui permet de les faire apparaître le jour que l’on veut.

Prenons l’exemple d’un article publié le 25 octobre pour un événement au 15 novembre :

  • dans la page d’édition de l’article on clique sur "Changer"
  • on décoche "ne pas afficher de date de rédaction antérieure"
  • on choisit la date de l’événement,soit le 15 novembre, et on clique sur "changer"
  • l’article apparaîtra le 15 novembre dans le mini-calendrier

Pour les événements sur plusieurs jours, on peut jouer avec les articles virtuels :
- activer cette option dans l’espace privé, onglet "Configuration"
- écrire un premier article avec tous les détails et une date de rédaction antérieure correspondant à la première date de l’événement.
- écrire un deuxième article avec juste un titre et une date de rédaction antérieure correspondant à la 2e date
- rediriger ce deuxième article vers le premier dans la case prévue à cet effet en mettant simplement artXX (XX correspondant à l’identifiant du premier article)

Ce fonctionnement est le même pour la noisette Événements-

Un clic sur une case active renvoie vers une page qui affiche

  • la liste des articles du jour correspondant ou directement l’article s’il est seul pour le premier choix.
  • la liste des événements du jour correspondant.

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • l’affichage d’événements ou d’articles
  • la couleur pas défaut des événements
  • d’afficher ou non la liste des événements à venir avec son pas de pagination
  • d’afficher ou non un lien pour ajouter un événement (si le visiteur est authentifié)

Mots-clés associé (Article)

Une noisette qui vient se rajouter dans la page article si et seulement si l’article en question est associé à un ou des mots-clés.

Nom du fichier inc-nav_mots.html
pages concernées Articles
mots-clés tous les mots-clés d’Escal

Sont exclus les groupes de mots "techniques" utilisés par le squelette Escal, c’est à dire ceux des groupes

  • affichage
  • trombino
  • type_rubrique
  • type_article
  • Agenda_couleur

La noisette affiche le nom du groupe et la liste des mots-clés du groupe associés à l’article. Chaque mot-clé a un lien vers la page mot.html qui affichera tous les articles associés à ce mot-clé.

On peut donc ainsi avoir une navigation par mot-clés dans le site.

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir le titre de la noisette.

Navigation par mots-clés (Sommaire,Rubrique,Article)

Une noisette qui ajoute un menu de navigation par mots-clés.

Nom du fichier inc-nav_mots2.html
pages concernées Accueil
Rubriques
Articles
mots-clés aucun

Elle affiche un menu dépliable avec les mots-clés du groupe choisi dans la configuration d’Escal et, pour chacun d’eux, la liste des articles associés.

Sont aussi paramétrables :

  • le titre de la noisette
  • le nombre maximum d’articles affichés pour chaque mot-clé

Photos au hasard (Sommaire,Forum,Autres pages)

Voici une noisette qui affiche 10 images prises au hasard dans les articles ayant le mot-clé photo-une.

Nom du fichier inc-photos.html
pages concernées Accueil
Forum du site
Autres pages : contact, 404, annuaire, auteur, recherche, ...
mots-clés photo-une

Elle va

  • prendre au hasard 10 images dans chaque article avec le mot-clé
  • mélanger le tout
  • affiche X images au hasard parmi celles collationnées (X étant déterminé dans la configuration d’Escal : "Paramétrage des blocs latéraux" → "Titres et contenus")


Attention !
La noisette charge toutes les images ! Donc si vous donnez ce mot-clé à beaucoup d’articles, le temps de chargement de la page risque d’être très long.

Seules les photos insérées en tant qu’images (et non en tant que documents joints) sont prises en compte. Il faut donc les détacher du portfolio si elles s’y trouvent. Et celles-ci doivent être au format jpg, png ou gif.

Ces images passent une à une dans la noisette avec un délai réglé à 8 secondes par défaut.

Dans la configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • le nombre d’images à afficher
  • la temporisation entre chaque image
  • de laisser ou de supprimer le lien vers l’article source

Rainette (Sommaire,Forum,Autres pages)

Une noisette un peu gadget qui ne fonctionne que si le plugin Rainette est activé.

Nom du fichier inc-rainette.html
pages concernées Accueil
Forum du site
Autres pages
mots-clés aucun

Ce plugin permet d’afficher les conditions et les prévisions météorologiques d’une ville donnée à partir d’un flux xml fourni par le site weather.com®


Le paramétrage de la ville souhaitée se fait dans la configuration d’Escal : "Des plugins dans Escal" → "Rainette" en indiquant le code de la ville.
Ce code est à rechercher sur le web sur ce site en rajoutant le nom de la ville recherchée à la suite de "where=" dans la barre d’adresse.

La noisette affiche

  • l’état du ciel
  • la température du jour

et on peut déplier

  • plus d’infos :
    • température ressentie
    • vent
    • humidité
    • pression
    • point de rosée
    • visibilité
  • les prévisions à 3 jours
    • état du ciel
    • température
    • vent
    • risque de précipitation

Recherche multi-critères (Sommaire,Article)

Une noisette qui permet de rechercher des articles en fonction des mots-clés qui leurs sont associés.

Nom du fichier inc-recherche_multi.html
pages concernées Accueil
mots-clés aucun

Le titre de cette noisette est à définir dans la configuration d’Escal : "Paramétrage des blocs latéraux" → "Titres et contenus".

Le principe :

  • on crée entre 1 et 9 groupes de mots-clés, chacun contenant autant de mots-clés que l’on veut (les groupes utilisés pour la recherche sont à déterminer dans la configuration d’Escal : "Paramétrage des blocs latéraux" → "Titres et contenus")
  • on associe les mots-clés que l’on veut aux articles
  • le visiteur peut ensuite faire une recherche multi-critères en choisissant un mot-clé dans chaque groupe
  • la noisette affiche les articles ayant l’ensemble des mots-clés choisis (c’est un ET, pas un OU)

Sites favoris (Sommaire,Rubrique,Article,Forum, Autres pages)

Cette noisette vous propose d’afficher un défilement de vignettes des sites référencés sur votre site, à condition que vous leur ayez associé le mot-clé favori.

Nom des fichiers inc-sites_favoris.html
inc-sites_favoris_rub.html
pages concernées Toutes les pages
mots-clés favori

Le titre du site est affiché avec une vignette de la page sommaire du site. Si un logo du site est présent, il s’affiche, sinon, c’est la vignette "apercite".

Sur la page d’accueil, tous les sites référencés sont pris en compte alors que dans une page rubrique ou article, seuls les sites du secteur (rubrique de premier niveau) le seront.

Un clic sur le titre ou la vignette ouvre le site sur votre navigateur.

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • le nombre de sites à afficher
  • l’ordre d’affichage de ces sites
  • la temporisation entre chaque site

Statistiques (Sommaire,Forum,Autres pages)

Une noisette pour afficher quelques statistiques de votre site.

Nom du fichier inc-stats.html
pages concernées Accueil
Forum du site
Autres pages
mots-clés pas-au-menu
pas-au-menu-vertical
pas-au-plan
pas-a-la-une
invisible (remplace les 4 précédents)

Elle permet d’afficher

  • le nombre total de visites
  • le nombre total de pages vues
  • le nombre de visites aujourd’hui
  • la moyenne des visites depuis X jours (X étant paramétrable)
  • la plus grosse journée
  • le nombre de visiteurs du jour
  • le nombre de personnes connectées
  • le nombre d’auteurs, de rubriques, d’articles dans le site, de commentaires, de mots-clés, de sites référencés, de sujets dans le forum
  • le dernier article paru et sa date de parution. Les articles des rubriques (et de ses sous-rubriques) ayant le mot clé pas-au-menu ou pas-au-menu-vertical ou pas-au-plan ou pas-a-la-une ou invisible ne seront pas pris en compte
  • le nombre de sujets dans le forum du site

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • les statistiques à afficher ou pas

Sur le web (Sommaire,Rubrique,Article,Forum, Autres pages)

Une noisette pour afficher le titre des derniers articles de vos sites préférés.

Nom du fichier inc-sites.html
pages concernées Accueil
Articles
Forum du site
Autres pages : contact, 404, annuaire, auteur, recherche, ...
mots-clés favori
site-exclu

En l’état, elle affichera les 5 derniers sites référencés avec les 5 derniers articles pour chacun d’eux.

Tout ça avec des liens vers les sites et vers les articles, bien sur.

Dans la page de configuration d’Escal "Paramétrage des blocs latéraux" → "Titres et contenus", vous pouvez choisir :

  • le titre de la noisette
  • le nombre de sites
  • le choix de tous les sites référencés ou seulement ceux qui sont syndiqués
  • le nombre d’articles par sites (s’ils sont syndiqués bien sûr)

Les sites avec le mot-clé site-exclu ne seront pas pris en compte.

On peut aussi exclure les sites avec le mot-clé favori puisque déjà présents dans la noisette Sites favoris si vous l’utilisez.

Vidéos (Sommaire)

Cette noisette permet d’afficher les vidéos des articles avec le mot-clé video-une dans une colonne latérale de la page d’accueil.

Nom du fichier inc-video_accueil.html
pages concernées Accueil
mots-clés video-une

Pour l’utiliser, il faut donc :

  • avoir au moins un article publié à qui on a associé le mot-clé video-une
  • ajouter dans cet article la ou les vidéos en passant par "Ajouter une image ou un document" (seul les les formats .mp4 et .flv sont acceptés)

S’il y a plusieurs videos, la noisette affiche la liste des ces videos (nom du fichier ou titre s’il existe).

Le titre de cette noisette est à définir dans la configuration d’Escal : "Paramétrage des blocs latéraux" → "Titres et contenus".

Pied de page

Malgré sa petite taille, commun a toute les pages, il a une grande importance, comme source d’informations supplémentaires.
Nom du fichier inc-pied.html
pages concernées Toutes les pages
mots-clés citations

Dans la configuration, partie "Généralités" "Pied de page", vous pouvez choisir la présence ou l’absence de différents éléments :

  • lien vers le plan du site
  • lien vers la page contact
  • lien vers les mentions légales (si le plugin Mentions légales a été activé)
  • lien vers l’espace privé
  • lien vers le squelette de la page

Les liens ci-dessus peuvent être affichés sous forme textes ou sous forme d’icônes.
Pour changer ces icônes, il suffit de mettre les vôtres dans un dossier /squelettes/images en respectant les noms suivants :

  • plan du site : sitemap.png
  • page contact : arobase.png
  • mentions légales : legal.png
  • espace privé : ecrire.png
  • squelette de la page : squelette.png

Vous pouvez aussi choisir d’afficher

  • l’icône/Lien vers la page de flux RSS
  • l’icône/Lien vers validateur XHTML
  • le copyright d’Escal (mais ce serait sympa de le laisser ...)
  • le nom de votre hébergeur

Pages spéciales

Toutes les pages autre que les 3 pages de base (sommaire, rubrique et article)

Agenda et Mini-calendrier

Que choisir ? Un agenda pleine page ou juste un mini-calendrier dans une noisette latérale ?

Tout dépend de vos besoins : si vous n’avez qu’un événement à afficher de temps en temps, le mini-calendrier doit suffire mais si vous voulez un agenda avec possibilité de répétition d’un événement, possibilité d’inscription à un événement, distinction des événements par catégories, alors, c’est l’agenda pleine page qu’il vous faut.

Et comme je suis adepte de l’adage "Qui peut le plus peut le moins", je vous conseille d’utiliser le plugin Agenda qui permet d’utiliser aussi bien le mini-calendrier que l’agenda pleine page, ou même les 2 (Tous les détails de mise en place sont dans cet article).

Annuaire de sites

Il s’agit de l’annuaire visible sur cette page

Nom du fichier annuaire.html
mots-clés annuaire

Voici la procédure de mise en place :

- Création d’un article avec pétition

  • Créer un article dans une rubrique cachée avec les mots-clés adéquats (la même que edito ou acces direct, par exemple) avec juste un titre. Mettons "Annuaire" par exemple (original, non ?). Et on laisse le reste vide.
  • Publier l’article
  • Activer la pétition pour cet article (petit bloc "forum et pétition" à gauche)
  • Attribuer le mot-clé annuaire du groupe affichage à l’article créé.

- Création d’un lien vers la page annuaire

Exemple : lien dans la noisette "Accès direct" : dans le texte de l’article accès direct, mettre un lien vers la page annuaire comme ceci :

Bien sur, on met ce que l’on veut à la place de "Sites inscrits" et de "Annuaire"(pour l’info-bulle)

- Personnalisation du texte

Le texte d’invitation par défaut est celui-ci :

Vous aussi, vous utilisez ESCAL ?
Alors ajoutez votre site dans cette page.

et cela ne vous convient pas, c’est évident.

Alors allez donc lire attentivement cet article qui vous explique tout en détail.

A noter : Depuis le 26 octobre 2011 (et après quelques bugs 😉 ), le mail de confirmation n’est plus envoyé à celui qui s’inscrit mais au webmaster du site. Ceci afin d’éviter que certains sites indésirables ne polluent l’annuaire (c’est du vécu !). Bien sur, le message de confirmation est changé et traduit dans les langues prises en charge par l’internationalisation d’Escal.

Auteur

Cette page s’ouvre lorsque l’on clique sur le nom d’un auteur.

Nom du fichier auteur.html
mots-clés pas-au-menu
pas-au-menu-vertical
pas-au-plan
pas-a-la-une
invisible

Elle affiche :

  • la "bio" de l’auteur s’il l’a renseignée
  • un formulaire pour lui écrire un message s’il a renseigné son adresse
  • la liste des articles de cet auteur avec une pagination et classés du plus récent au plus ancien

Les articles des rubriques avec le mot-clé pas-au-menu ou pas-au-menu-vertical ou pas-au-plan ou pas-a-la-une ou invisible ne sont pas affichés.

Contact

Cette page contact assez élaborée a été, à ses débuts, très largement inspirée de celle proposée sur le site "Les Médecins Maîtres-toile" puis a été entièrement retranscrite en formulaire CVT spip, grâce à l’immense aide de Arnaud Bérard que je remercie énormément.

Nom du fichier contact.html
/formulaires/contact.html
/formulaires/contact.php
mots-clés aucun

Le paramétrage se fait dansla configuration d’Escal "Colonne principale" → "La page contact".

Tous les champs sont optionnels et on peut même en créer 2 à sa convenance. Elle gère le multilinguisme et permet l’envoi du message à plusieurs destinataires.

Erreur 404

Cette page s’affichera à chaque fois qu’un visiteur demandera une page qui n’existe pas ou plus dans votre site.

Nom du fichier 404.html
mots-clés aucun

Elle propose au visiteur de signaler le problème en passant par la page "contact" du site.

Cette page 404 ne s’affichera que si vous avez renommé le fichier "htacces.txt" en ".htaccess"

Si vous avez installé et activé le plugin SPIP 400 alors une page d’erreur 404 remplacera celle d’Escal avec un texte explicatif qui s’affichera et la possibilité pour l’internaute de transmettre un « ticket de bug » au webmestre du site.

Forum du site

Ces 2 noisettes permettent d’afficher le forum du site.

Nom des fichiers inc-rubrique_forumSite.html
inc-article_forumSite.html
pages concernées Le forum du site
mots-clés forum

Si une rubrique de premier niveau (=secteur) est associé au mot-clé forum et que ce mot-clé appartient au groupe type_rubrique, alors ce secteur et ses articles s’afficheront différemment des autres rubriques puisqu’ils s’afficheront comme un forum.

Mais tout est expliqué dans le forum lui-même pour le principe du forum comme pour son installation.

Et vous pourrez même réagir ... dans le forum ! 😎

Mots-clés

Cette page ne sera utilisée que si vous avez associé des mots-clés à vos articles pour permettre la navigation par mots-clés.

Nom du fichier mot.html
mots-clés aucun

Elle affiche tous les articles associés à un mot-clé et un menu de tous les mots-clés du site grâce à cette noisette.

Sont exclus les groupes de mots "techniques" utilisés par le squelette Escal, c’est à dire ceux des groupes

  • affichage
  • trombino
  • type_rubrique
  • type_article
  • Agenda_couleur

Voir cet article pour en savoir plus à ce sujet.

Recherche

La page des résultats de la recherche sur le site par le moteur de recherche intégré à SPIP.

Nom du fichier recherche.html
mots-clés aucun

Cette page affiche

  • le nombre et la liste des articles contenant le mot recherché
  • le nombre et la liste des rubriques contenant le mot recherché
  • le nombre et la liste des messages de forums contenant le mot recherché
  • le nombre et la liste des sites référencés contenant le mot recherché

Les résultats sont classés par pertinence.

Trombinoscope

Cette noisette, c’est pour s’amuser un peu. Et pour montrer ce qu’on peut faire avec Spip et un peu de html.

Nom du fichier inc-rubrique_trombino.html
pages concernées page rubrique
mots-clés trombino

Son but est d’afficher une série d’images avec un titre, un descriptif et un petit texte. L’idée m’en est venue pour faire un trombinoscope de mes collègues mais je m’en suis aussi servi pour présenter des plantes.

C’est un peu long à mettre en place mais pas difficile.

Il a fallu d’abord faire un test dans la page rubrique.html. Ce test vérifie si la rubrique

  • est "normale", dans ce cas elle affiche le contenu de inc-rubrique_normal, le test est transparent.
  • est associée à un mot-clé (un seul !) du groupe de mots type_rubrique. Dans ce cas, elle affiche le contenu de inc-rubrique_lemotclé

Ce système permet donc de créer des affichages spécifiques à une rubrique.

Donc pour notre trombinoscope, il faut :

  • créer un groupe de mots type_rubrique impératif ! (et pas type-rubrique, attention !)
    Noter que ce groupe et les mots clés associés ne sont pas pré-installé
  • dans ce groupe, on créé le mot-clé trombino impératif !
  • créer une rubrique Trombinoscope ou vous voulez
  • lui associer le mot-clé trombino

Voilà, si on demande cette rubrique, elle affichera le contenu de inc-rubrique_trombino

Ce fichier va afficher les articles de la rubrique Trombinoscope que l’on peut classer avec des mots-clés. Il faut donc :

  • créer un groupe de mots-clés trombino
    • dans ce groupe, on crée les mot-clés des groupes
  • créer un article pour chaque trombine. Cet article aura
    • une image (la trombine de 150 x 175 px) qui s’affichera automatiquement, sans mettre le raccourci dans le corps de l’article.
    • un titre (le nom de la trombine)
    • un descriptif (par exemple son e-mail)
    • un petit texte (ce que vous voulez)
  • associer le mot-clé correspondant à son groupe
  • publier l’article

Et voilà, c’est fini. Vous avez un beau trombinoscope avec une liste déroulante des groupes pour sélectionner celui que vous voulez.

Et si vous voulez changez le texte "Tous les collègues" qui s’affiche par défaut, voici la marche à suivre :

  • créer un dossier /squelettes/lang
  • dans ce dossier, créer un fichier local_fr.php qui contiendra ce code :

Trombinoscope auteurs

Page appelée par la noisette Annuaire auteurs.

Nom du fichier trombino-auteurs.html
mots-clés aucun

Cette page présente les auteurs du site en affichant :

le logo de cet auteur qui peut être sa photo ou à défaut, une image générique. Pour une présentation parfaite, il est conseillé d’avoir un logo de 175px de haut et de 150px de large
le nom de cet auteur avec un lien vers la page de cet auteur qui liste ses articles et propose de lui écrire s’il a renseigné son adresse mail
le statut de cet auteur
la bio de cet auteur où l’on peut mettre les renseignements que l’on veut

Des modèles intégrés

Simplement une noisette de SPIP, rendue disponible de façon dynamique au sein même des articles (donc pour les rédacteurs), avec la syntaxe d’appel HTML, les paramètres étant pris dans l’environnement d’appel.

  • choix_article
    permettre d’inclure des articles dans un autre article.
    • Pour un seul article, on utilisera le raccourci <choix_articleXX> où XX est le le numéro de l’article.
    • Pour plusieurs articles, le raccourci sera <choix_article|id=XX,YY,ZZ>

Et on peut choisir le nombre de colonnes pour afficher ces articles. Par défaut une seule colonne mais on peut en avoir 2 ou 3. Si le nombre d’articles n’est pas un multiple du nombre de colonnes, le ou les derniers articles adapteront leur largeur. Le raccourci a utiliser sera du genre <choix_article|id=233,173,251,252,209|colonne=3>

  • image_exif
    permet d’afficher une image centrée et "Responsive" et ses métadonnées (appareil, sensibilité, vitesse, ouverture, focale, flash et ouverture max.), nécessite l’installation du plugin Métadonnées photos

le raccourci à utiliser est <image_exifXX> où XX correspond au numéro de l’image

  • image-fluide
    Ce modèle permet d’afficher des images "responsive" ou "mobile-friendly" tout en :
    • respectant la largeur maximum des images dans les articles définies dans la configuration d’Escal
    • n’agrandissant pas l’image si elle est plus petite que cette limite
    • centrant cette image

le raccourci à utiliser est <image_fluideXX> où XX correspond au numéro de l’image

Configurer vos plugins

Tour d’horizon des plugins configurable en partie par l’interface d’Escal

A noter :
qu’aucun n’est indispensable au bon fonctionnement d’Escal.

Si vous avez activé le plugin, vous trouverez quelques options de paramétrage dans "Escal", pour vous facilter la vie.

Galleria Rainette Mentions légales Article PDF spiPDF Licence
Spip 400 Social Tags Liens sociaux QrCode Facebook Signalement

Note : Visualiser les Les plugins proposés par la plateforme

Personnaliser votre site

Malgré un “"clicodrome"” qui permet d’avoir un squelette hautement paramétrable

On peut parfois vouloir aller encore plus loin…, Personnalisation poussée d’ESCAL

help-votre-site-est-cassé

Il arrive quelquefois que votre site s’affiche mal, soit dans le privé, soit dans le plugin

Les choses à faire avant de poser une question

Attention pour votre problème, si vous nous contacter,
donnez une URL et l’hébergeur où le bug est visible.

Problème d’affichage Espace public

- Opération a faire dans l’ordre et controler l’affichage de votre site entre chaque.

1° Vérifié l’activation des plugins

    • https:// URL_SITE /ecrire/ ?exec=admin_plugin

2° Vider votre cache

    • https:// URL_SITE /ecrire/ ?exec=admin_vider

3° Débrancher votre répertoire "squelettes" afin de confirmer que le bug, ne viens pas d’une de vos personnalisation.

    • en renommant le répertoire /squelettes en /squelettes_old

Le problème persiste ?
==> Alors oui vous pouvez demander de l’aide.

Le problème a disparu ?
==> Alors une de vos personnalisations a créé le défaut, chercher dans votre répertoire /squelettes le fichier fautif.

- Comment faire ?

  • En renommant répertoire par répertoire pour trouver celui dans lequel se trouve le groupe de fichier incriminé,
  • puis renommer fichier par fichier pour trouver le fautif.

Bien entendu entre chaque manipulation, le cache aura été vidé, et les répertoires ou fichier redisposés avec leur bon nom.

Problème d’affichage Espace privé

1° Vérifié l’activation des plugins

    • https:// URL_SITE /ecrire/ ?exec=admin_plugin

2° Vider votre cache

    • https:// URL_SITE /ecrire/ ?exec=admin_vider

3° Réparé la base

    • https:// URL_SITE /ecrire/ ?exec=base_repair

Le problème persiste ?
==> Alors oui vous pouvez demander de l’aide.

Veuillez pensé a nous transmettre

  • l’URL du site
  • une copie d’écran si possible
    ci dessous les hébergés spipfactory.fr ne sont pas concerné
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite / PostgreSQL

Merci d’avance pour les contributeurs qui vous aident !

Par ailleurs, n’oubliez pas que les contributeurs sont des humains.

Pour allez plus loin ...

SPIP propose nativement quelques fonctionnalités pour venir en aide au webmestre lors de la phase de débuggage (ou débogage) des squelettes.

Ces fonctions d’information sont accessibles en passant des variables spécifiques dans l’url de la page appelée.

var_mode=calcul et var_mode=recalcul

L’appel de « var_mode=calcul » régénère le code html (lance l’exécution du code déjà compilé) et rafraîchit le cache (crée les fichiers html qui n’auront plus qu’à être lus lors des prochains appels de la page).

L’appel de « var_mode=recalcul » régénère le code php (effectue une nouvelle compilation du squelette), puis régénère le code html (lance l’exécution du code qui vient d’être compilé) enfin rafraîchit le cache (crée les fichiers html qui n’auront plus qu’à être lus lors des prochains appels de la page).
le recalcul de la page régénère aussi les CSS et scripts JavaScript compressés.
le recalcul ne s’applique pas aux images (vignettes, images-typo, ...)

  • Premier clic appelant « var_mode=calcul »
  • un second clic appelant « var_mode=recalcul ».


Attention :

On pourrait être tenté d’utiliser &var_mode=recalcul dans des liens de ses squelettes (pour forcer la mise à jour de CSS ou JavaScript par exemple). C’est une très mauvaise pratique qu’il faut éviter car elle est consommatrice de ressources du serveur (re-compilation du squelette).

Plus loin avec "Les var"

var_mode=inclure

L’appel de « var_mode=inclure » affiche le nom et le chemin de chaque noisette (« inclure » ou « modèle ») qui compose la page.

Ceci permet de vérifier que les « inclure », réellement appelés par le squelette de la page, sont bien ceux que l’on y a spécifiés.

var_profile=1

L’appel de « var_profile=1 » affiche le détail des requêtes SQL et les temps de calcul de chacune. Les requêtes sont classées de la plus gourmande en temps d’exécution à la plus rapide.

Cette fonction est particulièrement utile pour comprendre ce qui peut rendre une page excessivement lente à s’afficher.
Elle permet de visualiser les requêtes SQL générées par chaque boucle du squelette (y compris les squelettes inclus) ainsi que les requêtes hors boucle (notées « Hors Compilation ») générées par SPIP.


Attention :
Penser à calculer la page (&var_profile=1 & var_mode=calcul) pour éviter que ce ne soit le cache qui soit lu, faussant ainsi le résultat affiché.)

var_mode=preview

L’appel de « var_mode=preview » depuis l’espace privé permet de visualiser dans l’espace public un article de statut « proposé à la publication » sans avoir besoin de le publier.

var_mode=urls

L’appel de « var_mode=urls » force la mise à jour de toutes les URLs de la page.

var_mode=debug

L’appel de « var_mode=debug » détaille la génération d’une page (boucles spip - requêtes SQL - code php - statistiques des requêtes SQL).

Plus loin avec "Les Logs"

Constante "_LOG_FILELINE"

Très utile en période de debugage, la constante _LOG_FILELINE permet d’ajouter dans les logs le nom du fichier, le numéro de la ligne et le nom de la fonction d’où le log est généré.

Il est possible de déclarer cette constante dans votre fichier config/mes_options.php (voir l’article qui lui est consacré) :
// pour debugage précis
define(’_LOG_FILELINE’, true) ;

Un fichier de log est limité à 100 kilo octets par défaut. Au delà de cette taille, le fichier courant est renommé avec l’extension .log.1 et un nouveau fichier est créé.

l’éventuel .log.1 existant est renommé en .log.2 avant l’opération ci-dessus.

De même,

l’éventuel .log.2 existant est renommé en .log.3 avant l’opération ci-dessus.

Enfin,

l’éventuel .log.3 existant est supprimé avant l’opération ci-dessus.

Tout d’abord sachez qu’il existe les logs du serveur et les logs de SPIP
prenons comme exemple le serveur où est hébergé la plate-forme de SpipFactory.

Interpréter les logs

  • Côté Serveur : /home/www/spipfactory/log/
    • access-spipfactory.log
      • logs d’accés Apache
    • error-spipfactory.log
      • log d’erreur Apache
    • php-error.log
      • logs d’erreur PHP
    • php-fpm-slowlog-site.log
      • logs des processus php/fpm
  • Côté SPIP
    • /home/www/spipfactory/public_html/tmp/
      • spip.log
    • /home/www/spipfactory/public_html/tmp/log/
      • mysql.log
      • mysqlmysql.log
      • spip.log
  • Côté SPIP mutualisation : /home/www/spipfactory/public_html/sites/spipfactory.com/tmp/log/
    • maj.log
    • spip.log
    • spip_error.log
    • sqlite.log

Les commandes pour lire les logs en console

  • sudo tail -78 Nom_du_fichier.log (n’affichera que les 78 dernières lignes du fichier)
  • sudo head -128 nom du fichier ( affichera les 128 premières lignes du fichier)
  • cat nom du fichier lira tout le fichier
  • cat | more (lira page par page (appuyer sur la touche space pour faire défiler)
  • fgrep 500 access-xxx.log | grep -v 200 (je ne sais pas à quoi ça sert !)

Ça correspond à quoi ça ?

  • (pid xxxxx)
    numéro de processus sur le serveur. 1 Pid = 1 hit sur le serveur. Si le pid change, c’est que c’est un autre hit (qui peut être un hit ajax du même utilisateur ou un hit d’un autre utilisateur).
  • Pub = public : un log qui se fait en affichant l’espace public
  • Pri = privé : pareil dans le privé

Le reste INFO, ERREUR, WARNING est le degré de log, tel que défini là :

// on peut définir _LOG_FILTRE_GRAVITE dans mes_options.php

Les logs et le fichier mes_options.php

Le fichier de configuration ecrire/inc_version.php définit la taille maximale des fichiers de log. Lorsqu’un fichier dépasse la taille souhaitée, il est copié sous un autre nom, par exemple prive_spip.log.n (n s’incrémentant). Ce nombre de fichiers copiés est aussi réglable. Il est aussi possible de désactiver les logs en mettant une de ces valeurs à zéro dans mes_options.php.

$GLOBALS[’nombre_de_logs’] = 4 ; // 4 fichiers au plus
$GLOBALS[’taille_des_logs’] = 100 ; // de 100ko au plus

Une constante _MAX_LOG (valant 100 par défaut) indique le nombre d’entrées que chaque appel d’une page peut écrire. Ainsi, après 100 appels de spip_log() par un même script, la fonction ne « log » plus.

et puis

_LOG_FILTRE_GRAVITE

Cette constante définit le niveau maximal de gravité des informations à enregistrer dans les fichiers de log de SPIP.

Par défaut seuls les logs d’erreur sont enregistrés pour réduire la verbosité. Lors de la phase de développement il peut être nécessaire d’ajouter dans votre fichier config/mes_options.php

// définir le niveau maximum de verbosité des logs
define(’_LOG_FILTRE_GRAVITE’, 8) ;

L’écriture historique spip_log(’message’), sans précision du niveau reste supportée mais dépréciée.

Le niveau par défaut est dans ce cas de 5.

Les différentes valeurs de cette constante sont (du moins verbeux au plus verbeux) :

  • 0 (_LOG_HS)
  • 1 (_LOG_ALERTE_ROUGE)
  • 2 (_LOG_CRITIQUE)
  • 3 (_LOG_ERREUR)
  • 4 (_LOG_AVERTISSEMENT)
  • 5 (_LOG_INFO_IMPORTANTE)
  • 6 (_LOG_INFO)
  • 7 (_LOG_DEBUG)

Obtenir encore plus d’informations pour le debugage

  • En ajoutant dans config/mes_options.php :

Désactiver le cache de SPIP

<?php
define('_NO_CACHE', 1);
?>

ou en cliquant sur le bouton nativement présent depuis SPIP 3 : "Désactiver temporairement le cache"

Activer les rapports d’erreurs PHP

<?php
error_reporting(E_ALL^E_NOTICE);
ini_set ("display_errors", "On");
?>

Afficher toutes les erreurs dans SPIP

<?php
define('SPIP_ERREUR_REPORT',E_ALL);
?>

Augmenter la taille des logs

<?php
$GLOBALS['taille_des_logs'] = 5000;
?>

Avoir tous les logs (SPIP3)

<?php
define('_LOG_FILTRE_GRAVITE',8);
?>


Et si je meurs demain, qu’adviendra-t-il ?

La citation morbide
une citation de Georges Clemenceau, dont l’original va comme suit :

« Les cimetières sont pleins de gens irremplaçables, qui ont tous été remplacés ».

  • En prévision de mon décès, j’ai été un minimum prévoyant et pris des dispositions pour que mes proches ne soient pas démunis.
    • Mais qu’en est-il de mon projet site ?
    • Si je disparais, que deviendra-t-il ?
    • Mon œuvre est-elle vouée à disparaître ?

Certes, ce n’est pas le sujet le plus gai du site, mais il mérite un instant de réflexion. En effet, certains de nos sites personnels, sont devenus avec le temps plus que conséquents, dont certaines bénéficient d’une spécificité telle que vous êtes quasiment le seul a avoir traité le sujet.

Contrairement à un roman ou un film qui se "figent" lorsque l’auteur inscrit le mot "fin", l’œuvre intellectuelle qu’est votre site, "virtuelle" et évolutive doit s’enrichir sans cesse pour "exister", sous peine de disparaître dans le néant de la Toile.

Après 5 ou 10 ans de rédaction et quelques milliers de pages plus tard, ne souhaiteriez-vous pas que votre œuvre reste accessible au plus grand nombre, voire se perpétue et continue d’évoluer ?

Un site Internet est assimilable à une œuvre intellectuelle, il bénéficie donc des droits afférents, ainsi, après votre décès, par défaut, le site revient à vos ayant-droits : contenu, contenant, nom de domaine et nom de marque éventuellement, droits moraux.

La réalité du terrain montre que votre passion laisse totalement indifférent votre conjoint (e) et vos enfants .

Que peut-on alors envisager pour la pérennité de votre site ?

Un simple courrier du type "je lègue mon site à mon ami Martin qui saura poursuivre le travail entrepris....." ne semble pas suffisant, ni avoir de valeur juridique.

Le don du site à un tiers est toutefois possible mais devra résulter d’un acte notarié rédigé dans les règles de l’art.

« Faire don de son site à une Association Loi 1901 (crée de toute pièce à cet effet ou déjà existante) semble aussi une option intéressante. Cela ne soulève pas de difficultés techniques ou juridiques, les ayants-droits ne pourront alors revendiquer que leurs droits moraux sur l’œuvre réalisée. »

Toutefois en cas de don à une association, si votre site possède une forte valeur financière, vos ayants-droits pourraient invoquer une tentative d’appauvrissement de la succession. Cas peu probable dans notre hypothèse de départ, nos sites personnels, non commerciaux possédant plus une valeur communautaire, intellectuelle ou sentimentale que pécuniaire.

je vous rappelle qu’il convient de fournir à votre "successeur potentiel", les éléments indispensables que sont les mots de passe, login etc. pour que celui-ci puisse pérenniser votre œuvre.

Ce qui est le cas pour la plateforme, puisque tous les éléments sont accessible aux différents webmestres de l’association dans la rubrique "Team SpipFactory".

qrcode:https://spipfactory.fr/documentation-escal-spipfactory

« Personne ne se lasse d’être aidé. L’aide est un acte conforme à la nature. Ne te lasse jamais d’en recevoir, ni d’en apporter. »

puceMentions légales puce

2017-2019 © SpipFactory.fr - Tous droits réservés
Haut de page
Réalisé sous SPIP
Habillage ESCAL 4.3.20
Hébergeur : SpipFactory
Soutenir par un don