Comment a été réalisé le site du collège ?

dimanche 29 septembre 2013 , par Julien Delmas

Suite à de nombreux courriels d’autres webmestres pour savoir comment le site a été réalisé (et notamment certains détails de personnalisation), je viens de rédiger cet article.

Ce site internet repose uniquement sur des outils libre et gratuits. En voici le détail :

Le CMS

  • Le CMS utilisé est SPIP en version 3, qui est un outil français, très répandu sur internet pour les sites éducatifs, mais pas seulement.

Le squelette, thème ou apparence

  • nous utilisons le squelette ScolaSpip qui est une production du CRDP de l’académie de Versailles, un outil pratique, moderne, personnalisable et tout spécialement développé pour les établissements scolaires.

Les plugins

  • Agenda  : gère les événements de l’agenda
  • AnythingSlider : gère le défilement des articles en page d’accueil. Voir l’article qui explique sa mise en place
  • Court-circuit : affiche automatiquement l’article d’une rubrique qui n’en comporte qu’un seul.
  • Crayons : permet d’éditer les articles directement sur la page publique (pour un administrateur déjà authentifié)
  • En onglets dans le texte : découpe la page en onglets, comme sur la page "Espace profs"
  • Gestion des mentions légales : dépendance de ScolaSpip, facilite la saisie des mentions légales.
  • Intégration d’activités de géométrie : intègre dans les articles les fichiers Geogebra, comme dans cet article.
  • Lecteur Multimédia : lit vidéos et sons dans les articles
  • Mini Calendrier : affiche un mini-agenda en page d’accueil.
  • Notation : propose aux visiteurs de donner une note aux articles
  • Odt2Spip : permet d’importer des fichiers ODT (LibreOffice ou OpenOffice) pour les convertir automatiquement en article en conservant les principaux éléments de mise en forme, ainsi que les images, tableaux et formules mathématiques.
  • Palette : facilite le choix des couleurs dans la personnalisation de ScolaSpip.
  • Panorama 360° : affiche les photos panoramiques dans la rubrique "Visite virtuelle".
  • PDF.JS : affiche les fichiers PDF directement dans les articles, comme dans cet article
  • Piwik : l’outil incontournable de statistiques (lié à un serveur Piwik).
  • ScolaSpip : déjà vu plus haut, il apporte toute l’apparence au site.
  • Social tags : propose de partager l’article en cours sur des sites de réseaux sociaux
  • SPIP Bonux : apporte des fonctionnalités complémentaires. Indispensable pour plusieurs plugins.
  • Splickrbox : affiche des photos avec un effet d’agrandissement sur la page d’accueil.
  • Zpip-dist v1 : dépendance de ScolaSpip.

La personnalisation

  • Le cadre qui fait défiler les articles sélectionnés en page d’accueils’appuie sur le plugin AnythingSlider et quelques paramétrages que vous trouverez sur le WikiTice académique
  • L’affichage automatique du seul article d’une rubrique. Il est absurde d’afficher le contenu d’une rubrique lorsqu’elle ne contient qu’un seul article. Le plugin Court-circuit permet d’automatiser cela et ainsi d’économiser des clics inutiles aux visiteurs.
  • Les icônes et logos proviennent pour la plupart de sites proposant des ressources libres et gratuites, comme OpenClipArt et Open Icon Library.
  • L’affichage des PDF directement dans les articles se fait grâce au plugin PDF.JS en utilisant le code suivant (1770 correspondant au numéro du document joint) :
    <lecteurpdf1770|largeur=700>

Dans la même rubrique