Cette page contient une liste des exemples de modifications fréquemment demandées sur le forum d'aide de Coppermine. Les mots ainsi que les éléments supplémentaires peuvent différer de ceux que l'utilisateur veut ajouter. La plupart des utilisateurs cherchent les informations sur comment ajouter de la publicité (comme Google adsense) à un endroit particulier.
Nous pensons que vous avez lu et compris ce qui concerne les bases des thèmes dans Coppermine: donc, vous devez savoir ceci
Cette section explique comment ajouter du contenu additionnel à différentes places dans les affichages de Coppermine. La plupart des utilisateurs veulent afficher des publicités comme contenu additionnel, comme Google adsense ou Adbrite (comme c'est visible sur Yahoo ou ebay).
Comme exemple, nous allons ajouter une petite phrase du genre "votre contenu personnalisé". Vous pouvez bien entendu le remplacer par tout code HTML/JavaScript que vous souhaitez. Ce document ne va pas expliquer comment ajouter le code spécifique HTML pour ces programmes de publicité, ni expliquer comment ils fonctionnent. Il y a de meilleures pages sur le web pour trouver ces informations.
Modifications qui auront un impact sur l'affichage de la page des vignettes.
<!-- BEGIN row_separator -->
</tr>
<tr>
<!-- END row_separator -->
et remplacez par
<!-- BEGIN row_separator -->
</tr>
<tr>
<td colspan="{$CONFIG['thumbcols']}">
Votre contenu personnalisé
</td>
</tr>
<tr>
<!-- END row_separator -->
C'est un Mod plus avancé qui requière plus de modifications. Ce qu'il fait est plus subtil: il n'ajoute pas une ligne ou une colonne entière à la page des vignettes, mais remplace une des vignettes sur chaque page de vignettes par une cellule avec votre contenu personnalisé (votre publicité).
Ouvrez themes/votretheme/theme.php utilisez un éditeur de texte, trouvez $template_thumbnail_view puis modifiez comme expliqué ci-dessous. Si $template_thumbnail_view n'existe pas dans votre thème, il vous faudra copier la section d'abord depuis le thème sample.<!-- END spacer -->et ajoutez juste après (dans une nouvelle ligne)
<!-- BEGIN advert -->
<td valign="top" class="thumbnails" width ="{CELL_WIDTH}" align="center">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td align="center">
Votre contenu personnalisé
</td>
</tr>
</table>
</td>
<!-- END advert -->
Ensuite vous devrez modifier la définition de la fonction pour la fonction nommée theme_display_thumbnails. Dans themes/votretheme/theme.php, trouvez function theme_display_thumbnails comme indiqué ci-dessous. Si cette section particulière n'existe pas dans votre thème, copiez la définition de fonction depuis le thème sample. Pour ce faire, copiez tout ce qui se trouve à partir de (et incluant)
/******************************************************************************
** Section <<<theme_display_thumbnails>>> - START
******************************************************************************/
jusqu'à (et y compris)
/******************************************************************************
** Section <<<theme_display_thumbnails>>> - END
******************************************************************************/
dans une nouvelle ligne avant ?> de themes/votretheme/theme.phpstatic $spacer = '';et ajoutez dans une nouvelle ligne après
static $advert = '';
$spacer = template_extract_block($template_thumbnail_view, 'spacer');et ajoutez dans une nouvelle ligne juste après
$advert = template_extract_block($template_thumbnail_view, 'advert');
$thumbcols = $CONFIG['thumbcols'];et ajoutez dans une nouvelle ligne juste après
$thumbrows = $CONFIG['thumbrows'];
foreach($thumb_list as $thumb) {
et ajoutez avant dans une nouvelle ligne
// Start modification "random table cell ad"
$number_of_thumbs = count($thumb_list);
$advert_position = rand(0,$number_of_thumbs-1);echo template_eval($thumb_cell, $params);et remplacez cette ligne par
// Add the advert cell
if (defined('DISPLAY_ADS_FOR_META_ALBUMS') || is_numeric($aid) == TRUE) {
$display_advert = 1;
} else {
$display_advert = 0;
}
if ($i == $advert_position && $mode == 'thumb' && $display_advert == 1) {
if ($number_of_thumbs < $thumbcols * $thumbrows) { // We have room to display
// the extra advert cell
//print_r($thumb_list);
$thumb_list[($number_of_thumbs+1)] = $thumb;
echo template_eval($advert, $params);
} else { // We do not have room for the extra advert cell,
// so we'll have to replace one (i.e. drop the
// content of the thumb that should usually reside
// here without the ad)
echo template_eval($advert, $params);
}
} else {
echo template_eval($thumb_cell, $params);
}Vous devez vous assurez de faire ces modifications très attentivement. Il est préférable de sauvegarder votre fichier personnalisé theme.php avant au cas ou quelque chose irait mal, de manière à pouvoir revenir en arrière au cas ou.
L'affichage de la page displayimage.php - La page qui montre les images intermédiaires, inclue dans l'aspect général de votre site, est la page qui retiendra le plus l'attention des visiteurs, puisque vous les avez incité à cliquer sur les vignettes sur les pages précédentes pour arriver à la vue des images intermédiaires. Sur cette page, vous pouvez afficher facilement de la publicité et vous aurez certainement un bon "retour sur clic", mais soyez attentif: le site contient déjà pas mal d'informations - l'encombrer avec de plus en plus de contenu peut devenir dangereux, le visiteur peut se sentir submergé et partir.
Ces instructions s'appliquent pour tout contenu additionnel qui devrait être placé au-dessus, en-dessous ou juste à côté (à droite ou à gauche) de l'image intermédiaire inclue dans votre page. gardez à l'esprit que la place à droite et à gauche risque d'être très petite, en fonction de la résolution d'écran de vos visiteurs et de la taille de vos images intermédiaires, il est donc préférable d'ajouter votre contenu additionnel plutôt au dessus ou en dessous.
Ouvrez themes/votretheme/theme.php, trouvez la définition de variable pour $template_display_media et modifiez-la comme expliqué ci-dessous. Si cette définition n'existe pas dans votre thème, copiez la d'abord depuis le thème sample, puis modifiez la. <tr>
<td align="center" class="display_media" nowrap="nowrap">
<table cellspacing="2" cellpadding="0" >
<tr>
<td align="center" style="{SLIDESHOW_STYLE}">
{IMAGE}
</td>
</tr>
</table>
</td>
</tr>
Modifiez uniquement le contenu de la table pour que cela corresponde à vos souhaits. Pour ajouter du contenu en dessous, vous aurez à changer ces lignes en
<tr>
<td align="center" class="display_media" nowrap="nowrap">
<table cellspacing="2" cellpadding="0" >
<tr>
<td align="center" style="{SLIDESHOW_STYLE}">
{IMAGE}
</td>
<td align="center" style="{SLIDESHOW_STYLE}">
Votre contenu personnalisé
</td>
</tr>
</table>
</td>
</tr>
Ces instructions s'appliquent à tout contenu additionnel qui devra se placer avant ou après le négatif de film sur la page si l'option correspondante "voir le négatif de film" est activé dans la configuration de Coppermine.
Ouvrez themes/votretheme/theme.php, trouvez la définition de fonction pour theme_display_film_strip et modifiez-la comme indiqué ci-dessous. Si cette section n'existe pas dans votre thème, vous devrez la copier d'abord depuis le thème sample avant de la modifier. echo '<div id="filmstrip">';
starttable($CONFIG['picture_table_width']);
echo template_eval($template, $params);
endtable();
echo '</div>';
Pour ajouter votre contenu additionnel juste avant le négatif de film, vous devrez changer cette portion de code comme ceci
echo '<div id="filmstrip">';
echo <<< EOT
Votre contenu personnalisé
EOT;
starttable($CONFIG['picture_table_width']);
echo template_eval($template, $params);
endtable();
echo '</div>';
La fenêtre pop-up qui s'affiche lorsque vous cliquez sur l'image intermédiaire peut aussi contenir du contenu additionnel (comme de la publicité). Toutefois, vous devrez vérifier s’il reste assez de place sur l'écran pour ajouter plus de contenu. En d'autres termes: n'affichez du contenu additionnel dans la fenêtre pop-up que si vos images originales ont une dimension inférieure à la résolution minimale de l'écran de vos visiteurs. Si vous ne pouvez affirmer de manière sure quelle est cette taille, vous pouvez considérer 800 x 600 pixels comme un minimum. Rappelez vous aussi qu'avec les téléphones portables ou autres appareils mobiles ayant accès à internet, vous ne serez jamais sur qu'il n'y a pas de résolution plus petite.
Si vous devez placer une publicité dans la fenêtre pop-up des images originales, utilisez de la publicité textuelle plutôt qu'une bannière. Cet avertissement dit, voici comment ajouter du contenu additionnel à la fenêtre pop-up des images originales:
Ouvrez themes/votretheme/theme.php, trouvez// Display the full size image function theme_display_fullsize_pic()et modifiez cette définition de fonction comme indiqué ci-dessous. Si cet élément de code n'existe pas dans votre thème, copiez la définition de fonction depuis le thème sample, à partir de
/****************************************************************************** ** Section <<<theme_display_fullsize_pic>>> - START ******************************************************************************/et se terminant par
/****************************************************************************** ** Section <<<theme_display_fullsize_pic>>> - END ******************************************************************************/Pour ajouter le code Adsense ou tout autre contenu personnalisé, ajoutez-le là ou vous le souhaitez dans la section HTML du code mentionné ci-dessus, exemple, juste après la balise de fermeture du conteneur div.
$winsizeX = $CURRENT_PIC_DATA['pwidth'] + $CONFIG['fullsize_padding_x']; //the +'s are the mysterious FF and IE paddings
$winsizeY = $CURRENT_PIC_DATA['pheight'] + $CONFIG['fullsize_padding_y']; //the +'s are the mysterious FF and IE paddings
Modifiez comme vous le souhaitez - vous devrez augmenter la valeur des variables de la valeur de l'espace en pixel nécessaire à votre ajout. Par exemple: si vous décidez d'ajouter votre code Adsense en haut de la fenêtre pop-up et que la publicité utilise 200 pixels, changez
$winsizeX = $CURRENT_PIC_DATA['pwidth'] + $CONFIG['fullsize_padding_x']; //the +'s are the mysterious FF and IE paddings
$winsizeY = $CURRENT_PIC_DATA['pheight'] + $CONFIG['fullsize_padding_y']; //the +'s are the mysterious FF and IE paddings
en
$winsizeX = $CURRENT_PIC_DATA['pwidth'] + $CONFIG['fullsize_padding_x']; //the +'s are the mysterious FF and IE paddings
$winsizeY = $CURRENT_PIC_DATA['pheight'] + $CONFIG['fullsize_padding_y'] + 200; //the +'s are the mysterious FF and IE paddings
<!-- BEGIN menu_item_name -->et
<!-- END menu_item_name -->Bien que cela ressemble à de simples commentaires HTML qui ne seront pas affichés dans le navigateur, ils sont là pour une raison: avec eux, Coppermine détermine si un élément de menu en particulier, doit être traité. Le script de Coppermine (ce qui est écrit en PHP et n'est donc pas «masqué» dans la mesure où les commentaires HTML sont concernés) est à la recherche de ces blocs de commentaires (avec les mots-clés BEGIN et END suivie par le nom de l'élément du menu, qui est un mot-clé aussi bien dans ce processus). L'intérieur de chaque bloc de code correspond à un élément de menu, vous pouvez voir l’espace réservé au symbole aussi bien que les accolades qui seront remplacés par du contenu réel lorsque le menu est effectivement transformée – vous en saurez plus sur cela plus tard.
<!-- BEGIN home -->
<li>
<a href="{HOME_TGT}" title="{HOME_TITLE}">{HOME_LNK}</a>
</li>
<!-- END home -->
et les remplacer par
<!-- BEGIN home --> <!-- END home -->Pour ajouter effectivement un élément propre à votre menu, vous devrez ajouter un bloc de code personnalisé au bon endroit, c'est à dire que vous avez à le placer correctement dans la mesure où la nidification est concerné: il doit résider entre deux menu existants et non l'intérieur de l’un d'eux. En d'autres termes, le code de l’élément du menu personnalisé doit résider après une ligne de commentaire qui termine un menu enregistré (par exemple <!-- END contact -->) et avant une autre ligne de code qui démarre le menu enregistré suivant (par exemple <!-- BEGIN my_gallery -->). Dans notre exemple, nous voulons ajouter un lien dans le menu qui pointe vers notre forum. L'élément du menu est destiné à se manifester entre le lien et le formulaire de contact du symbole de menu suivant. Pour ce faire, trouver
<!-- END contact -->et ajouter après (dans une ligne à part)
<!-- BEGIN custom_forum_link -->
<li>
<a href="../forum/" title="go to the forum">Forum</a>
</li>
<!-- END custom_forum_link -->
Enregistrez vos modifications et téléchargez-les à partir de votre copie locale sur votre serveur web le cas échéant - vous devriez voir les changements immédiatement. Si vous êtes satisfait de ce que vous avez, vous pouvez arrêter de lire - vous venez de comprendre comment ajouter un élément de menu personnalisé à votre thème.