Voilà, voilà... Fin de l'aventure...

 

Fermeture de kolossaldrupal.org dans...


Bonjour tout le monde,

Drupal évolue, les versions changent et Kolossaldrupal.org était essentiellement consacré à la version 6 de Drupal.

Autant dire que les infos présentées ici commencent à dater...

Faute de temps, je ne peux plus garder le site Kolossaldrupal à jour...

Je vous aurais bien proposé de reprendre le flambeau mais... c'est tellement simple de nos jours de se faire son propre site à soi...Pourquoi s'embêter alors ? :-)

Ce site restera donc en l'état, tel qu'il était en 2011...

Ah la la ! Cela ne nous rajeunit pas !

Manuel Vila - Avril 2016

Remplacer le titre du nœud par une image

Date du document en anglais : 27 Août 2009 - 00h07 - http://drupal.org/node/221854  



J'ai repris plus d'un site, conçus avec Dreamweaver. Le design et la mise en page étaient très beaux, et l'une des tâches dans la conversion du site vers Drupal était de conserver autant que possible son attrait visuel. L'un des éléments graphiques consistait en titres sous forme d'images. C'est ainsi que commença ma recherche sur la façon de remplacer des titres Drupal par des images. J'ai essayé plusieurs méthodes avant d'arriver à celle décrite dans le précédent article, qui m'a donné l'idée qui suit.

Vue d'ensemble : les concepts de base

Un nœud de votre site a un titre, tel que « Kolossal et Danaïdes même combat ! » et vous voulez afficher une image « kolosall_danaides_meme_combat.gif » au lieu du titre en texte. De plus, vous voulez que le titre original soit le alt text de l'image, et vous voulez une « graceful degradation » pour que le titre original en texte soit affiché si le fichier image du titre n'existe pas.

What this does is essentially make the Title field of the nodes into an special image selector - if you use a title with an associated image, the image will appear, otherwise, the text title will appear - sweet!

Exigences :

  • vous utilisez un gabarit de thème
  • vous n'êtes pas réfractaire à un peu de PHP (en fait, juste un nuage de PHP dans votre thème)

Tout le code sera placé dans votre fichier template.php.

Note : ignorez les balises d'ouverture et de fermeture de PHP. Elles ne sont là que pour des raisons d'affichage et ne doivent pas être ajoutées à votre fichier.

Pour plus d'infos sur template.php et les variables de fonctions phptemplate_variables, reportez-vous à :

Étape 1 : convertir le titre en fichier

<?php
// Apprête un titre texte pour son usage en tant que nom de fichier.
// Ote les caractères HTML spéciaux, les espaces, 
// convertit en minuscules, remplace les espaces par des
// signes souligné. 
function clean_title($string)
{
    
$cleanString htmlspecialchars_decodestrtolower(trim($string)), ENT_QUOTES );
    
$cleanString str_replace(array("& ""'"), ''$cleanString);
    return 
str_replace(' ''_'$cleanString );;
}
?>

Cette chouette petite fonction prend un titre tel que « KolossalDrupal & Danaïdes même combat ! » et le transforme en nom de fichier « kolossaldrupal_danades_meme_combat ». Puisque Drupal convertira les guillemets et l'esperluette en « caractères spéciaux » (par exemple, $#039; ou $amp) il les extraira en premier. Puis il s'en débarrassera (car ils sont très courants dans les titres) et remplacera les espaces résultants par des signes souligné.

Cette fonction peut être modifiée pour personnaliser comme il vous convient les titres en noms de fichier. Selon les titres utilisés dans votre site, vous voudrez peut-être élargir les substitutions réalisées ici. En utilisant par exemple des expressions rationnelles pour repérer et modifier des motifs (telle que preg_replace("/[^a-zA-Z0-9]/", "", $string) ), c'est un peu moins rapide mais d'usage plus large.

Étape 2 : faire les substitutions - code snippets

Nous avons besoin du file system path (pour vérifier si le fichier existe) et de l'URL (pour créer la balise image) pour l'image titre.

Note : indiquez la bonne extension de fichier et le bon chemin pour vos images titres - les miennes sont .gif, qui se trouvent dans files/images/titles.

<?php
       
// convertit un titre en nom de fichier utilisable et 
        // obtient l'URL et le file system path .
       
$titleFile clean_title($vars['title']) . '.gif';
       
$titleImage base_path() . "files/images/titles/" $titleFile;
       
$titleURL "http://" $_SERVER['SERVER_NAME'] . $titleImage;
       
$titlePath $_SERVER['DOCUMENT_ROOT'] . $titleImage;
?>

N'effectuez la substitution que si l'image appropriée peut être trouvée. Utilisez $vars['title'] comme texte alternatif de la balise image, et mettez cette balise dans $vars['title'] :

<?php
       
// Vérifie si une image titre existe et fait la
       // substitution
        
if ( file_exists($titlePath) ) {
          
$newTitle '<img alt=\'' $vars['title'] .'\' src=\'' $titleURL .'\' />';
          
$vars['title'] = $newTitle;
       }
      }
?>

Quelques améliorations :

Restreignez la portée des substitutions - voir l'article précédent qui l'explique en détail :

<?php
    
// Ne substitue les titres que pour les nodes...
    
if (arg(0) == 'node' && is_numeric(arg(1))) {
      
$node node_load(arg(1)); 
      
// ... d'un type listé.
      
if (in_array($node->type, array('page'))) {
// convertit un titre en nom de fichier utilisable et 
// obtient l'URL et le file system path .
        
...
?>

Sauvegardez le titre original pour l'utiliser dans le head et le fil d'ariane :

<?php
    $vars
['breadcrumb_title'] = $vars['title'];
    
$vars['head_title'] = $vars['title'];
?>

Étape 3 : tout rassembler

Dans Drupal 5 :

<?php
function _phptemplate_variables($hook$vars = array()) {
  switch (
$hook) {
    case 
'page':
    
// substitute node title with an image, if a suitable replacement can be found.
    // save original title text for use in head and breadcrumb.
    
$vars['breadcrumb_title'] = $vars['title'];
    
$vars['head_title'] = $vars['title'];
    
// Substitute title only for nodes...
    
if (arg(0) == 'node' && is_numeric(arg(1))) {
      
$node node_load(arg(1)); // (expensive, unless arg(1) is already loaded, which is should be at this point.)
      // ... of one of the listed types - add node types to process to the array.
     
if (in_array($node->type, array('page'))) {
        
// convert title to suitable filename and derive both file system path and URL.
        
$titleFile clean_title($vars['title']) . '.gif';
       
$titleImage base_path() . "files/images/titles/" $titleFile;
       
$titleURL "http://" $_SERVER['SERVER_NAME'] . $titleImage;
       
$titlePath $_SERVER['DOCUMENT_ROOT'] . $titleImage;
       
// $vars['title'] = $titleURL;   // DEBUG - see what's being produced
       // Determine if a suitable replacement image for title can be found, and make substitution.
        
if ( file_exists($titlePath) ) {
          
$newTitle '<img alt=\'' $vars['title'] .'\' src=\'' $titleURL .'\' />';
          
$vars['title'] = $newTitle;
       }
      }
    }
    break;
  } 
  return 
$vars;
}
?>

Dans Drupal 6 :

<?php
// afc/template.php
// Prepare some general title text for use as a file name.
// Remove special HTML characters, trim whitespace, convert to lower-case
// repace spaces with underscores.
function clean_title($string)
{
    
$replace_chars = array("&"":"",""'");
    
$cleanString htmlspecialchars_decodestrtolower(trim($string)), ENT_QUOTES );
    
$cleanString str_replace($replace_chars""$cleanString);
    return 
str_replace(' ''_'$cleanString );;
}

function 
mytheme_preprocess_page(&$variables) {
// substitute node title with an image, if a suitable replacement can be found.
// save original title text for use in head and breadcrumb.
$variables['breadcrumb_title'] = $variables['title'];
$variables['head_title'] = $variables['title'];
// Substitute title only for nodes...
     
$titleFile clean_title($variables['title']) . '.png';
     
$titleImage base_path() . path_to_theme() . "/images/titles/" $titleFile;
     
$titleURL "http://" $_SERVER['SERVER_NAME'] . $titleImage;
     
$titlePath $_SERVER['DOCUMENT_ROOT'] . $titleImage;
     
//$variables['title'] = $titleURL;   // DEBUG - see what's being produced
     // Determine if a suitable replacement image for title can be found, and make substitution.
      
if ( file_exists($titlePath) ) {
        
$newTitle '<img alt="' $variables['title'] .'" src="' $titleURL .'" />';
       
$variables['title'] = $newTitle;
     }
}
?>