Afficher un visuel dans une colonne
Extrait du Internet 22
http://www.internet22.catholique.fr/Afficher-un-visuel-dans-une
Documentation programmeur
Afficher un visuel dans une
colonne
- Formation
- Formation à SPIP
- Documentation programmeur SPIP
- Modifications sur tous les sites SPIP mutualisés
-
Date de mise en ligne : vendredi 24 juillet 2015
Date de parution : 28 avril 2015
Description :
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.
Copyright © Internet 22 - Tous droits réservés
Copyright © Internet 22 Page 1/7
Afficher un visuel dans une colonne
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 :
internet22.catholique.fr<!-- Site de base de la mutualisation -->
/config<!-- Répertoire -->
/mes_options.php<!-- Fichier et son contenu-->
<?php<!-- Contenu de fichier -->
// Ajout de visuels dans les colonnes - Modification du (date)
define('_PERSO_COLONNE_EXTRA_DEBUT','perso/inc_colonne_droite')
define('_PERSO_COLONNE_NAVIDATION_DEBUT','perso/inc_colonne_gauche')
?>
/sites<!-- Répertoire contenant les sites mutualisés -->
/perso<!-- Répertoire des fichiers personnalisés -->
inc_colonne_droite.html<!-- Fichier appelant les noisettes de la colonne droite -->
<INCLUDE{fond=perso/inc_visuel_col_droite_1}> <INCLUDE{fond=perso/inc_visuel_col_droite_2}>
<INCLUDE{fond=perso/inc_page_FB_col_droite_1}
{param1="URL_page_FB_col_droite_1"}
{param2="Titre_page_FB_col_droite_1"}
{param3=".Logo_page_FB_col_droite_1"}> inc_colonne_gauche.html<!-- Fichier appelant les noisettes de
la colonne gauche--> <INCLUDE{fond=perso/inc_visuel_col_gauche_1}>
<INCLUDE{fond=perso/inc_visuel_col_gauche_2}>
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.
Copyright © Internet 22 Page 2/7
Afficher un visuel dans une colonne
Le fichier comporte les lignes suivantes (La ligne commençant par // indique qu'il s'agit d'un commentaire) :
<?php
// Ajouts de visuels dans la colonne extra - modification du (mettre la date)
define('_PERSO_COLONNE_EXTRA_DEBUT', 'perso/inc_colonne_droite');
?>
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 :
<INCLURE{fond=perso/inc_rencontrer_jesus}> <INCLURE{fond=perso/inc_denier}> <INCLURE{fond=perso/inc_rcf}>
<INCLURE{fond=inc_page_FB}{param1="URL_page"}{param2="Titre_page"}{param3="URL_logo_page"}>
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.
[(#REM) <!-- Noisette Rencontrer Jésus -->][image Jésus]
Le logo du visuel (ici jesus_178.jpg) doit se trouver dans le répertoire /squelettes/images.
Copyright © Internet 22 Page 3/7
Afficher un visuel dans une colonne
Visuel Denier de l'Eglise
[(#REM) <!-- Noisette Denier de l'Eglise -->][Bannière denier]
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 :
[(#ENV{page}|=={sommaire}|oui)[image Jésus]
[Bannière denier]
]
Le logo du visuel (ici denier_2015.jpg) doit se trouver dans le répertoire /squelettes/images
Visuel RCF
[(#REM) <!-- Noisette RCF-->][Bannière 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
<!-- Visuel Facebook -->
[Facebook]
[#ENV{param2}] #ENV{param2}
<!-- Fin Visuel Facebook -->
Copyright © Internet 22 Page 4/7
Afficher un visuel dans une colonne
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
Copyright © Internet 22 Page 5/7
1 / 7 100%
La catégorie de ce document est-elle correcte?
Merci pour votre participation!

Faire une suggestion

Avez-vous trouvé des erreurs dans linterface ou les textes ? Ou savez-vous comment améliorer linterface utilisateur de StudyLib ? Nhésitez pas à envoyer vos suggestions. Cest très important pour nous !