Documentation programmeur

Afficher un visuel dans une colonne

vendredi 24 juillet 2015
Rédaction antérieure : mardi 28 avril 2015
par  Philippe Giron
popularité : 13%
1 vote

Il est possible d’afficher un ou plusieurs visuels dans les colonne de gauche (dite colonne « navigation ») et de droite (dite colonne « extra ») comme par exemple « Rencontrer Jésus ». Ce dernier visuel a été développé par la CEF pour améliorer le référencement du mot « Jésus » et par là celui des sites catholiques.
Par défaut le visuel « Rencontrer Jésus » et celui pour le « Denier de l’Église » sont affichés sur tous les sites mutualisés SPIP du diocèse.
La proposition est aussi faite pour les sites non mutualisés, libres à eux de les afficher ou pas.

Pour afficher des visuels sans modifier le squelette des pages, on utilise une fonctionnalité appelée les pipelines [1]. Nous ne décrirons ici que la façon dont ceux-ci sont utilisés, toujours dans la cadre de sites utilisant les squelettes Sarka-SPIP.

Le schéma qui suit explique la façon de faire :

Le principe est le suivant :

  • mes_options.php contient un pipeline qui définit l’ajout de code en haut de la colonne extra.
  • dans chaque site mutualisé, un répertoire /perso contient le code de l’ajout, c’est le fichier inc_colonne_droite.html
  • ce fichier contient lui-même la liste des visuels à ajouter (ce qui permet d’en faire varier le nombre)
  • la rubrique /squelettes/perso contient aussi les visuels à rajouter.

Fichier mes_options.php

Ce fichier se trouve dans le répertoire /config sous la racine internet22.catholique.fr.
Le fichier comporte les lignes suivantes (La ligne commençant par // indique qu’il s’agit d’un commentaire) :

Cette ligne fait référence à un fichier perso/inc_colonne_droite.html qui ajoute du code en haut de la colonne « extra ».

Contenu du fichier inc_colonne_droite.html

Ce fichier va contenir tous les codes d’insertion des différents visuels que l’on veut afficher, par exemple, à titre indicatif :

Chacun de ces INCLURE correspond à un fichier sous /perso. Le nom du fichier comporte l’extension .html qui n’apparait pas dans le INCLURE.
Cette écriture est expliquée dans la page INCLURE d’autres squelettes de la documentation SPIP.
/perso : répertoire contenant les fichiers
inc_rencontrer_jesus : « noisette » contenant le code d’insertion du visuel Rencontrer Jésus.
inc_denier « noisette » contenant le code d’insertion du visuel sur le Denier de l’Eglise.
inc_rcf : « noisette » contenant le code d’insertion du visuel RCF
inc_page_FB : « noisette » contenant le code d’insertion du bouton Facebook « J’aime » (modifié) pour les sites qui ont une page Facebook.

Création des codes d’insertions

Visuel Rencontrer Jésus

Le fichier comporte le code suivant, il faudra ensuite l’insérer dans un répertoire que nous appellerons /perso, sous la racine.

Le logo du visuel (ici jesus_178.jpg) doit se trouver dans le répertoire /squelettes/images.

Visuel Denier de l’Eglise

Si on ne veut l’afficher que sur la page d’accueil,on teste si on est dans cette page ou pas avec #ENV. Exemple :

Le logo du visuel (ici denier_2015.jpg) doit se trouver dans le répertoire /squelettes/images

Visuel RCF

Le logo du visuel (ici logo_rcf_2015_178.jpg) doit se trouver dans le répertoire /squelettes/images

Visuel d’un bouton d’une page Facebook

Code

Le code est le suivant, il est un peu modifié du badge obtenu à partir de la page de création des badges « J’aime » de Facebook.
Il y a un seul fichier pour lequel on passera des paramètres selon la page. Ce fichier s’appellr inc_page_FB.html

Les paramètres à passer sont :

  • param1  : URL de la page
  • param2  : titre de la page
  • param3  : lien vers le logo de la page (soit dans /squelettes/perso/images, soit le logo du site web ../IMG/siteon0.extension avec extension = jpg ou gif ou png selon les cas.

Styles associés

Exemple de résultat

Visuels dans la colonne dite « extra » (colonne de droite a priori)
Le visuel est un lien qui renverra sur le site concerné.


[1Sous Sarka-SPIP on a une extension de ces pipelines : http://www.sarka-spip.net/spip.php?….


Commentaires

Bouton Facebook Bouton Contact image Jésus


Bannière denier

Facebook

Facebook

Facebook

Agenda

<<

2018

 

<<

Avril

>>

Aujourd’hui

LuMaMeJeVeSaDi
2627282930311
2345678
9101112131415
16171819202122
23242526272829
30123456