Date de publication: le Lundi 19 Octobre 2009 à 15h37
Dernière modification: par Pascal BOYER le Dimanche 28 Février 2010 à 15h12
« Article précédent: eZ Publish : bpce_backupbdd - sauvegarde automatique de la base de données
» Article suivant: eZ Publish : eZ Multiupload - multitéléchargement d'objets

Cet article décrit l'installation de l'extension ezstarrating permettant aux visiteurs d'attribuer une «note» (ou une évaluation) à un article ou tout objet affichant cette extension.

Une image valant... voici à quoi ressemble cette extension:

Fig. 0: l'extension Star Rating en action

I - Contexte d'installation

Il s'agit ici de la mise en oeuvre de ezstarrating sur un site eZ Publish 4.2.0 dont l'installation initiale est réalisée sur la base du type Plain. En effet, lorsque eZ Publish est installé autour des extensions eZ Flow ou eZ Webin, alors ezstarrating fonctionne par défaut (ne reste que les droits à affecter).

Dans la suite de l'article on supposera:

• que le site public est plain_site (design/plain_site/)
• que vous avez les droits suffisants pour modifier les templates, installer des archives sur le serveur, etc...

:
L'extension Star Rating fonctionne, entre autres, avec l'extension PHP Json. Cette extension fait partie de PHP depuis la version 5.2.0. Si vous placez un script info.php à la racine de votre répertoire d'installation de eZ Publish, fichier contenant cette unique ligne:

<?php phpinfo(); ?>

son affichage doit renvoyer, en particulier, ceci:

Pour que le système ne vous renvoie pas un message d'erreur «Module non trouvé» lorsque vous essaierez d'afficher le fichier info.php (avec un URI du type http://monsite.fr/info.php) vous devez ajouter la règle de réécriture suivante au fichier de configuration du serveur Apache ou au fichier .htaccess:

RewriteRule ^info.php - [L]

II - Installation des extensions ezstarrating et ezjscore

:
La technique décrite ci-après n'est pas la seule possible. Elle présente en revanche l'avantage de découvrir, pour les non-initiés, certains aspects des tâches d'administration d'un site eZ Publish.
Par ailleurs, l'installation automatique à partir de l'interface d'administration, et pour un site de type plain, des deux packages ezstarrating_extension.ezpkg et ezjscore_extension.ezpkg s'est, dans mon cas, systématiquement soldée par un échec. Ceci explique également le choix de la procédure décrite ci-après.

Téléchargement des packages

Les deux packages ezstarrating_extension.ezpkg et ezjscore_extension.ezpkg nécessaires au bon fonctionnement de l'extension Star Rating peuvent être téléchargés à partir de cette page:

• Liste des packages associés à eZ Publish 4.2.0

:
Les packages .ezpkg ne sont rien d'autres que des archives compressés au format .tar.gz

Répertoires d'installation des packages

Le répertoire général d'installation des packages est:

/var/storage/packages/eZ-systems

Par défaut, s'y trouve déjà installé le package plain_site.ezpkg:

/var/storage/packages/eZ-systems/plain_site

On commence donc par ce rendre dans le répertoire eZ-systems/:

cd var/storage/packages/eZ-systems

Puis on crée deux répertoires dont les noms reprennent ceux des deux packages:

mkdir ezstarrating_extension

mkdir ezjscore_extension

On copie/déplace ensuite chacun des packages dans son répertoire associé:

cp <chemin de téléchargement>/ezstarrating_extension.ezpkg ezstarrating_extension/

cp <chemin de téléchargement>/ezjscore_extension.ezpkg ezjscore_extension/

Installation du package ezstarrating_extension.ezpkg

cd ezstarrating_extension/

On renomme le package:

mv ezstarrating_extension.ezpkg ezstarrating_extension.tar.gz

Puis on extrait le contenu de l'archive:

tar zxfv ezstarrating_extension.tar.gz

Installation du package ezjscore_extension.ezpkg

cd ../ezjscore_extension/

On renomme le package:

mv ezjscore_extension.ezpkg ezjscore_extension.tar.gz

Puis on extrait le contenu de l'archive:

tar zxfv ezjscore_extension.tar.gz

Affecter le bon User et Group aux nouveaux répertoires et fichiers

En accord avec les valeurs des deux directives User et Group du fichier de configuration de Apache on modifie l'utilisateur et le groupe utilisateur de l'ensemble des nouveaux répertoires et fichiers que l'on vient de créer:

cd ..

chown -R www-data:www-data ezstarrating_extension

chown -R www-data:www-data ezjscore_extension

Installer/activer les deux packages

Il faut à présent installer/activer les deux packages à partir de l'interface d'administration.

Pour cela, laissez-vous guider par la suite de captures d'écran ci-dessous:

Fig. 1: Actions successives menant au contenu par défaut du dépôt de packages de eZ Publish

Fig. 2: Les deux nouveaux packages sont présents mais pas encore installés

La figure 3 est obtenue en cliquant directement sur le nom (lien ezjscore_extension) du package:

Fig. 3: Étape 1:2 d'installation du package. Cliquez sur Installer pour poursuivre.

Fig. 4: Étape 2:2 d'installation du package. Cliquez sur Installer paquetage pour lancer l'installation de l'extension ezjscore.

:
Cette deuxième étape va créer l'extension ezjscore dans le répertoire extension/ situé à la racine du répertoire d'installation de eZ Publish.

Fig. 5: Fin de l'installation du package. Tableau récapitulatif.

La même procédure doit être appliquée au package ezstarrating_extension.

Au final, vous devez obtenir ceci:

Fig. 6: Les deux packages sont à présent installés sur le système.

Activer les extensions

Une fois les deux packages et les deux extensions ezjscore et ezstarrating installés, il est nécessaire d'activer ces dernières. La figure 7 illustre la procédure à suivre:

Fig. 7: Les 5 étapes pour activer les deux nouvelles extensions et générer les tableaux d'autochargement afférents.

Cette étape terminée, le fichier de surcharge settings/override/site.ini.append.php contient ceci:

[ExtensionSettings]
ActiveExtensions[]=ezjscore   <==== CETTE LIGNE
ActiveExtensions[]=ezmultiupload
ActiveExtensions[]=ezodf
ActiveExtensions[]=ezoe
ActiveExtensions[]=ezstarrating   <==== CETTE LIGNE
ActiveExtensions[]=powercontent
ActiveExtensions[]=texttoimage_ext

Les deux extensions sont donc activées pour l'ensemble des siteaccess publics du site.

Pour ne les activer que pour certains des siteaccess publics, il faut supprimer les deux lignes indiquées ci-dessus et les reporter dans le fichier de surcharge site.ini.append.php propre à chacun de ces siteaccess.

III - Accorder les bons droits au rôle Anonymous

L'utilisation de l'extension ezstarrating, et donc la possibilité d'évaluer un article, est subordonnée à la mise en place de droits d'accès.

Par défaut, seuls les personnes connectées (ayant créé un compte) peuvent voter.

Pour que tous les visiteurs anonymes puissent noter les articles, les droits suivants doivent être affectés au rôle Anonymous:

Fig. 8: Accès à la liste des rôles de eZ Publish

En cliquant sur le lien Anonymous on passe à l'étape suivante:

Fig. 9: Les droits en vigueur du rôle Anonymous. Pour en ajouter ou les modifier, cliquer sur Modifier.

Fig. 10: Cliquer sur Nouvelle politique de sécurité pour passer à l'étape de la figure 11

Fig. 11: Sélectionner le module ezjscore et accorder l'accès à toutes les fonctions (call + run)

Fig. 12: Les nouveaux droits ajoutés, valider en cliquant sur OK

Fig. 13: Tableau récapitulatif des droits associés au groupe Anonymous.

IV - Créer les tables

L'extension ezstarrating utilise deux nouvelles tables qu'il faut bien sûr créer:

mysql -u <user> -p<mot_de_passe> <nom_de_la_base_de_donnees> < extension/ezstarrating/sql/mysql/mysql.sql

Les deux nouvelles tables créées sont:

• ezstarrating
• ezstarrating_data

V - Modifier la classe article

Avant d'être en mesure d'afficher l'extension sur le site public, encore faut-il qu'une classe d'objet contienne un attribut basé sur le datatype Star Rating.

Pour l'exemple, nous allons modifier la classe article fournie par défaut par eZ Publish. Cette modification consiste en l'ajout d'un nouvel attribut:

Fig. 14: Accéder à la liste des classes d'objet et lancer la vue d'édition (modification) de la classe article

Fig. 15: Sélectionner le datatype Star Rating et l'ajouter

Fig. 16: Définir l'identifiant de l'attribut (ici star_rating) et valider (bouton OK)

:
Le choix de star_rating comme identifiant évite de devoir modifier par la suite le template d'affichage du datatype Star Rating.

VI - Créer un article

A présent que la classe article est modifiée, il faut créer un nouvel article:

Fig. 17: Affichage de l'attribut Sart Rating lors de l'édition du nouvel article

Par défaut, le template utilisé pour afficher les articles sur le site public:

design/base/override/templates/full/article.tpl

ne produira évidemment aucun affichage de l'extension ezstarrating.

Il faut donc commencer par ajouter (aux alentours de la ligne 35) ces trois lignes à ce template:

<div class="attribute-star-rating">
    {attribute_view_gui attribute=$node.data_map.star_rating}
</div>

Pensez à vider les caches une fois le template article.tpl modifié.

VII - Le template d'affichage du datatype Star Rating

Il s'agit du template:

extension/ezstarrating/design/plain_site/templates/content/datatype/view/ezsrrating.tpl

Pour s'assurer que le système trouve tous les templates relatifs au datatype Star Rating, on va copier l'ensemble des templates dans le design public:

cp -Rp extension/ezstarrating/design/standard/templates/content/datatype/ design/plain_site/templates/

On vide les caches et on affiche le nouvel article:

Fig. 18: Affichage de l'attribut Star Rating sans javascript, ni style CSS ni image

La figure18 illustre l'absence de trois types d'éléments nécessaires au fonctionnement correct de l'extension:

• les styles CSS
• les images
• les javascripts

La feuille de style

Il faut la copier dans le siteaccess public:

cp -p extension/ezstarrating/design/standard/stylesheets/star_rating.css design/plain_site/stylesheets/

Si on utilise le template pagelayout.tpl par défaut, à savoir:

design/base/templates/pagelayout.tpl

on remarque que celui-ci contient, dans son en-tête, les lignes suivantes:

17     {section var=css_file loop=ezini( 'StylesheetSettings', 'CSSFileList', 'design.ini' )}
18         @import url({concat( 'stylesheets/', $css_file )|ezdesign});
19     {/section}
20 </style>

indiquant qu'il recherche la liste des feuilles de styles définie dans le fichier design.ini (ou dans l'une de ses surcharges).

Donc, dans le fichier de surcharge suivant:

settings/siteaccess/plain_site/design.ini.append.php

on ajoute la ligne suivante:

[StylesheetSettings]
CSSFileList[]
CSSFileList[]=star_rating.css   <== CETTE LIGNE

:
Il est préférable de modifier ainsi la ligne 18 (voir cet article) du template pagelayout.tpl (il faut alors sortir les lignes 17, 18 et 19 des balises <style type="text/css"></style>):

18      <link rel="stylesheet" href={concat( 'stylesheets/', $css_file )|ezdesign} type="text/css" media="screen" />

Les images des étoiles

Comme pour les feuilles de styles, faire une copie des images utilisées dans le siteaccess public:

cp -p extension/ezstarrating/design/standard/images/star.gif design/plain_site/images/

Les javascripts

Dans l'en-tête du template pagelayout.tpl il faut inclure le template suivant (par exemple juste après la ligne «{include uri="design:page_head.tpl"}»):

{include uri="extension/ezjscore/design/ezwebin/templates/page_head_script.tpl"}

L'unique ligne de ce template est très importante car elle permet de télécharger tous les javascripts nécessaires au bon fonctionnement de l'extension:

1 {* Load JavaScript dependencys + JavaScriptList *}
2 {ezscript_load( ezini( 'JavaScriptSettings', 'JavaScriptList', 'design.ini' ) )}

Enfin, il faut récupérer le javascript suivant (normalement, la ligne 2 ci-dessus doit permettre d'éviter cette étape):

http://real.us.yimg.com/lib/yui/2.7.0/build/yahoo-dom-event/yahoo-dom-event.js

que l'on placera, par exemple, à la racine du répertoire design/plain_site/javascript/ (ce javascript est normalement présent dans le package ezwebin_site.ezpkg).

Ne reste plus qu'à renseigner le fichier de surcharge settings/siteaccess/plain_site/design.ini.append.php de la sorte:

[JavaScriptSettings]
JavaScriptList[]=yahoo-dom-event.js

Vider tous les caches.

Fig. 19: Résultat final !

VIII - Francisation

Les messages renvoyés par l'extension ne sont pas traduits en français. C'est donc dans le template:

design/plain_site/templates/content/datatype/view/ezsrrating.tpl

qu'il faut les modifier pour les obtenir en français.

Le code par défaut est:

{'Rating: %current_rating/5'|i18n('extension/ezstarrating/datatype', '', hash( '%current_rating', concat('<span id="ezsr_average_', $attribute.id, '" class="ezsr-average-rating">', $rating.rounded_average|wash, '</span>') ))}
({'%rating_count votes cast'|i18n('extension/ezstarrating/datatype', '', hash( '%rating_count', concat('<span id="ezsr_total_', $attribute.id, '">', $rating.rating_count|wash, '</span>') ))})
<p id="ezsr_just_rated_{$attribute.id}" class="ezsr-just-rated hide">{'Thank you for rating!'|i18n('extension/ezstarrating/datatype', 'When rating')}</p>
<p id="ezsr_has_rated_{$attribute.id}" class="ezsr-has-rated hide">{'You have already rated this page, you can only rate it once!'|i18n('extension/ezstarrating/datatype', 'When rating')}</p>
<p id="ezsr_changed_rating_{$attribute.id}" class="ezsr-changed-rating hide">{'Your rating has been changed, thanks for rating!'|i18n('extension/ezstarrating/datatype', 'When rating')}</p>

que l'on peut modifier en:

{'Note: %current_rating/5'|i18n('extension/ezstarrating/datatype', '', hash( '%current_rating', concat('<span id="ezsr_average_', $attribute.id, '" class="ezsr-average-rating">', $rating.rounded_average|wash, '</span>') ))}
({'%rating_count vote(s) exprimé(s)'|i18n('extension/ezstarrating/datatype', '', hash( '%rating_count', concat('<span id="ezsr_total_', $attribute.id, '">', $rating.rating_count|wash, '</span>') ))})
<p id="ezsr_just_rated_{$attribute.id}" class="ezsr-just-rated hide">Merci pour votre évaluation</p>
<p id="ezsr_has_rated_{$attribute.id}" class="ezsr-has-rated hide">Vous avez déjà évalué cet article. Vous ne pouvez le faire qu'une seule fois.</p>
<p id="ezsr_changed_rating_{$attribute.id}" class="ezsr-changed-rating hide">Votre évaluation à bien été modifiée.</p>

Commentaires