installation d'un theme

Information importante

En raison d'un grand nombre d'inscriptions de spammers sur notre site, polluant sans relache notre forum, nous suspendons la création de compte via le formulaire de "sign up".

Il est néanmoins toujours possible de devenir adhérent•e en faisant la demande sur cette page, rubrique "Inscription" : https://www.drupal.fr/contact


De plus, le forum est désormais "interdit en écriture". Il n'est plus autorisé d'y écrire un sujet/billet/commentaire.

Pour contacter la communauté, merci de rejoindre le slack "drupalfrance".

Si vous voulez contacter le bureau de l'association, utilisez le formulaire disponible ici, ou envoyez-nous un DM sur twitter.

Submitted by marwa on

bonjour,
j'ai téléchargé un nouveau thème(danland) pour mon site. Donc j'ai besoin de modifier les slidshow de ce thème... lorsque je met une nouvelle image rien a changer et lorsque je supprime l'une image qui appartient a ce thème l'aperçu de cette image devient blanche...
alors ou je doit inséré mes images pour qu'ils soit apparaitre dans mon site.
Merci d'avance.

Forum : 
Développement

Soumis par benfarhat le 24 Avril, 2011 - 13:37

Salut marwa!
A ce que j'ai cru lire au niveau du diaporama du thème daland les images doivent avoir la dimension:[W]950px [H]355px.
sur photoshop CTRL+ALT+I (pour redimensionner) ou CTRL+ALT+C (pour couper/rogner)

ensuite dans ton fichier page.tpl.php (si tu veut avoir ton diaporama partout) ou page-front.tpl.php (si tu veux avoir le slideshow juste dans ta page d'accueil) tu devrais avoir (ou mettre) ceci

<div class="slideshow">

<img src="<?php print $base_path . $directory; ?>/images/slideshows/sea.jpg" width="950px" height="355px" alt="Slidesdhow 1"/>

<img src="<?php print $base_path . $directory; ?>/images/slideshows/noon.jpg" width="950px" height="355px" alt="Slideshow 2"/>

<img src="<?php print $base_path . $directory; ?>/images/slideshows/snow.jpg" width="950px" height="355px" alt="Slideshow 3"/>

<img src="<?php print $base_path . $directory; ?>/images/slideshows/your-image.jpg" width="950px" height="355px" alt="Slideshow 4"/> <!-- this is your image -->

</div>

donc et d'après ce code vérifie que tu as bien mis l'image que tu veut insérer dans ton diaporama sous le répertoire /images/slideshows (DE TON THEME)

D'après le code source tu n'est pas vraiment obligé de changer la dimension de l'image vu qu'elle se fait via CSS, mais le faire te permettrais d'éviter que l'image soit transformé et avoir de mauvaises surprises.
PS: si jamais ce n'est pas toi qui va t'occuper de la mise à jour et que ces images seront amenées à être changée très souvent, je te conseil de créer un petit module qui permettra au futur opérateur de mise à jour de ne pas avoir à toucher ton code source et risqué de le détériorer

Plus d'info ici
http://drupal.org/node/768350

Soumis par benfarhat le 25 Avril, 2011 - 22:26

Salut marwa!

En fait je pense que sur drupal 7 (primo) tu ne peut pas toucher au header via page.tpl.php ou page-front.tpl.php

page.tpl.php et page-front.tpl.php représente le squelette général de ton site (une sortes de vu macro) ou tu va positionner les régions que tu as défini dans ton fichier ton_thème.info

le header n'est touché que via le fichier de theming html.tpl.php, il est rare qu'on y touche sauf lorsqu'on désire par exemple faire une gestion perso des scripts, des stylesheets, des "classes", de la direction de la page (par exemple rtl pour l'arabe et ltr pour le francais), ou alors quand tu désires faires un thèmes paramètrables bref.... :) je m'enfonce la!

dans ton cas tu va toucher une partie qui est dans la page (ce qui est dans le header! on ne le "voit pas")
donc ca sera dans ton fichier page.tpl.php

la différence entre les deux page de thèmes (page.tpl.php et page-front.tpl.php) c'est que pour page.tpl.php tout ce qui est dedans sera afficher dans tout le site
ce qui est dans page-front.tpl.php ne sera afficher que dans la page d'accueil (la page dite )

donc c'est un choix que tu doit faire:

parfois on ne veut pas se casser la tête avec deux fichiers lorsque la différence entre ces deux fichiers est que dans le diaporama

donc on met le code relatif au diaporama dans le fichier page.tpl.php entre les codes suivant:

<?php if($is_front): ?>

<!-- CODE DE TON DIAPORAMA -->

<?php endif; ?>

la tu es sur que ton diaporama ne sera afficher que dans la page d'acceuil

voila! si tu veux que je soit plus précis donne moi la version de ton drupal (6.x ou 7.x)
bon travail

Benfarhat Elyes

Soumis par benfarhat le 26 Avril, 2011 - 09:27

Pour Drupal 6.x c'est dans: page-front.tpl.php

contenu du fichier:

Ligne 001 <?php
Ligne 002 // $Id: page-front.tpl.php,v 1.19 2010/07/21 06:02:15 danprobo Exp $
Ligne 003 ?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
Ligne 004   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Ligne 005 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php print $language->language ?>" lang="<?php print $language->language ?>" dir="<?php print $language->dir ?>">
Ligne 006  <head>
Ligne 007   <?php print $head; ?>
Ligne 008   <title><?php print $head_title; ?></title>
Ligne 009     <meta http-equiv="Content-Style-Type" content="text/css" />
Ligne 010   <?php print $styles; ?>
Ligne 011    <!--[if IE 6]><link rel="stylesheet" href="<?php echo $base_path . $directory; ?>/style.ie6.css" type="text/css" /><![endif]-->
Ligne 012   <?php print $scripts; ?>
Ligne 013   <script type="text/javascript">
Ligne 014 jQuery(document).ready(function($) {
Ligne 015     $('.slideshow').cycle({
Ligne 016         fx: 'fade' , timeout: 8000, delay: 2000, randomizeEffects: false, requeueOnImageNotLoaded: true, requeueTimeout:  2000});
Ligne 017 });</script>
Ligne 018 <!--[if IE 6]>
Ligne 019         <script type="text/javascript" src="<?php print $base_path . $directory; ?>/scripts/jquery.pngFix.js"></script>
Ligne 020 <![endif]-->
Ligne 021 <!--[if IE 6]>
Ligne 022 <script type="text/javascript">
Ligne 023     jQuery(document).ready(function($)  {
Ligne 024         $(document).pngFix();
Ligne 025     });
Ligne 026 </script>
Ligne 027 <![endif]-->
Ligne 028 <script type="text/javascript">
Ligne 029   jQuery(document).ready(function($) {
Ligne 030     $("#superfish ul.menu").superfish({
Ligne 031             delay:       100,                          
Ligne 032             animation:   {opacity:'show',height:'show'}, 
Ligne 033             speed:       'fast',                         
Ligne 034             autoArrows:  true,                          
Ligne 035             dropShadows: true                  
Ligne 036         });
Ligne 037   });
Ligne 038 </script>
Ligne 039  </head>
Ligne 040
Ligne 041 <body<?php print phptemplate_body_class($left, $right); ?>>
Ligne 042 <div id="header">
Ligne 043 <div id="header-wrapper">
Ligne 044         <div id="header-first">
Ligne 045           <?php if ($logo): ?>
Ligne 046           <div class="logo">
Ligne 047             <a href="<?php print $base_path ?>" title="<?php print t('Home') ?>"><img src="<?php print $logo ?>" alt="<?php print t('Home') ?>" /></a>
Ligne 048           </div>
Ligne 049           <?php endif; ?>
Ligne 050         </div><!-- /header-first -->
Ligne 051         <div id="header-middle">
Ligne 052    <?php if ($site_name) : ?><h1 class="logo-name"><a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>"><?php print $site_name; ?></a></h1><?php endif; ?>
Ligne 053                <?php if ($site_slogan) : ?><div class='logo-text'><?php print $site_slogan; ?></div><?php endif; ?>
Ligne 054         </div><!-- /header-middle -->
Ligne 055         <div id="search-box">
Ligne 056           <?php print $search_box; ?>
Ligne 057         </div><!-- /search-box -->
Ligne 058
Ligne 059    <div id="authorize">
Ligne 060       <ul><?php global $user; if ($user->uid != 0) { print '<li class="first">' .t('Logged in as '). '<a href="' .url('user/'.$user->uid). '">' .$user->name. '</a></li>'; print '<li><a href="' .url('logout'). '">' .t('Logout'). '</a></li>'; } else { print '<li class="first"><a href="' .url('user'). '">' .t('Login'). '</a></li>'; print '<li><a href="' .url('user/register'). '">' .t('Register'). '</a></li>'; } ?></ul>
Ligne 061     <?php print $feed_icons; ?>
Ligne 062   </div>
Ligne 063
Ligne 064       </div><!-- /header-wrapper -->
Ligne 065
Ligne 066 </div> <!-- /header -->
Ligne 067 <div style="clear:both"></div>
Ligne 068 <div id="menu">
Ligne 069 <div id="rounded-menu-left"></div>
Ligne 070  <?php if ($primary_links || $superfish_menu): ?>
Ligne 071       <!-- PRIMARY -->
Ligne 072       <div id="<?php print $primary_links ? 'nav' : 'superfish' ; ?>">
Ligne 073         <?php
Ligne 074                        if ($primary_links) {
Ligne 075                  print theme('links', $primary_links);
Ligne 076                      }
Ligne 077                     elseif (!empty($superfish_menu)) {
Ligne 078                      print $superfish_menu;
Ligne 079                      }
Ligne 080         ?>
Ligne 081       </div> <!-- /primary -->
Ligne 082     <?php endif; ?>
Ligne 083 <div id="rounded-menu-right"></div>
Ligne 084 </div> <!-- end menu -->
Ligne 085 <div style="clear:both"></div>
Ligne 086
Ligne 087 <div id="slideshow-wrapper">
Ligne 088 <div class="slideshow-inner">
Ligne 089 <div id="slideshow-preface">
Ligne 090  <?php if ($preface): ?>
Ligne 091           <div id="preface">
Ligne 092             <?php print $preface; ?>
Ligne 093           </div><!-- /preface -->
Ligne 094  <?php endif; ?>
Ligne 095 </div>
Ligne 096 <?php if ($mission) : ?><div id="slideshow-bottom">
Ligne 097 <div id="mission"><?php print $mission; ?></div></div><?php endif; ?>
Ligne 098 <div class="slideshow">
Ligne 099 <img src="<?php print $base_path . $directory; ?>/images/slideshows/sea.jpg" width="950" height="355" alt="slideshow 1"/>
Ligne 100 <img src="<?php print $base_path . $directory; ?>/images/slideshows/noon.jpg" width="950" height="355" alt="slideshow 2"/>
Ligne 101 <img src="<?php print $base_path . $directory; ?>/images/slideshows/snow.jpg" width="950" height="355" alt="slideshow 3"/>
Ligne 102 </div>
Ligne 103 </div>
Ligne 104 </div>
Ligne 105
Ligne 106  <?php if($preface_first || $preface_middle || $preface_last) : ?>
Ligne 107     <div style="clear:both"></div>
Ligne 108     <div id="preface-wrapper" class="in<?php print (bool) $preface_first + (bool) $preface_middle + (bool) $preface_last; ?>">
Ligne 109           <?php if($preface_first) : ?>
Ligne 110           <div class="column A">
Ligne 111             <?php print $preface_first; ?>
Ligne 112           </div>
Ligne 113           <?php endif; ?>
Ligne 114           <?php if($preface_middle) : ?>
Ligne 115           <div class="column B">
Ligne 116             <?php print $preface_middle; ?>
Ligne 117           </div>
Ligne 118           <?php endif; ?>
Ligne 119           <?php if($preface_last) : ?>
Ligne 120           <div class="column C">
Ligne 121             <?php print $preface_last; ?>
Ligne 122           </div>
Ligne 123           <?php endif; ?>
Ligne 124       <div style="clear:both"></div>
Ligne 125     </div>
Ligne 126     <?php endif; ?>
Ligne 127
Ligne 128 <div style="clear:both"></div>
Ligne 129 <div id="wrapper">
Ligne 130 <?php if ($left): ?>
Ligne 131            <div id="sidebar-left" class="sidebar">
Ligne 132                 <?php print $left ?>
Ligne 133            </div>
Ligne 134      <?php endif; ?>
Ligne 135 <div id="content">
Ligne 136            <?php if ($content_top) : ?><div class="content-top"><?php print $content_top; ?></div>
Ligne 137             <?php endif; ?>
Ligne 138             <?php if (!$is_front) print $breadcrumb; ?>
Ligne 139             <?php if ($show_messages) { print $messages; }; ?>
Ligne 140          <?php if ($tabs) : ?><div class="tabs"><?php print $tabs; ?></div><?php endif; ?>
Ligne 141             <?php if ($title) : ?><h1 class="title"><?php print $title; ?></h1><?php endif; ?>
Ligne 142            <?php print $help; ?>
Ligne 143             <?php if ($content) : ?><div class="content-middle"><?php print $content; ?></div>
Ligne 144            <?php endif; ?>
Ligne 145             <?php if ($content_bottom) : ?><div class="content-bottom"><?php print $content_bottom; ?></div>
Ligne 146            <?php endif; ?>
Ligne 147
Ligne 148 </div> <!-- end content -->
Ligne 149
Ligne 150 <?php if ($right): ?>
Ligne 151           <div id="sidebar-right" class="sidebar">
Ligne 152                <?php print $right; ?>
Ligne 153          </div>
Ligne 154      <?php endif; ?>
Ligne 155 <div style="clear:both"></div>
Ligne 156 </div> <!-- end wrapper -->
Ligne 157
Ligne 158
Ligne 159 <?php if($bottom_first || $bottom_middle || $bottom_last) : ?>
Ligne 160     <div style="clear:both"></div>
Ligne 161     <div id="bottom-teaser" class="in<?php print (bool) $bottom_first + (bool) $bottom_middle + (bool) $bottom_last; ?>">
Ligne 162           <?php if($bottom_first) : ?>
Ligne 163           <div class="column A">
Ligne 164             <?php print $bottom_first; ?>
Ligne 165           </div>
Ligne 166           <?php endif; ?>
Ligne 167           <?php if($bottom_middle) : ?>
Ligne 168           <div class="column B">
Ligne 169             <?php print $bottom_middle; ?>
Ligne 170           </div>
Ligne 171           <?php endif; ?>
Ligne 172           <?php if($bottom_last) : ?>
Ligne 173           <div class="column C">
Ligne 174             <?php print $bottom_last; ?>
Ligne 175           </div>
Ligne 176           <?php endif; ?>
Ligne 177       <div style="clear:both"></div>
Ligne 178     </div>
Ligne 179     <?php endif; ?>
Ligne 180
Ligne 181
Ligne 182  <?php if($bottom_1 || $bottom_2 || $bottom_3 || $bottom_4) : ?>
Ligne 183     <div style="clear:both"></div><!-- Do not touch -->
Ligne 184     <div id="bottom-wrapper" class="in<?php print (bool) $bottom_1 + (bool) $bottom_2 + (bool) $bottom_3 + (bool) $bottom_4; ?>">
Ligne 185           <?php if($bottom_1) : ?>
Ligne 186           <div class="column A">
Ligne 187             <?php print $bottom_1; ?>
Ligne 188           </div>
Ligne 189           <?php endif; ?>
Ligne 190           <?php if($bottom_2) : ?>
Ligne 191           <div class="column B">
Ligne 192             <?php print $bottom_2; ?>
Ligne 193           </div>
Ligne 194           <?php endif; ?>
Ligne 195           <?php if($bottom_3) : ?>
Ligne 196           <div class="column C">
Ligne 197             <?php print $bottom_3; ?>
Ligne 198           </div>
Ligne 199           <?php endif; ?>
Ligne 200           <?php if($bottom_4) : ?>
Ligne 201           <div class="column D">
Ligne 202             <?php print $bottom_4; ?>
Ligne 203           </div>
Ligne 204           <?php endif; ?>
Ligne 205       <div style="clear:both"></div>
Ligne 206     </div><!-- Bottom -->
Ligne 207     <?php endif; ?>
Ligne 208
Ligne 209 <div style="clear:both"></div>
Ligne 210 <div id="footer-wrapper">
Ligne 211 <div id="footer">
Ligne 212  <?php print $footer; ?>
Ligne 213 </div>
Ligne 214 <?php if($footer_message || $secondary_links) : ?>
Ligne 215 <div id="subnav-wrapper">
Ligne 216  <ul><li><?php print $footer_message; ?></li>
Ligne 217 <li><?php if (isset($secondary_links)) : ?><?php print theme('links', $secondary_links, array('class' => 'links', 'id' => 'subnav')); ?><?php endif; ?></li></ul>
Ligne 218 </div>
Ligne 219 <?php endif; ?>
Ligne 220 </div> <!-- end footer wrapper -->
Ligne 221
Ligne 222 <div style="clear:both"></div>
Ligne 223 <div id="notice"><p>Theme by <a href="http://www.danetsoft.com">Danetsoft</a> and <a href="http://www.danpros.com">Danang Probo Sayekti</a> inspired by <a href="http://www.maksimer.no">Maksimer</a></p></div>
Ligne 224 <?php print $closure; ?>
Ligne 225 </body>
Ligne 226 </html>

et donc toi tu touches ce fichier (qui est dans le repertoire du thème) les lignes suivante:

16 : pour changer les attributs de ton diaporama
99-101 : pour modifier ou rajouter des images a ton diaporama (fait attention a bien mettre les images dans le bon répertoire
et 223 : pour rajouter des infos de copyright te concernant (ainsi que la ligne 196 dans le fichier page.tpl.php du même répertoire)

Bonne continuation

BenFarhat Elyes

Soumis par benfarhat le 26 Avril, 2011 - 09:29

Pour Drupal 6.x c'est dans: page-front.tpl.php

contenu du fichier:

Ligne 001 <?php
Ligne 002 // $Id: page-front.tpl.php,v 1.19 2010/07/21 06:02:15 danprobo Exp $

...

Ligne 013   <script type="text/javascript">
Ligne 014 jQuery(document).ready(function($) {
Ligne 015     $('.slideshow').cycle({
Ligne 016      fx: 'fade' , timeout: 8000, delay: 2000, randomizeEffects: false, requeueOnImageNotLoaded: true, requeueTimeout:  2000});
Ligne 017 });</script>

...

Ligne 098 <div class="slideshow">
Ligne 099 <img src="<?php print $base_path . $directory; ?>/images/slideshows/sea.jpg" width="950" height="355" alt="slideshow 1"/>
Ligne 100 <img src="<?php print $base_path . $directory; ?>/images/slideshows/noon.jpg" width="950" height="355" alt="slideshow 2"/>
Ligne 101 <img src="<?php print $base_path . $directory; ?>/images/slideshows/snow.jpg" width="950" height="355" alt="slideshow 3"/>
Ligne 102 </div>
Ligne 103 </div>
Ligne 104 </div>
Ligne 105
.....
Ligne 221
Ligne 222 <div style="clear:both"></div>
Ligne 223 <div id="notice"><p>Theme by <a href="http://www.danetsoft.com">Danetsoft</a> and <a href="http://www.danpros.com">Danang Probo Sayekti</a> inspired by <a href="http://www.maksimer.no">Maksimer</a></p></div>

...

et donc toi tu touches ce fichier (qui est dans le répertoire du thème) les lignes suivante:

16 : pour changer les attributs de ton diaporama
99-101 : pour modifier ou rajouter des images a ton diaporama (fait attention a bien mettre les images dans le bon répertoire
et 223 : pour rajouter des infos de copyright te concernant (ainsi que la ligne 196 dans le fichier page.tpl.php du même répertoire)

Bonne continuation

BenFarhat Elyes

Soumis par DROMZEE le 1 Novembre, 2011 - 00:26

Merci pour ces infos!

J'ai bien réussi à créer ma propre séquence de slideshows.
Toutefois, je dispose d'une configuration multisites et je n'arrive pas à trouver comment préciser un répertoire cible d'images pour que le slideshows soit différent sur chaque site):
- modifier le code mais où
- j'ai placé les images dans le répertoire image du dossier files de chaque site

Si vous avez des pistes ... merci d'avance