Qu’est-ce qu’un hotspot ?<\/h2>\n\n
Un point chaud est une marque plac\u00e9e sur l’image pour attirer l’attention de l’utilisateur sur une partie sp\u00e9cifique de l’image. Ils sont g\u00e9n\u00e9ralement utilis\u00e9s dans les boutiques en ligne pour fournir \u00e0 l’utilisateur des liens vers les produits qu’il voit sur une photo promotionnelle. Les points d’information sont souvent accompagn\u00e9s d’infobulles qui affichent des informations suppl\u00e9mentaires. Ce guide vous montrera comment placer des points d’information sur les images de votre site web en utilisant les<\/strong> widgets JetTricks<\/strong>.<\/p>\n\n Allez sur votre bureau et trouvez la page ou le message o\u00f9 vous souhaitez ajouter une image avec des points de donn\u00e9es. Modifiez-le avec Elementor. Recherchez le widget Hotspots<\/strong> dans le menu des widgets sur le c\u00f4t\u00e9 gauche. Faites-le glisser et d\u00e9posez-le sur la page.<\/p>\n\n Choisissez l’image que vous souhaitez utiliser comme base pour vos points de donn\u00e9es. Il est pr\u00e9f\u00e9rable de prendre des photos en haute r\u00e9solution et de bonne qualit\u00e9 si vous voulez que cette partie de la page soit vraiment belle.<\/p>\n\n Comme vous pouvez le voir, un point de donn\u00e9es est cr\u00e9\u00e9 par d\u00e9faut et plac\u00e9 au centre de l’image. Allez dans la section Hotspots<\/strong> et cliquez sur Element#1<\/strong>.<\/p>\n\n Tout d’abord, vous pouvez ici modifier le contenu<\/strong> ou la position d’<\/strong> un point d’acc\u00e8s. Vous devriez probablement commencer par le contenu<\/strong>.<\/p>\n\n Pour modifier la position<\/strong>, vous disposez de deux curseurs : Position horizontale (%<\/strong> ) et Position verticale (%<\/strong>). Vous pouvez d\u00e9placer le point de donn\u00e9es en faisant glisser un curseur horizontalement ou \u00e9crire les valeurs en pourcentage.<\/p>\n\n Vous pouvez ajouter (ou dupliquer un point existant) autant de points de donn\u00e9es que vous le souhaitez, il vous suffit de cliquer sur le bouton“Ajouter un \u00e9l\u00e9ment”<\/strong>. En outre, vous pouvez s\u00e9lectionner l’un des effets d’animation, qui sera appliqu\u00e9 \u00e0 tous les points chauds. Il existe 6 types d’animation<\/strong> qui s’affichent en “mode veille”, lorsque l’utilisateur ne survole pas l’image.<\/p>\n\n Comme indiqu\u00e9 ci-dessus, le texte \u00e0 afficher en tant qu’info-bulle doit \u00eatre saisi dans la zone de texte Description<\/strong> de l’\u00e9l\u00e9ment Hotspot<\/strong>. Voici d’autres param\u00e8tres de personnalisation.<\/p>\n\n Allez dans l’onglet Style<\/strong> et modifiez le design des points chauds et des infobulles selon vos go\u00fbts et vos besoins.<\/p>\n\n Lorsque tous les param\u00e8tres sont d\u00e9finis, actualisez la page et regardez l’image dans l’interface. Placez le curseur sur le point de donn\u00e9es et l’infobulle appara\u00eetra imm\u00e9diatement.<\/p>\n","protected":false},"featured_media":30901,"template":"","meta":{"_seopress_robots_primary_cat":"","_seopress_titles_title":"","_seopress_titles_desc":"","_seopress_robots_index":"","_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"default","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}}},"class_list":["post-41013","elementor-adedemy","type-elementor-adedemy","status-publish","has-post-thumbnail","hentry"],"uagb_featured_image_src":{"full":["https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/Hotspots-JetTricks-Crocoblock-JetPlugins-1.jpg?strip=all&quality=92&webp=92&avif=92",1901,948,false],"thumbnail":["https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/Hotspots-JetTricks-Crocoblock-JetPlugins-1-150x150.jpg?strip=all&quality=92&webp=92&avif=92",150,150,true],"medium":["https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/Hotspots-JetTricks-Crocoblock-JetPlugins-1-300x150.jpg?strip=all&quality=92&webp=92&avif=92",300,150,true],"medium_large":["https:\/\/lacolmenatecnologica.com\/wp-content\/uploads\/2021\/07\/Hotspots-JetTricks-Crocoblock-JetPlugins-1-768x383.jpg",768,383,true],"large":["https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/Hotspots-JetTricks-Crocoblock-JetPlugins-1.jpg?strip=all&quality=92&webp=92&avif=92",1901,948,true],"1536x1536":["https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/Hotspots-JetTricks-Crocoblock-JetPlugins-1-1536x766.jpg?strip=all&quality=92&webp=92&avif=92",1536,766,true],"2048x2048":["https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/Hotspots-JetTricks-Crocoblock-JetPlugins-1.jpg?strip=all&quality=92&webp=92&avif=92",1901,948,true]},"uagb_author_info":{"display_name":"La Colmena Tecnol\u00f3gica","author_link":"https:\/\/lacolmenatecnologica.com\/fr\/author\/"},"uagb_comment_info":0,"uagb_excerpt":"Dans ce tutoriel, vous apprendrez \u00e0 ajouter des points de donn\u00e9es \u00e0 n’importe quelle image en utilisant les fonctionnalit\u00e9s du module compl\u00e9mentaire JetTricks. Qu’est-ce qu’un hotspot ? Un point chaud est une marque plac\u00e9e sur l’image pour attirer l’attention de l’utilisateur sur une partie sp\u00e9cifique de l’image. Ils sont g\u00e9n\u00e9ralement utilis\u00e9s dans les boutiques en…","_links":{"self":[{"href":"https:\/\/lacolmenatecnologica.com\/fr\/wp-json\/wp\/v2\/elementor-adedemy\/41013","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/lacolmenatecnologica.com\/fr\/wp-json\/wp\/v2\/elementor-adedemy"}],"about":[{"href":"https:\/\/lacolmenatecnologica.com\/fr\/wp-json\/wp\/v2\/types\/elementor-adedemy"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lacolmenatecnologica.com\/fr\/wp-json\/wp\/v2\/media\/30901"}],"wp:attachment":[{"href":"https:\/\/lacolmenatecnologica.com\/fr\/wp-json\/wp\/v2\/media?parent=41013"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}1 \u00c9tape : Choisir l’image<\/h2>\n\n
![\"\"](\"https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/hotspot-widget-elementor-1.jpg?strip=all&quality=92&webp=92&avif=92\")
<\/figure><\/div>\n\n![\"JetTricks](\"https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/hotspot-widget-elementor-2-1.jpg?strip=all&quality=92&webp=92&avif=92\")
<\/figure><\/div>\n\n2 \u00c9tape : Choisir l’image<\/h2>\n\n
![\"JetTricks](\"https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/hotspot-widget-elementor-3-1.jpg?strip=all&quality=92&webp=92&avif=92\")
<\/figure><\/div>\n\n![\"JetTricks](\"https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/hotspot-widget-elementor-4-1.jpg?strip=all&quality=92&webp=92&avif=92\")
<\/figure><\/div>\n\n3 \u00c9tape : Configuration de l’infobulle<\/h2>\n\n
![\"JetTricks](\"https:\/\/e6xg7yg7k87.exactdn.com\/wp-content\/uploads\/2021\/07\/hotspot-widget-elementor-5-1.jpg?strip=all&quality=92&webp=92&avif=92\")
<\/figure><\/div>\n\n4 \u00c9tape : Modifier les styles \u00e0 votre convenance<\/h2>\n\n