[Prestashop WordPress] Comment coupler WordPress à prestashop

A l’heure actuelle, il existe beaucoup de méthode pour ajouter un blog WordPress à sa boutique Prestashop, après avoir cherché sur plusieurs site, j’en ai retenue une simple, que j’ai adapté à mes besoins.

Les différentes méthodes

Pour le moment, il est plus simple d’intégrer Prestashop dans WordPress. C’est-à-dire qu’au niveau technique on va appliquer certaines modifications dans WordPress pour récupérer l’entête, le pied de page de notre site Prestashop.

1ère étape

Il faut commencer par installer WordPress, en créant un répertoire blog, dans votre répertoire Prestashop de manière à obtenir « votresiteprestashop/blog ». Si vous ne savez pas comment installer WordPress, alors je vous laisse consulter la documentation officielle. Une fois l’installation effectuée, avec l’adresse suivante http://votresiteprestashop/blog vous devriez obtenir le même genre d’affichage, un blog tout ce qu’il y a de plus standard.

2ème étape

Le but à présent est d’injecter l’entête et le pied de page de notre boutique Prestashop dans WordPress, de manière à conserver une unité entre la partie blog et la partie shop. Pour cela il faut commencer par accéder au back-office de votre blog « http://votresiteprestashop/blog/wp-admin », puis sous la section apparence, activez le thème « Twenty Ten » (j’ai essayé plusieurs méthodes avec le thème « Twenty Eleven » mais rien ne fonctionnais correctement…).

Ensuite on va modifier le fichier « index.php » situé dans votre répertoire de thème, vous pouvez copier le code suivant à l’intérieur.
Ce qu’il faut comprendre, c’est qu’on a remplacé le header et footer de WordPress par ceux de Prestashop.

<?php
displayHeader();
?>
<link rel="stylesheet" href="/style.css" type="text/css" media="screen" />
<div id="container">
<div id="content" role="main"> </div>
<!-- #content --></div>
<!-- #container -->
<?php
displayFooter();
?>

Ensuite il nous faut aussi modifier la page « single.php » qui se charge d’afficher chaque billet du blog, ici on va faire exactement la même manipulation avec presque le même code.
Copiez ce code suivant à l’intérieur.

<?php
displayHeader();
?>
<link rel="stylesheet" href="/style.css" type="text/css" media="screen" />
<div id="container">
<div id="content" role="main"> </div>
</div>
<?php
displayFooter();
?>

Regardons à présent le résultat, c’est un début, Prestashop est mixé à WordPress, mais ce n’est pas encore top au niveau de l’affichage.

3ème étape

Nous avons donc un problème d’affichage et on va le rectifier en modifiant notre fichier CSS. Mon but serait donc de conserver ma colonne de gauche pour que l’internaute puisse continuer la navigation et retirer la colonne de droite pour avoir plus de place pour le contenu du blog, ainsi que pour les différents widgets.
Comme j’ai déjà modifié la structure du fichier .css vous pouvez rajouter ceci au fichier « style.css ».

#left_column{
    display:block;
}
#right_column{
    display:none;
}
#center_column{
    width:765px;
}

On désactive simplement à l’affichage la colonne de droite, peut-être qu’en termes de performances ce n’est pas le top, mais ça permet d’être « pratique » (c’est le but de cet article).

Le résultat est plus correct n’est-ce pas ?

Le problème du W3C

Le seul problème est que cette méthode n’est pas tout à fait valide W3C, car on injecte une feuille CSS dans le body de notre site WordPress qui lui-même est inclu dans Prestashop. Si vraiment vous désirez avoir cette compatibilité, le plus simple reste d’ajouter dans le header.tpl de Prestashop, votre fichier CSS. De plus, on trouve des attributs « propriétaires » de WordPress, qui empêchent la validation W3C.

A faire sur votre boutique

N’oubliez pas de faire un lien vers votre blog dans le menu ou dans un bloc autre, car actuellement vous devez taper manuellement « votresiteprestashop/blog/ » pour accéder à votre blog.

Bilan sur l’intégration de Prestashop avec WordPress

Cette méthode relativement simple qui s’appuie sur le thème par défaut de WordPress, permet de le coupler facilement à sa boutique Prestashop. Certes les experts WordPress utiliseront peut-être des manières plus « sophistiquées » pour arriver à ce résultat, mais je trouve que cette manière de procéder est rapide et compréhensible. Ensuite il reste à modifier votre fichier style.css afin de l’accorder avec le reste de votre thème Prestashop.

Source