[MODULE] Accordéon Vertical : affichage d'une série d'images avec une animées. Compatible V 1.5 RC2

[SiteProjet]

Bonjour à tous.

 

C'est avec un grand plaisir que nous vous offrons cette seconde contribution

Nous tâcherons de publier un nouveau module chaque semaine avec un widget interactif ou une fonctionnalité inédite ou remise au goût du jour.

 

 

Ce module vous propose d'afficher 4 images dans un menu accordéon très ergonomique avec un effet d'animation en jquery. Les images sont cliquables et pointent vers les liens de votre choix.

Il s'agit d'une adaptation d'un script issu de http://web-argument.com

 

Les prochaines versions du module permettront de modifier le nombre d'images affichées, ainsi que l'effet au survol, la taille des images avant et après survol, etc...

 

 

Voir la démo du module : à cette adresse.

 

 

SPÉCIFICITÉS :

 

_ Module en français (traductions internationales à venir dans une version ultérieure).

_ Interactif et ergonomique (jquery).

_ Le module a été conçu afin d'être compatible avec un maximum de versions de prestashop. Il a actuellement été testé et est pleinement fonctionnel sur la version 1.4.8 (la dernière à ce jour), ainsi que sur la 1.5 RC2

_ Le module est dépourvu du cadre "classique" que l'on retrouve sur les blocks et permet ainsi d'apparaître de façon flottante et plus esthétique sur différents templates, y compris celui de base.

_ Ancrage : Colonne droite ou gauche

 

 

ASTUCES :

 

_ Pensez à uploader vos images sur votre serveur ou à les envoyer chez un hébergeur tel que www.monsterup.com afin de pouvoir les ajouter facilement.

_ Privilégiez une taille d'image proche de 200x240px

 

CHANGELOG :

* Version actuelle : 0.1 *

_ Mise en ligne du module.

 

SCREENSHOTS :

 

 

N'hésitez pas à nous faire part de vos remarques, critiques et suggestion

 

Cordialement,

l'équipe SiteProjet.com

blockaccordionvertical.zip

Edited August 25, 2012 by SiteProjet (see edit history)

[franckm1000]

Sympa comme effet ces images et bien pratique comme module !

 

Quelques remarques:

- Le module ne s'installe par défaut que sur la colonne de droite. Il vaudrait mieux à mon sens l'installer sur les deux colonnes et ensuite à la personne de l'enlever de la colonne qu'elle souhaite (fonction install: !$this->registerHook('leftColumn' ))

- Il serait plus sympa de proposer aux personnes de télécharger leurs images depuis leur PC. Un input file et ensuite à la lecture des résultats un move_uploaded_file pour mettre à jour l'image.

- Idéalement, il faudrait pouvoir ajouter autant d'images qu'on le veut (même si là c'est un peu plus compliqué...).

- Vous dites qu'il faut une taille "pratique". Vous pourriez éventuellement proposer de redimensionner automatiquement les images à la bonne taille.

- Les champs input sont déjà remplis, un peu de javascript pour enlever le champs inscrit quand on clique et qu'il revienne quand on clique ailleurs serait bienvenu.

 

Enfin pour le côté technique, vous utilisez la classe Configuration pour stocker les données et c'est très bien mais quand vous en avez beaucoup, une bonne astuce est de stocker les valeurs sous forme d'un tableau. Au lieu de faire:

Au lieu de faire:
Configuration::updateValue('variable1','valeur1');
Configuration::updateValue('variable2','valeur2');
...
Vous pouvez faire:
$tableau=serialize(array('valeur1','valeur2'));
Configuration::updateValue('tableau',$tableau);

Pour lire la clé:
$valeurs=unserialize(Configuration::get('tableau');
$valeur[0], $valeur[1]...

 

Si vous voulez des précision sur l'upload de fichier, en MP

Edited August 25, 2012 by franckm1000 (see edit history)

[SiteProjet]

Bonjour.

 

Merci beaucoup franck pour toutes ces remarques pleines de bon sens. Surtout concernant l'upload de fichier et l'utilisation d'un array pour stocker les valeurs. Nous allons en tenir compte et tâcher d'améliorer le module en conséquence!

[kassh]

yes! merci beaucoup!

[Fehmi135]

Un grand merci pour ce fantastique module !

[SiteProjet]

C'est véritablement un plaisir.

Nous espérons pouvoir très prochainement améliorer ce module.

 

Cordialement,

SP.

[bab45]

Merci pour ce module.

Est-il possible que lorsque l'on clique sur l'image, le lien s'ouvre dans une nouvelle page ?

J'ai regardé mais je ne trouve pas dans quel fichier faire la modif.

 

Cordialement

Carole

[aubonheurdesprix]

Merci pour ce module mais est il compatible version 1.4.6.2 merci

[SiteProjet]

Merci pour ce module. Est-il possible que lorsque l'on clique sur l'image, le lien s'ouvre dans une nouvelle page ? J'ai regardé mais je ne trouve pas dans quel fichier faire la modif. Cordialement Carole

 

Bonjour et merci pour votre retour.

Pour ouvrir les liens dans un nouvel onglet, dans le fichier "blockaccordionvertical.tpl", il vous suffit d'ajouter un morceau de code dans la balise "<a href". Ce morceau est target ="_blank"

 

Ce qui donne par exemple à la ligne 27 :

<a href="{$ACCORDIONVERTICAL_U1}"><span>{$ACCORDIONVERTICAL_T1}</span><img src="{$ACCORDIONVERTICAL_L1}" alt="http://SiteProjet.com" title="{$ACCORDIONVERTICAL_T1}" width="200" height="200" class="alignnone size-medium wp-image-806" /></a>

à remplacer par :

<a target="_blank" href="{$ACCORDIONVERTICAL_U1}"><span>{$ACCORDIONVERTICAL_T1}</span><img src="{$ACCORDIONVERTICAL_L1}" alt="http://SiteProjet.com" title="{$ACCORDIONVERTICAL_T1}" width="200" height="200" class="alignnone size-medium wp-image-806" /></a>

 

Cordialement,

SP.

 

Merci pour ce module mais est il compatible version 1.4.6.2 merci

 

Bonjour.

 

Ce module est compatible pour toutes versions 1.4 et 1.5

En cas de difficulté technique n'hésitez pas à nous faire un retour ici.

 

Cordialement,

SP.