Présentation de mon 1er module

[Scion Miyazaki]

Bonjour à tous,

 

J'ai décidé ce weekend de me mettre à la création de module Prestashop.

 

Donc voici la description de mon module :

 

Dynamic Advertising Block

 

 

Site de demo : Restauration des données toutes les heures*

 

Frontoffice : http://prestashop-modules.org/advertisingblock/?live_configurator_token=fbdaae832d5129c10d549e770428d6cd&id_employee=2&id_shop=1

Backoffice : http://prestashop-modules.org/advertisingblock/admin3433/

 

Login : [email protected]

Password : prestashop_demo

 

Remarque : Sur la version de démo, il est impossible d'ajouter des images dans la bibliothèque (je ne sais pas comment activer cette option donc si vous le savez n'hésitez pas   )

 

*Toutes les heures les données du site de démo seront remise à jour. Donc faites vos test en sachant ça.

 

A quoi sert ce module ? 

 

Ce module permet de rajouter des bannières publicitaire dans sa boutique PrestaShop. Il est possible de placer une bannière en haut, en bas, à droite et/ou à gauche.

 

Personnellement je n'ajoute pas de bannière sur mes sites, mes certaines personnes eux le souhaitent.

 

Petit Tuto :

 

1. Rendez vous sur le backoffice à cette adresse : http://prestashop-modules.org/advertisingblock/admin3433/

 

2. Connectez vous à l'aide des identifiants suivant :

 

Login : [email protected]

Password : prestashop_demo

 

3. Vous devez arriver sur la page des modules.

 

4. Repérer le module Dynamic Advertising Block

 

 

5. Cliquer sur Configurer

Vous devez ensuite arriver sur la page Settings du module.

 

 

6. Par défaut, toutes les pages auront les bannières définis dans Home. 

Si vous souhaitez qu'une page produit possède ses propres bannières, vous pouvez lui en ajouter.

 

Choisissez une page, par exemple le produit : T-shirts à manches courtes délavés

 

 

7. Cliquer sur Modifier

Vous arrivez sur la page d'édition.

 

8. Sur cette page, il y a 4 grandes sections :

 

- Top advertising block

- Right advertising block

- Bottom advertising block

- Left advertising block 

 

Dans un 1er temps choisissez l'endroit où vous souhaitez rajouter votre bannière.

Par exemple, si vous souhaitez rajouter une bannière à droite de la page, rendez vous dans la section : Right advertising block

 

9. Comme c'est dans cette section que l'on souhaite rajouter notre bannière, il faut activer la bannière.

Pour cela cliquer sur Oui dans l'option Active: 

 

Donc ceci ...

 

 

… va devenir …

 

 

… ça

 

 

10. Maintenant, il faut choisir quelle type d'animation on souhaite mettre sur notre bannière.

Moi, je vais choisir la easeOutExpo :

 

 

11. Choisissez ensuite la durée que va prendre votre animation pour s'exécuter.

Moi, je vais choisir 5500 millisecondes : (ce qui correspond à un peu plus de 5 secondes)

 

 

10. Choisissez ensuite le moment où votre bannière publicitaire doit apparaitre.

Moi, je veux que ma bannière apparaisse 2 secondes après que ma page soit chargé.

Je vais donc choisir : 2000 millisecondes :

 

 

11. Choisissez ensuite le moment où votre bannière publicitaire doit se fermer automatiquement.

Mo, je veux que ma bannière s'affiche 15 secondes puis qu'elle se referme automatiquement.

Je vais donc choisir : 15000 millisecondes :

 

 

12. Ajouter ensuite une image dans l'éditeur de texte en cliquant sur l'icône : 

Cette icône se trouve tout à droite de l'éditeur de texte :

 

 

13. Quand vous avez cliquez dessus, une fenêtre va s'ouvrir :

 

 

14. Dans le champs Source, rajoutez l'url de votre image :

 

 

15. Cliquer ensuite sur Ok.

L'image doit se rajouter dans votre éditeur de texte comme ceci :

 

 

16. Mettez un lien sur votre image si vous le souhaitez.

Redimensionner votre image si vous le souhaitez.

Une fois toutes vos manipulation terminé, cliquer sur Enregistrer tout en bas de la page :

 

 

17. Si l'enregistrement se passe bien, vous devez avoir le petit bandeau vert "Settings updated"

 

 

18. Pour visualiser votre travaille, cliquer sur l'icône :

 

 

19. Une nouvelle fenêtre doit s'ouvrir sur la page que vous venez de modifier :

 

 

 

Avec un peu de chance, votre bannière publicitaire s'ouvrira dans 2 secondes puis repartira dans 15 secondes.

 

20. Pour éditer une autre page, cliquer sur "Précédent"

 

 

21. Là vous pouvez rajouter d'autres bannières sur d'autres pages.

 

 

Fin 

 

 

Remarques et questions :

 

Si vous avez des questions, remarques ou autres commentaires n'hésitez pas.

C'est mon 1er module PrestaShop et je suis assez fiers de moi même s'il n'est pas parfait. 

 

 

J'attend vos remarques et retours là dessus.

Edited August 4, 2014 by Scion Miyazaki (see edit history)

[S-HAMMANI]

Bonjour:

 

C'est super !

 

une petite remarque au niveau des span.close, si tu mets un texte (avec un style transform:rotate(-90deg) pour right block et rotate(90deg) pour left block) au lieu d'une image pour deux raisons;

1- les traductions

2- si c'est possible, de basculer entre deux textes : CLOSE et OPEN au  lieu de OPEN seul.

 

à part ça je le trouve parfait !

Bonne chance

[Scion Miyazaki]

Bonjour S-HAMMANI et merci pour ton retour. 

Je mettrai mettre ça en place. 

[Scion Miyazaki]

@S-HAMMANI : tes propositions ont étés intégrés