{"id":635,"date":"2019-10-08T08:03:19","date_gmt":"2019-10-08T08:03:19","guid":{"rendered":"https:\/\/getwid.getmotopress.com\/?page_id=635"},"modified":"2022-05-28T23:34:33","modified_gmt":"2022-05-28T23:34:33","slug":"image-hotspot-block","status":"publish","type":"page","link":"https:\/\/etwas.kaufen\/?page_id=635","title":{"rendered":"Image Hotspot WordPress Block"},"content":{"rendered":"\n<p><strong>Image Hotspot WordPress Block<\/strong> is a one-of-a-kind block for the Gutenberg library that allows for placing any number of animated markers\/tooltips over images to make them more instructive.<\/p>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-getwid-image-hotspot alignwide has-animated-dots\" data-appearance-animation=\"slideDown\" data-image-points=\"[{&quot;title&quot;:&quot;Site Header&quot;,&quot;link&quot;:&quot;https:\/\/en.wikipedia.org\/wiki\/Header&quot;,&quot;newTab&quot;:true,&quot;content&quot;:&quot;A website header sits at the top of each page and serves a few very important purposes. ... Overall, a good header makes your website easier to navigate, establishes your brand, and creates a consistent browsing experience throughout your website.&quot;,&quot;popUpOpen&quot;:false,&quot;popUpWidth&quot;:350,&quot;placement&quot;:&quot;top&quot;,&quot;position&quot;:{&quot;x&quot;:&quot;23.55%&quot;,&quot;y&quot;:&quot;24.84%&quot;},&quot;icon&quot;:&quot;&quot;,&quot;color&quot;:&quot;&quot;,&quot;backgroundColor&quot;:&quot;&quot;},{&quot;title&quot;:&quot;Menu&quot;,&quot;link&quot;:&quot;&quot;,&quot;newTab&quot;:false,&quot;content&quot;:&quot;The Site Menu appears on every page of a site. It provides a set of convenient links to make navigating your site easier.&quot;,&quot;popUpOpen&quot;:false,&quot;popUpWidth&quot;:350,&quot;placement&quot;:&quot;top&quot;,&quot;position&quot;:{&quot;x&quot;:&quot;71.27%&quot;,&quot;y&quot;:&quot;27.48%&quot;},&quot;icon&quot;:&quot;&quot;,&quot;color&quot;:&quot;&quot;,&quot;backgroundColor&quot;:&quot;&quot;},{&quot;title&quot;:&quot;Site Content&quot;,&quot;link&quot;:&quot;&quot;,&quot;newTab&quot;:false,&quot;content&quot;:&quot;Web content is the textual, &lt;a href=&amp;quot;#&amp;quot;&amp;&gt;visual&lt;\/a&gt;, or aural content that is encountered as part of the user experience on websites.&quot;,&quot;popUpOpen&quot;:false,&quot;popUpWidth&quot;:350,&quot;placement&quot;:&quot;top&quot;,&quot;position&quot;:{&quot;x&quot;:&quot;55.36%&quot;,&quot;y&quot;:&quot;62.89%&quot;},&quot;icon&quot;:&quot;&quot;,&quot;color&quot;:&quot;&quot;,&quot;backgroundColor&quot;:&quot;&quot;}]\" data-trigger=\"click\" data-theme=\"dark\" data-tooltip-animation=\"shift-toward\" data-arrow=\"true\"><div class=\"wp-block-getwid-image-hotspot__wrapper\"><img loading=\"lazy\" decoding=\"async\" width=\"1920\" height=\"1124\" src=\"http:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8.jpg\" class=\"wp-block-getwid-image-hotspot__image wp-image-275\" srcset=\"https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8.jpg 1920w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8-300x176.jpg 300w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8-1024x599.jpg 1024w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8-768x450.jpg 768w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8-1536x899.jpg 1536w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8-938x549.jpg 938w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog8-1130x662.jpg 1130w\" sizes=\"auto, (max-width: 1920px) 100vw, 1920px\" \/><div data-point-id=\"0\" class=\"wp-block-getwid-image-hotspot__dot has-animation-pulse\" style=\"left:23.55%;top:24.84%\"><div class=\"wp-block-getwid-image-hotspot__dot-wrapper\"><div class=\"wp-block-getwid-image-hotspot__dot-content\"><i class=\"fas fa-plus wp-block-getwid-image-hotspot__dot-icon\"><\/i><\/div><\/div><div class=\"wp-block-getwid-image-hotspot__dot-description\"><div class=\"wp-block-getwid-image-hotspot__dot-title\"><a href=\"https:\/\/en.wikipedia.org\/wiki\/Header\" target=\"_blank\" rel=\"noopener noreferrer\">Site Header<\/a><\/div><\/div><\/div><div data-point-id=\"1\" class=\"wp-block-getwid-image-hotspot__dot has-animation-pulse\" style=\"left:71.27%;top:27.48%\"><div class=\"wp-block-getwid-image-hotspot__dot-wrapper\"><div class=\"wp-block-getwid-image-hotspot__dot-content\"><i class=\"fas fa-plus wp-block-getwid-image-hotspot__dot-icon\"><\/i><\/div><\/div><div class=\"wp-block-getwid-image-hotspot__dot-description\"><div class=\"wp-block-getwid-image-hotspot__dot-title\">Menu<\/div><\/div><\/div><div data-point-id=\"2\" class=\"wp-block-getwid-image-hotspot__dot has-animation-pulse\" style=\"left:55.36%;top:62.89%\"><div class=\"wp-block-getwid-image-hotspot__dot-wrapper\"><div class=\"wp-block-getwid-image-hotspot__dot-content\"><i class=\"fas fa-plus wp-block-getwid-image-hotspot__dot-icon\"><\/i><\/div><\/div><div class=\"wp-block-getwid-image-hotspot__dot-description\"><div class=\"wp-block-getwid-image-hotspot__dot-title\">Site Content<\/div><\/div><\/div><\/div><\/div>\n\n\n\n<div style=\"height:50px\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>Custom tooltip point icon and background color, active tooltip by default, tooltip positioning.<\/p>\n\n\n\n<div class=\"wp-block-getwid-image-hotspot alignwide has-animated-dots\" data-appearance-animation=\"zoomIn\" data-image-points=\"[{&quot;title&quot;:&quot;Site Header&quot;,&quot;link&quot;:&quot;&quot;,&quot;newTab&quot;:false,&quot;content&quot;:&quot;A website header sits at the top of each page and serves a few very important purposes. ... Overall, a good header makes your website easier to navigate, establishes your brand, and creates a consistent browsing experience throughout your website.&quot;,&quot;popUpOpen&quot;:false,&quot;popUpWidth&quot;:350,&quot;placement&quot;:&quot;right&quot;,&quot;position&quot;:{&quot;x&quot;:&quot;38.45%&quot;,&quot;y&quot;:&quot;32.45%&quot;},&quot;icon&quot;:&quot;fab fa-apple&quot;,&quot;color&quot;:&quot;&quot;,&quot;backgroundColor&quot;:&quot;#8f4ec7&quot;},{&quot;title&quot;:&quot;Menu&quot;,&quot;link&quot;:&quot;&quot;,&quot;newTab&quot;:false,&quot;content&quot;:&quot;The &lt;a href=&amp;quot;#&amp;quot;&amp;&gt;Site Menu&lt;\/a&gt; appears on every page of a site. It provides a set of convenient links to make navigating your site easier.&quot;,&quot;popUpOpen&quot;:true,&quot;popUpWidth&quot;:&quot;300&quot;,&quot;placement&quot;:&quot;top&quot;,&quot;position&quot;:{&quot;x&quot;:&quot;75.36%&quot;,&quot;y&quot;:&quot;52.48%&quot;},&quot;icon&quot;:&quot;fab fa-amazon&quot;,&quot;color&quot;:&quot;#2c3847&quot;,&quot;backgroundColor&quot;:&quot;#f6eefc&quot;},{&quot;title&quot;:&quot;Site Content&quot;,&quot;link&quot;:&quot;&quot;,&quot;newTab&quot;:false,&quot;content&quot;:&quot;Web content is the textual, visual, or aural content that is encountered as part of the user experience on websites.&quot;,&quot;popUpOpen&quot;:false,&quot;popUpWidth&quot;:350,&quot;placement&quot;:&quot;bottom&quot;,&quot;position&quot;:{&quot;x&quot;:&quot;17.36%&quot;,&quot;y&quot;:&quot;53.73%&quot;},&quot;icon&quot;:&quot;fab fa-wordpress-simple&quot;,&quot;color&quot;:&quot;&quot;,&quot;backgroundColor&quot;:&quot;#68c5f9&quot;}]\" data-trigger=\"multiple\" data-theme=\"light-border\" data-tooltip-animation=\"shift-toward\" data-arrow=\"true\"><div class=\"wp-block-getwid-image-hotspot__wrapper\"><img loading=\"lazy\" decoding=\"async\" width=\"1920\" height=\"1124\" src=\"http:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3.jpg\" alt=\"\" class=\"wp-block-getwid-image-hotspot__image wp-image-19\" srcset=\"https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3.jpg 1920w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3-300x176.jpg 300w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3-1024x599.jpg 1024w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3-768x450.jpg 768w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3-1536x899.jpg 1536w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3-938x549.jpg 938w, https:\/\/etwas.kaufen\/wp-content\/uploads\/2019\/04\/blog3-1130x662.jpg 1130w\" sizes=\"auto, (max-width: 1920px) 100vw, 1920px\" \/><div data-point-id=\"0\" class=\"wp-block-getwid-image-hotspot__dot has-animation-pulse\" style=\"padding:12px;left:38.45%;top:32.45%;background-color:#8f4ec7\"><div class=\"wp-block-getwid-image-hotspot__dot-wrapper\"><div style=\"font-size:32px\" class=\"wp-block-getwid-image-hotspot__dot-content\"><i class=\"fab fa-apple wp-block-getwid-image-hotspot__dot-icon\"><\/i><\/div><\/div><div class=\"wp-block-getwid-image-hotspot__dot-description\"><div class=\"wp-block-getwid-image-hotspot__dot-title\">Site Header<\/div><\/div><\/div><div data-point-id=\"1\" class=\"wp-block-getwid-image-hotspot__dot has-animation-pulse\" style=\"padding:12px;left:75.36%;top:52.48%;background-color:#f6eefc\"><div class=\"wp-block-getwid-image-hotspot__dot-wrapper\"><div style=\"color:#2c3847;font-size:32px\" class=\"wp-block-getwid-image-hotspot__dot-content\"><i class=\"fab fa-amazon wp-block-getwid-image-hotspot__dot-icon\"><\/i><\/div><\/div><div class=\"wp-block-getwid-image-hotspot__dot-description\"><div class=\"wp-block-getwid-image-hotspot__dot-title\">Menu<\/div><\/div><\/div><div data-point-id=\"2\" class=\"wp-block-getwid-image-hotspot__dot has-animation-pulse\" style=\"padding:12px;left:17.36%;top:53.73%;background-color:#68c5f9\"><div class=\"wp-block-getwid-image-hotspot__dot-wrapper\"><div style=\"font-size:32px\" class=\"wp-block-getwid-image-hotspot__dot-content\"><i class=\"fab fa-wordpress-simple wp-block-getwid-image-hotspot__dot-icon\"><\/i><\/div><\/div><div class=\"wp-block-getwid-image-hotspot__dot-description\"><div class=\"wp-block-getwid-image-hotspot__dot-title\">Site Content<\/div><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Image Hotspot WordPress Block is a one-of-a-kind block for the Gutenberg library that allows for placing any number of animated markers\/tooltips over images to make them more instructive. Custom tooltip point icon and background color, active tooltip by default, tooltip positioning.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":203,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-635","page","type-page","status-publish","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/etwas.kaufen\/index.php?rest_route=\/wp\/v2\/pages\/635","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/etwas.kaufen\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/etwas.kaufen\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/etwas.kaufen\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/etwas.kaufen\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=635"}],"version-history":[{"count":1,"href":"https:\/\/etwas.kaufen\/index.php?rest_route=\/wp\/v2\/pages\/635\/revisions"}],"predecessor-version":[{"id":1186,"href":"https:\/\/etwas.kaufen\/index.php?rest_route=\/wp\/v2\/pages\/635\/revisions\/1186"}],"up":[{"embeddable":true,"href":"https:\/\/etwas.kaufen\/index.php?rest_route=\/wp\/v2\/pages\/203"}],"wp:attachment":[{"href":"https:\/\/etwas.kaufen\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=635"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}