[tuto] Integre ZenPhoto dans WordPress (Créer un compte)

  • Statut : non résolu
15 sujets de 1 à 15 (sur un total de 24)
  • Auteur
    Messages
  • #448849
    dean
    Participant
    Chevalier WordPress
    487 contributions

    🙂 INTEGRER ZENPHOTO (v1.1.5) DANS WORDPRESS(v2.5.1fr) 🙂 Mis à jour le 29/04/2008

    Tuto réalisé avec :
    Wordpress : v2.5.1fr, thème WordPress Default
    Zenphoto v1.1.5, thème Default

    Logiciel de transfert (gratuit): Filezilla
    Logiciel d’édition (gratuit) : notepad++

    ***********************************************************************************************************************************
    Fichier index.php du thème default de Zenphoto.
    ***********************************************************************************************************************************
    Supprimer toutes les lignes, sauf les lignes allant de 15 à 46

    Insérez le code suivant au dessus des lignes que vous avez conservé ( lignes avant

    )
    Mettez à la place de blog ( /blog/wp-blog-header.php ) le dossier d’installation de wordpress

    Exemple:
    Si votre site est http://www.votresite.fr/wordpress alors mettez
    /wordpress/wp-blog-header.php
    Si c’est à la racine mettez ( on enlève /blog )
    /wp-blog-header.php

    Code à mettre avant

    if (!defined(‘WEBPATH’)) die(); 
    $themeResult = getTheme($zenCSS, $themeColor, ‘light’); 
    $firstPageImages = normalizeColumns(‘2’, ‘6’);
    
    require($_SERVER[‘DOCUMENT_ROOT’].’/wp-blog-header.php’);
    
    function addcss() {
    	global $_zp_themeroot;
    	global $zenCSS;
    	echo ‘<link rel="stylesheet" href="'.$zenCSS.'" type="text/css" />‘;
    	printRSSHeaderLink(‘Gallery’,’Gallery RSS’);
    	zenJavascript();
    }
    add_action(‘wp_head’, ‘addcss’);
    
    get_header();
    
    db_connect(); // reconnect to zenphoto db
    require_once(“themes/default/themeoptions.php”);?>
    <div id="content" class="narrowcolumn">

    Code à mettre aprés

    </div>
    
    <?php $wpdb->select(DB_NAME); // reconnect wordpress db ?>
    
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    ***********************************************************************************************************************************
    Fichier album.php du thème default de Zenphoto.
    ***********************************************************************************************************************************
    Supprimer toutes les lignes, sauf les lignes allant de 15 à 62

    Insérez le code suivant au dessus des lignes que vous avez conservé ( lignes avant

    )

    Code à mettre avant

    <?php 
    if (!defined('WEBPATH')) die(); 
    $themeResult = getTheme($zenCSS, $themeColor, 'light'); 
    $firstPageImages = normalizeColumns('2', '6');
    
    require($_SERVER['DOCUMENT_ROOT'].'/wp-blog-header.php');
    
    function addcss() {
    	global $_zp_themeroot;
    	global $zenCSS;
    	echo '<link rel="stylesheet" href="'.$zenCSS.'" type="text/css" />‘;
    	echo ‘<script type="text/javascript" src="'.FULLWEBPATH .'/'. ZENFOLDER.'/plugins/rating/rating.js"></script>‘;
    	echo ‘<link rel="stylesheet" href="'.FULLWEBPATH .'/'. ZENFOLDER.'/plugins/rating/rating.css" type="text/css" />‘;
    	printRSSHeaderLink(‘Album’,getAlbumTitle());
    	zenJavascript();
    }
    add_action(‘wp_head’, ‘addcss’);
    
    get_header();
    
    db_connect(); // reconnect to zenphoto db
    require_once(“themes/default/themeoptions.php”);?>
    <div id="content" class="narrowcolumn">

    Code à mettre aprés

    </div>
    
    <?php $wpdb->select(DB_NAME); // reconnect wordpress db ?>
    
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    ***********************************************************************************************************************************
    Fichier images.php du thème default de Zenphoto..
    ***********************************************************************************************************************************
    Supprimer toutes les lignes, sauf les lignes allant de 28 à 130

    Insérez le code suivant au dessus des lignes que vous avez conservé ( lignes avant

    )

    Code à mettre avant

    <?php 
    if (!defined('WEBPATH')) die(); 
    $themeResult = getTheme($zenCSS, $themeColor, 'light'); 
    $firstPageImages = normalizeColumns('2', '6');
    
    require($_SERVER['DOCUMENT_ROOT'].'/wp-blog-header.php');
    
    function addcss() {
    	global $_zp_themeroot;
    	global $zenCSS;
    	
    	echo '<link rel="stylesheet" href="'.$zenCSS.'" type="text/css" />‘;
    	echo ‘<link rel="stylesheet" href="'.FULLWEBPATH .'/'. ZENFOLDER.'/plugins/rating/rating.css" type="text/css" />‘;
    	echo ‘<link rel="stylesheet" href="'.FULLWEBPATH .'/'. ZENFOLDER.'/js/thickbox.css" type="text/css" />‘;
    	
    	echo ‘<script type="text/javascript" src="'.FULLWEBPATH .'/'. ZENFOLDER.'/plugins/rating/rating.js"></script>‘;
    	echo ‘<script type="text/javascript" src="'.FULLWEBPATH .'/'. ZENFOLDER.'/js/jquery.js"></script>‘;
    	echo ‘<script type="text/javascript" src="'.FULLWEBPATH .'/'. ZENFOLDER.'/js/thickbox.js"></script>‘;
    
    	echo ‘
    		<script type="text/javascript">
    		function toggleComments() {
    			var commentDiv = document.getElementById("comments");
    			if (commentDiv.style.display == "block") {
    				commentDiv.style.display = "none";
    			} else {
    				commentDiv.style.display = "block";
    			}
    		}
    	</script>‘;
    	
    	printRSSHeaderLink(‘Gallery’,’Gallery RSS’);
    	zenJavascript();
    }
    add_action(‘wp_head’, ‘addcss’);
    
    get_header();
    
    db_connect(); // reconnect to zenphoto db
    require_once(“themes/default/themeoptions.php”);?>
    <div id="content" class="narrowcolumn">

    Code à mettre aprés

    </div>
    
    <?php $wpdb->select(DB_NAME); // reconnect wordpress db ?>
    
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    ***********************************************************************************************************************************
    Fichier styles/light.css du thème default de Zenphoto.
    ***********************************************************************************************************************************

    Trouver ligne 16:

    body {
    background: #F5F5F3;
    margin: 0px;
    padding: 0px 0px 50px;
    text-align: center;
    }

    Remplacer par:

    /* body {
    background: #F5F5F3;
    margin: 0px;
    padding: 0px 0px 50px;
    text-align: center;
    } */
    ***********************************************************************************************************************************

    Trouver ligne 25:

    width: 685px;

    Remplacer par:

    /*width: 685px;*/

    ***********************************************************************************************************************************

    Trouver ligne 35:

    width: 640px;

    Remplacer par:

    /*width: 640px;*/

    ***********************************************************************************************************************************

    Trouver ligne 72:

    body {
    font: normal 82%/200% “Helvetica Neue”, “Lucida Grande”, Helvetica, Arial, sans-serif;
    color: #5A5A4B;
    }

    Remplacer par:

    /* body {
    font: normal 82%/200% “Helvetica Neue”, “Lucida Grande”, Helvetica, Arial, sans-serif;
    color: #5A5A4B;
    } */

    ***********************************************************************************************************************************

    Trouver ligne 175:

    .pagenav {
    clear: both;
    }

    Remplacer par:

    /* .pagenav {
    clear: both;
    } */

    ***********************************************************************************************************************************

    Trouver ligne 364:

    width: 100%;

    Remplacer par:

    width: 80%;

    ***********************************************************************************************************************************
    Fichier wp-content/themes/default/style.css du thème default de WordPress.
    ***********************************************************************************************************************************

    Trouver ligne 383:

    width: 100%;

    Remplacer par:

    width: 80%;

    RESULTAT

    Index.php

    08042903.jpg

    Album.php

    08042904.jpg

    Image.php

    08042905.jpg

    Pour ceux qui ne veulent pas faire les manips, voici le zip des fichiers modifiés:
    Veillez à bien mettre les fichiers css dans le bon répertoire…

    http://kongasiou.free.fr/integrationZp1.1.5etWp2.5.1.zip

    Dean KONG A SIOU

    http://www.Progs.fr

    http://www.zenphoto.fr

    ANCIENNES VERSIONS

    🙂 INTEGRER ZENPHOTO (v1.0.3b) DANS WORDPRESS(v2.0.4fr) 🙂

    Tuto réalisé avec :
    Wordpress : 2.0.4fr, thème WordPress Default 1.5 ( donc le thème par defaut! )
    Zenphoto 1.0.3b-fr, thème Pure Default ( aussi le thème par défaut )

    Logiciel de transfert (gratuit): Filezilla
    Logiciel d’édition (gratuit) : notepad++

    ***********************************************************************************************************************************
    okok alors commençons tout doucement ( donc sûrement 😉 )

    Vous allez créer un nouveau thème pure_default, n’ayez pas peur, nous allons faire du clonage!
    Faites une copie du thème et renommez le par exemple integration ( ou ce que vous voulez… )

    Ouvrez le fichier theme.txt, remplacez ligne 2:
    Zenphoto Pure Default par Integration ( pour différencier le nouveau thème )

    Ouvrez le fichier index.php du nouveau thème.
    Supprimez toutes les lignes, sauf les lignes allant de 15 à 46

    Insérez le code suivant au dessus des lignes que vous avez conservé ( lignes avant

    )
    Mettez à la place de blog ( /blog/wp-blog-header.php ) le dossier d’installation de wordpress

    Exemple:
    Si votre site est http://www.votresite.fr/wordpress alors mettez
    /wordpress/wp-blog-header.php
    Si c’est à la racine mettez ( on enlève /blog )
    /wp-blog-header.php

    Code à mettre avant

    <?php if (!defined('WEBPATH')) die(); ?>
    <?php require($_SERVER['DOCUMENT_ROOT'].'/blog/wp-blog-header.php'); ?>
    
    <?php
    // add the zen css to the wordpress header
    function addcss() {
      global $_zp_themeroot;
      echo '<link rel="stylesheet" href="'.$_zp_themeroot.'/zen.css" type="text/css" />‘;
    }
    add_action(‘wp_head’, ‘addcss’);
    ?>
    
    <?php get_header(); ?>
    <?php db_connect(); // reconnect to zenphoto db ?>
    <?php require_once("themes/pure_default/pure-template-functions.php");?>
    
    <div id="content" class="narrowcolumn">

    Puis le code suivant en dessous

    Code à mettre aprés

    </div>
    
    <?php $wpdb->select(DB_NAME); // reconnect wordpress db ?>
    
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    Alors ça devrait donner quelque chose comme ça si on enlève les lignes vides, en couleur 🙂

    thumb-2006100405.jpg

    Vous pouvez avoir un aperçu de l’intégration index.php ( activez votre nouveau thème, integration ), nous aurons des modifications à faire sur le css ( c’est normal que ce soit décalé ), mais on verra ça plus tard, chaque chose en son temps 😎

    bon j’ai droit à une petite pause? , j’ai faim!!!!! 😋


    Et c’est reparti !!

    Alors passons au fichier album.php ( du même thème vous l’avez deviné !, enfin on ne sait jamais…)
    Conservez les lignes de codes allant de 13 à 35

    Insérez le code suivant au dessus des lignes que vous avez conservé ( lignes avant

    )
    Mettez à la place de blog ( /blog/wp-blog-header.php ) le dossier d’installation de wordpress

    Exemple:
    Si votre site est http://www.votresite.fr/wordpress alors mettez
    /wordpress/wp-blog-header.php
    Si c’est à la racine mettez ( on enlève /blog )
    /wp-blog-header.php

    Code à mettre avant

    <?php if (!defined('WEBPATH')) die(); ?>
    <?php require($_SERVER['DOCUMENT_ROOT'].'/blog/wp-blog-header.php'); ?>
    
    <?php
    // add the zen css to the wordpress header
    function addcss() {
      global $_zp_themeroot;
      echo '<link rel="stylesheet" href="'.$_zp_themeroot.'/zen.css" type="text/css" />‘;
    }
    add_action(‘wp_head’, ‘addcss’);
    ?>
    
    <?php get_header(); ?>
    <?php db_connect(); // reconnect to zenphoto db ?>
    <?php require_once("themes/pure_default/pure-template-functions.php");?>
    
    <div id="content" class="narrowcolumn">

    Puis le code suivant en dessous

    Code à mettre aprés

    </div>
    
    <?php $wpdb->select(DB_NAME); // reconnect wordpress db ?>
    
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    Alors passons à image.php

    Conservez les ligne allant de 48 à 149

    <div id="main">
    
    	<div class="imgnav">
    		<?php if (hasPrevImage()) { ?>
    *
    *
    *
    			<?php endwhile; ?>
    			</div>
    		</div>
    	

    on recommence les ajouts

    Insérez le code suivant au dessus des lignes que vous avez conservé ( lignes avant

    )
    Mettez à la place de blog ( /blog/wp-blog-header.php ) le dossier d’installation de wordpress

    Exemple:
    Si votre site est http://www.votresite.fr/wordpress alors mettez
    /wordpress/wp-blog-header.php
    Si c’est à la racine mettez ( on enlève /blog )
    /wp-blog-header.php

    Code à mettre avant

    <?php if (!defined('WEBPATH')) die(); ?>
    <?php require($_SERVER['DOCUMENT_ROOT'].'/blog/wp-blog-header.php'); ?>
    
    <?php
    // add the zen css to the wordpress header
    function addcss() {
      global $_zp_themeroot;
      echo '<link rel="stylesheet" href="'.$_zp_themeroot.'/zen.css" type="text/css" />‘;
    }
    add_action(‘wp_head’, ‘addcss’);
    ?>
    
    <?php get_header(); ?>
    <?php db_connect(); // reconnect to zenphoto db ?>
    <?php require_once("themes/pure_default/pure-template-functions.php");?>
    
    <div id="content" class="narrowcolumn">

    Puis le code suivant en dessous

    Code à mettre aprés

    </div>
    
    <?php $wpdb->select(DB_NAME); // reconnect wordpress db ?>
    
    <?php get_sidebar(); ?>
    <?php get_footer(); ?>

    Rem: nous avons fait trois fois les mêmes insertions, veillez à bien mettre à jour le lien de votre installation de wordpress

    Maintenant nous allons passer à la mise en page ( css )

    petite pause 😎
    euh non grande pause ( dodo )
    05/10/06 14h25
    Ok Ok je reprends … jusqu’ à ce que mon fils se réveille ! 😎

    Alors

    Ouvrir le fichier zen.css de votre thème ( integration )

    trouver ligne 141

    .pagenav {
    	clear: both;
    }

    Remplacer par

    /*.pagenav {
    	clear: both;
    }*/

    trouver ligne 28

    width: 600px;

    Remplacer par

    /*width: 600px;*/

    trouver ligne 203

    .albumdesc {
    	float: right;
    	width: 480px;
    }

    Remplacer par

    /*.albumdesc {
    	float: right;
    	width: 480px;
    }*/

    trouver ligne 64

    body {
    	font: normal 82%/200% “Helvetica Neue”, Helvetica, Arial, sans-serif;
    	color: #5A5A4B;
    }

    Remplacer par

    /*body {
    	font: normal 82%/200% “Helvetica Neue”, Helvetica, Arial, sans-serif;
    	color: #5A5A4B;
    }*/

    Alors c’est presque bon, maintenat il faut modifier une valeur dans zp-config.php
    la taille de l’image

    Vers ligne 75 trouver et remplacez 595 par une plus petite valeur ( entre 300 et 450 …)

    $conf[‘image_size’] = 595;

    Et bien c’est pas trop mal tout ça 😎

    Bon, il y a encore du travail sur la mise en page, et sans doute quelques modifs à faire, mais avec ça vous pouvez avoir une galerie correct.
    Le javascript n’est pas encore mis en place dans ce tuto, vous ne pourrez donc pas vous servir de quelques fonctionnalités, je mettrais la démarche à suivre quand je l’aurais testé sur mon site.

    Si quelques ” pro ” en css peuvent me donner un coup de pouce pour arranger l’intégration…je suis preneur ( je fais un peu à taton… )

    Bon alors place aux questions, pour ceux qui ce sont lancés dans l’intégration

    Nb je ferais un thème dédié une fois que j’aurais corrigé ( grâce à votre aide ) toutes les erreurs, l’installation dans ce cas ne prendra que quelques minutes…

    Sinon vous vous pouvez voir ce que ça donne à l’adresse suivante:

    #581481
    dean
    Participant
    Chevalier WordPress
    487 contributions

    Et voilà !!!!! terminé :wp:

    #581482
    AmO
    Participant
    Maître WordPress
    4451 contributions

    Beau travail 😉

    J’éplingle 😉

    #581483
    Vincenzo
    Membre
    Initié WordPress
    9 contributions

    Fonctionne pas pour la version 2.0.7 de WordPress + ZenPhoto 1.06 la premiere étape bug.

    http://www.kipari.fr/2006100406

    j’obtien le theme, mais j’ai un bug .php

    Warning: main(themes/pure_default/pure-template-functions.php) [function.main]: failed to open stream: No such file or directory in /homepages/25/d174988310/htdocs/photos/themes/default-dark/index.php on line 25
    
    Fatal error: main() [function.require]: Failed opening required ‘themes/pure_default/pure-template-functions.php’ (include_path=’.:/usr/local/lib/php’) in /homepages/25/d174988310/htdocs/photos/themes/default-dark/index.php on line 25

    Merci ….

    De toute façon apres va faloir teste de meme sur la 2.1 de wordpress. donc voila. comme je te disai Dean dans un email un jour… je peut tester simplement pour t’aider a amélioré.. mais je ne peut corriger les erreur ne connaissant les langages helas… :(

    #581484
    teyoko
    Membre
    Initié WordPress
    1 contributions

    Salut,
    effectivement la première étape ne fonctionne pas car le code n’est plus le meme.
    J’utilise WP 2.1.1 FR + Zenphoto 1.0.7 beta

    Serait t’il possible de faire un tuto pour WP 2.1 ???
    J’ai aussi Gallery mais c’est une vrai usine a gaz ca, c’est trop puissant pour ce que je veux faire 😉

    #581485
    guest-star
    Participant
    Initié WordPress
    25 contributions

    Salut Dean,

    Excellement bien expliqué le tuto!

    Seulement voici l’erreur que je rencontre:

    Warning: main(/kunden/homepages/24/d212364777/htdocs/zenphoto/zenphoto/zen/config.php) [function.main]: failed to open stream: No such file or directory in /homepages/24/d212364777/htdocs/wp-content/plugins/zen.php on line 48

    Fatal error: main() [function.require]: Failed opening required ‘/kunden/homepages/24/d212364777/htdocs/zenphoto/zenphoto/zen/config.php’ (include_path=’.:/usr/local/lib/php’) in /homepages/24/d212364777/htdocs/wp-content/plugins/zen.php on line 48

    je suis sous WP 2.2.1 et zenphoto 1.0.1 beta.

    Cela proviendrai til d’un probleme de compatibilité?
    Merci
    Guest.

    #581486
    dean
    Participant
    Chevalier WordPress
    487 contributions

    je te conseil d’utiliser la dernière version de zenphoto

    #581487
    dean
    Participant
    Chevalier WordPress
    487 contributions

    Intégration de wordpress 2.2.2 avec zenphoto 1.0.7 (les dernières versions à ce jour)

    Je ne suis pas rentré dans les détails cette fois ci…

    Il faut au préalable avoir installé wordpress 2.2.2 et zenphoto 1.0.7

    Remplacer les fichiers index.php album.php et image.php et zen.css par les suivants (fichier rar)
    Télécharger les fichiers

    Les éditer selon votre configuration d’installation de wordpress et zenphoto

    Dans cet exemple:
    Wordpress est installé dans le dossier wordpressfr du site (www.monsite.fr/wordpressfr)
    il faut donc remplacer à la ligne 3, wordpressfr par votre répertoire d’installation

    Si WordPress est à la racine, remplacer la ligne 3 par la suivante:
    require($_SERVER.’/wp-blog-header.php’);

    dans zp-config.php de zenphoto réduisez la taille de l’image (vers ligne 82)
    ex:
    $conf = 400;

    2007082602.jpg

    2007082603.jpg

    2007082604.jpg

    #581488
    ptinutz
    Membre
    Initié WordPress
    25 contributions

    Heu tu as l’intention d’en faire la mise à niveau pour WordPress 2.3 et Zen Photo 1.1

    #581489
    dean
    Participant
    Chevalier WordPress
    487 contributions

    MISE A JOUR faite pour WordPress 2.5.1 et Zenphoto 1.1.5 (dernières versions au 29/04/2008) 😉

    #581490
    TIP
    Membre
    Initié WordPress
    49 contributions

    Est-ce toujours valable avec Zenphoto 1.2 et WordPress 2.6.2 ?

    (je préfère prévenir avant de passer des heures à chercher ce qui ne fonctionne pas, le cas échéant !!)

    #581491
    jprunner
    Membre
    Padawan WordPress
    59 contributions

    Bonjour

    juste 2 questions pour zenphoto et WP

    Quand j’installe zenphotos je dois l’installer dans le répertoire WP ou à la racine de mon site?
    Est c eque j’utilise la même base sql que WP ou une autres?

    merci beaucoup de ces renseignements

    bonne journée

    #581492
    dean
    Participant
    Chevalier WordPress
    487 contributions

    Salut,
    Je ne suis pas sûr que ce tuto fonctionne avec les dernières versions de zenphoto et wordpress, je ferais des tests.
    Sinon peu importe l’emplacement de zenphoto puisque que le script va chercher tous les liens de wordpress à partir de la racine du serveur

    #581493
    Anonyme 2
    Participant
    Maître WordPress
    10589 contributions

    Bonsoir Dean,

    Alors cela fonctionne ou pas???
    Ton site http://www.progs.fr/ est sous Drupal,tu arrêtes WordPress???

    #581494
    dean
    Participant
    Chevalier WordPress
    487 contributions

    Merci de prendre de mes nouvelles, drupal c’est plus ‘pro’, il peut fonctionner en cms et blog, mais un peu plus dur à travailler sur les modules…, je vais peut-être me remettre sur wordpress pour mettre en place une gestion xmlrpc sur air (j’ai des crises wordpress par moments…!)

15 sujets de 1 à 15 (sur un total de 24)
  • Le forum ‘Utilisation spécifique de WordPress’ est fermé à de nouveaux sujets et réponses.