Widget idée cadeau Noël

De Centre Documentation PowerBoutique
Aller à : navigation, rechercher

Qu'est-ce que le widget « Idée cadeau Noël » ?

Le widget « Idée cadeau Noël » permet d'identifier de façon attractive, sur vos listes articles, des idées cadeaux, grâce à un visuel au design spécifique. Ce dernier se positionne sur chacune des images miniatures (vignettes) de vos articles que vous aurez choisis de mettre en avant pour Noël.
En pratique, les visiteurs de votre site repèrent, en un clin d’œil, vos articles mis en avant et sont ainsi davantage tentés de cliquer pour les découvrir.

N.B. : il est nécessaire de préciser, dans le marqueur affichage des articles que vous souhaitez mettre en avant, le terme "noel" pour que le ruban "Idée cadeau Noël" apparaisse automatiquement.

Voir le site démo

Voir le site démo Exemple du widget « Idée cadeau Noël »


Caractéristiques

Version minimale requise : PowerBoutique© V4.7.3
Technologies utilisées : HTML / CSS / JS
Navigateurs compatibles : Firefox.gif Chrome.gif Ie.gif Safari.gif Opera.gif
Versions : Francais.gif   Anglais.gif

Dernières modifications : le 03 aout 2015

La procédure suivante a été conçue pour vous permettre d'installer ce widget de façon autonome.
L'intégration et le fonctionnement de ce widget sont conditionnés aux intitulés des dossiers et des fichiers précisés dans cette procédure. Nous vous recommandons de ne pas les renommer.
N.B. : un widget est une extension technique d'une ou plusieurs fonctionnalités du logiciel PowerBoutique©. Les procédures de mise en place et de personnalisation ne sont pas couvertes par l’Assistance Utilisateurs.

Étapes d'intégration

  • Étape 2
    Via la fonction "Import/Export" > "Espace de stockage", créez un nouveau dossier "ideecadeaunoel" dans le dossier /site en cliquant sur le bouton "Nouveau dossier".

  • Étape 3
    Via la même page, cliquez sur le nouveau dossier /ideecadeaunoel, puis sur le bouton "Ajouter" et enfin sur "Parcourir...". Ouvrez un à un les 4 fichiers que vous avez téléchargé dans l'étape 1 et cliquez sur "OK".

  • Étape 4
    Il faut maintenant ajouter le code du widget dans le modèle liste articles de votre choix. Via la fonction "Apparence" > onglet "Outils experts - Web-design" > "Modèles liste articles", sélectionnez, dans le menu déroulant en haut à droite, "site FR" ou "site US" selon la version sur laquelle vous voulez intégrer ce widget. Sélectionnez ensuite, dans le menu déroulant des modèles de mise en page liste articles, celui que vous voulez modifier. Cliquez sur le bouton "Modifier". Dans l'écran suivant, cliquez sur l'onglet HTML et insérez le code ci-dessous (code identique pour la version FR et la version US) tout en bas du code déjà présent dans l'onglet HTML.
    Pour finir, cliquez sur "Enregistrer".

     1 <!-- DEBUT - Widget idée cadeau Noël -->
     2 
     3 <script type="text/javascript" language="javascript" src="../site/ideecadeaunoel/ideecadeaunoel.js"></script>
     4 <script type="text/javascript" language="javascript">
     5 	function startAddIdeeCadeauNoel(){addIdeeCadeauNoel('*MarqueurAffiche*','*Reference*','gauche','80px');}
     6     if(window.addEventListener){window.addEventListener("load", startAddIdeeCadeauNoel);}
     7     else{if(window.attachEvent){ window.attachEvent("onload", startAddIdeeCadeauNoel);}}
     8 </script>
     9 
    10 <!-- FIN - Widget idée cadeau Noël -->
    
    Idee cadeau noel gauche.png

    N.B. : par défaut, l'image sera positionnée dans l'angle supérieur gauche, avec une hauteur de 80px.
    Vous pouvez choisir l'angle supérieur droit ou une taille différente en suivant la procédure décrite dans la rubrique "Personnalisation du widget".



  • Étape 5
    Précisez maintenant, dans le champ marqueur affichage des articles que vous désirez mettre en avant, le terme "noel". Ce champ est accessible à la fonction "Catalogue" > "Articles" > onglet "Identification", dans les "Paramétrages avancés" (situés tout en bas de l'onglet).
    En parallèle, le modèle liste articles incluant le code de l'étape 4 doit être appliqué aux articles concernés pour que le ruban "Idée cadeau Noël" s'affiche automatiquement.

Personnalisation du widget (facultatif)

Il est possible de personnaliser l'apparence de ce widget.

Remarques concernant les extraits de codes :
Les numéros de lignes sont précisés à titre indicatif sur la base des fichiers téléchargés dans l'étape 1 d'intégration. Ces numéros peuvent varier, en fonction des modifications apportées aux fichiers ou du logiciel utilisé pour les éditer.
Les textes entourés de /* ... */ ou <! -- ... --> ou encore // ... // sont des commentaires. Ils sont là pour vous aider dans la compréhension du code. Une partie de code commentée ne sera pas visible sur votre site.

Positionner l'image dans l'angle supérieur droit
  • Par défaut, l'image est placée en superposition des visuels produits, dans l'angle supérieur gauche. Pour changer cette position, il suffit d'éditer la ligne 5 du code d'intégration.
    N.B. : le changement d'emplacement nécessite d'utiliser une autre image, mieux adaptée à l'angle choisi.
    Changez, pour cela, le mot "gauche" par le mot "droite" :

    Idee cadeau noel droite.png
    5 function startAddIdeeCadeauNoel(){addIdeeCadeauNoel('*MarqueurAffiche*','*Reference*','droite','80px');}
    



Modifier la taille de l'image
  • Par défaut, la hauteur de l'image est de 80px et sa largeur s'adapte automatiquement. Pour modifier cette hauteur, il suffit d'éditer la ligne 5 du code d'intégration.
    Voici un exemple, réalisé sur la base du positionnement par défaut (angle supérieur gauche), qui définit la hauteur du ruban à 200px :

5 function startAddIdeeCadeauNoel(){addIdeeCadeauNoel('*MarqueurAffiche*','*Reference*','gauche','200px');}


N.B. : les images fournies dans ce widget peuvent avoir une hauteur maximale de 219px. Au-delà, leur qualité sera réduite.



Services d'intégration et de personnalisation des widgets PowerBoutique©

Nos équipes sont à votre disposition pour intervenir depuis l'intégration de ce widget jusqu'à sa personnalisation complète, selon vos besoins et les spécificités de votre site.
Contactez votre consultant e-business pour en savoir plus : cliquez ici.



Cet espace de documentation vise à vous aider dans la personnalisation avancée de votre site PowerBoutique©. L'Assistance Utilisateurs PowerBoutique© ne couvre pas l'utilisation que vous pouvez faire des informations issues de cette documentation. cf. Conditions d'utilisation