Utile par exemple, pour afficher les liens vers les collectivités partenaires d’un lycée, ou vers des applications dédiées pour un site d’école. Voici comment procéder.

Préparation

Pour afficher une liste de liens sous forme d’images au dessus du pied de page telle que présentée sur l’image à la fin de cet article (ou en bas de chaque page de ce site), nous utiliserons l’annuaire de sites web et le plugin « Menus ».

• Activer, si ce n’est déjà fait, la gestion d’un annuaire de sites web (menu « Configuration », « Contenu du site », formulaire « Référencement de sites et syndication »).
• Activer, si ce n’est déjà fait, le plugin « Menus » (menu « Administration », « Gestion des plugins ».

Référencement des sites

Les différents sites pointés par les liens sont référencés dans l’annuaire de sites web. Nous allons donc commencer par ajouter ces sites à l’annuaire.

• Se rendre sur la page de gestion des sites web (menu « Édition », « Sites référencés »).
• Cliquer sur « Référencer un nouveau site »
• Saisir l’adresse du site à référencer. Vous pouvez utiliser le champ « Référencement automatisé d’un site » ou indiquer vous-même les informations concernant ce site.
• Enregistrez.
• Ajoutez un logo. Veiller à ce que la taille du logo ne soit ni trop grande, ni trop petite. Une taille d’environ 500px est recommandée.
• Répéter l’opération pour chacun des sites.

Création du menu

Pour créer la liste de liens, nous allons utiliser le plugin Menu.

• Se rendre sur la page de gestion des Menus (menu « Squelettes », « Menus »).
• Créer un nouveau menu
• Compléter les champs.
  Attention, le champ Identifiant du menu doit impérativement être le mot « pied », en minuscules. C’est cet identifiant qui forcera l’affichage au dessus du pied de page.
• Enregistrez.
• Cliquer sur « Ajouter une entrée de menu »
• Ajouter l’entrée « Liste de logos de sites ».
• Cliquer sur « Modifier cette entrée »
• Saisir les identifiants des sites à afficher, séparés par une virgule (,) ainsi que les dimensions des logos. Par défaut, la hauteur est prioritaire sur la largeur et est égale à 80 pixels.
• Enregistrez.

Votre liste de sites est prête.

Rendez-vous dans l’espace public et constatez. Affinez, si nécessaire les valeurs saisies dans l’entrée de menu.

Afficher un sous-menu de grande largeur (aussi appelé "Menu XL") dans la barre horizontale de navigation peut parfois être utile. Nous allons voir ici comment procéder.

Créer l’entrée principale.

Dans le menu barrenav, ajouter une entrée "Lien arbitraire"

Compléter les champs :

• Nom : Le nom que vous souhaitez donner à l’item, dans l’exemple Formations
• Adresse : Saisissez le signe # (dièse)
• Classe CSS de l’entrée (du conteneur) : menu-xl
• Classe CSS du lien : Laisser vide

Enregistrer.

Créer les colonnes.

Créer un sous-menu dans l’entrée créée, dans l’exemple Formations

Ajouter les entrées dans le sous-menu.

C’est ici que l’utilisation du système de grille Bootstrap entre en jeu. Dans le sous-menu, nous allons créer autant d’entrées "Texte libre" que nous voulons de colonnes dans le menu XL, puis pour chaque entrée, nous allons compléter le champ Nom avec le nom que nous voulons donner à la colonne et surtout, dans le champ Classe css de l’entrée (du conteneur), nous allons associer la class spanX correspondant à la largeur de colonne souhaitée.

Exemples : Le système de grille étant basé sur 12 colonnes, si nous souhaitons obtenir 4 colonnes de largeurs égales, nous allons créer 4 entrées "Texte libre" et, dans le champ Classe css de l’entrée (du conteneur) de chaque entrée, associer la classe span3 (4[colonnes] x [span]3 = 12).

Pour afficher 3 colonnes de largeurs égales, nous allons créer 3 entrées "Texte libre" et pour chaque entrée, associer la classe span4 (3[colonnes] x [span]4 = 12).

Pour afficher 3 colonnes de largeurs différentes, nous pourrons associer la classe span3 à la première entrée, puis span5 à la deuxième et span4 à la troisième ( [span]3 + [span]5 + [span]4 = 12)

Dans notre exemple, nous choisissons de créer 4 entrées CAP, BACS-PRO, BACS et BTS de largeurs égales. Nous allons donc saisir dans le champ Classe css de l’entrée (du conteneur) de chaque entrée la classe span3.

Les entrées du sous-menu principal étant créées, nous allons maintenant y ajouter pour chacune un sous-menu, puis les entrées souhaitées dans ce sous-menu.

Vous pouvez ajouter presque tous les types d’entrées, en prenant exemple sur le menu XL présent dans la barre de navigation de cette page

Vous pouvez aussi télécharger le menu et l’importer dans votre site pour ensuite, le modifier à votre guise.

Avec SPIPr-Dane, le lien « Contact » du pied de page affiche une page qui permet à vos visiteurs de trouver un contact dans l’établissement (et parfois d’envoyer des messages à un destinataire).
Nous allons voir ici comment personnaliser cette page. Plusieurs solutions sont proposées.

1/ Solution par défaut

Par défaut, la page de contact est la page de l’auteur renseigné dans le champ "Compte SPIP du webmestre" de la page de configuration du plugin Mentions légales. Cette page affiche alors un formulaire dont le destinataire est le "webmestre". Il faut pour que cela fonctionne :

• que son adresse électronique soit bien renseignée (utiliser une adresse académique, en général l’adresse de l’établissement)
• que le compte correspondant soit associé à au moins un article publié

il est néanmoins souvent pratique de mieux personnaliser la page de contact.

2/ Utiliser le plugin "Pages"

S’il ne l’est pas, activer le plugin Pages [1]

Créez une page unique (Menu Édition, Pages uniques).

• Renseignez le champ Titre avec un titre évocateur (Contacter le collège, Nous contacter, Écrivez nous, etc)
• Important : Renseignez le champ Page avec le mot contact.
• Renseignez les autres champs, notamment le champ Texte à votre guise et enregistrez.
• Important : Si vous n’êtes pas le destinataire du formulaire de contact, retirez l’auteur et ajoutez l’auteur qui doit être destinataire du formulaire. S’il n’existe pas, créez-le en lui assignant l’adresse mail destinataire (exemple, adresse fonctionnelle de l’établissement).

À ce stade, le formulaire de contact n’apparaît pas en page publique [2]. Pour cela, il va falloir configurer les noisettes spécifiques à cet article.

Cliquez sur le lien "Configurer pour ce contenu" pour ouvrir la page de gestion des noisettes spécifiques à cet article.
Ajoutez dans le bloc content, les noisettes "Contenu de l’article" et surtout, la noisette "Écrire à l’auteur".

Et voila, votre page de contact est personnalisée.

3/ Utiliser le plugin "Formidable" pour construire un formulaire

S’il ne l’est pas, activer le plugin Formidable

Une fois activé, construire un formulaire avec les traitements adaptés (envoi d’un email sur la boîte de l’établissement par exemple). Insérer le formulaire dans la page souhaitée.