{"id":395957,"date":"2026-11-09T14:45:02","date_gmt":"2026-11-09T14:45:02","guid":{"rendered":"https:\/\/wordpress.org\/plugins\/tabspot-accessible-image-hotspots\/"},"modified":"2026-11-09T14:44:43","modified_gmt":"2026-11-09T14:44:43","slug":"tabspot","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/tabspot\/","author":23596323,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"0.1.0","stable_tag":"0.1.0","tested":"7.1.4","requires":"6.8","requires_php":"7.4","requires_plugins":null,"header_name":"Tabspot \u2013 Accessible Image Hotspots","header_author":"Novica Pilipovic","header_description":"Keyboard and screen-reader accessible image hotspots for the block editor.","assets_banners_color":"","last_updated":"2026-11-09 14:44:43","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"","header_author_uri":"","rating":0,"author_block_rating":0,"active_installs":0,"downloads":26,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"0.1.0":{"tag":"0.1.0","author":"novicapilipovic","date":"2026-11-09 14:44:43","revision":3792683}},"upgrade_notice":[],"ratings":[],"assets_icons":[],"assets_banners":[],"assets_blueprints":{},"all_blocks":{"tabspot\/hotspot":{"$schema":"https:\/\/schemas.wp.org\/trunk\/block.json","apiVersion":3,"name":"tabspot\/hotspot","version":"0.1.0","title":"Tabspot Image Hotspots","category":"media","icon":"location","description":"Keyboard and screen-reader accessible image hotspots for the block editor.","keywords":["hotspot","image map","annotation","pin"],"attributes":{"imageId":{"type":"number"},"hotspots":{"type":"array","default":[]},"pinColor":{"type":"string"}},"supports":{"html":false,"align":["wide","full"]},"textdomain":"tabspot","editorScript":"file:.\/index.js","editorStyle":"file:.\/index.css","style":"file:.\/style-index.css","render":"file:.\/render.php"}},"tagged_versions":["0.1.0"],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3792681,"resolution":"1","location":"assets","locale":"","width":1280,"height":1000},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3792681,"resolution":"2","location":"assets","locale":"","width":1280,"height":1000}},"screenshots":{"1":"Placing and editing hotspots in the block editor.","2":"An open popup on the front end."}},"plugin_section":[],"plugin_tags":[1953,1220,6720,133,17341],"plugin_category":[34,50],"plugin_contributors":[291656],"plugin_business_model":[],"class_list":["post-395957","plugin","type-plugin","status-publish","hentry","plugin_tags-accessibility","plugin_tags-block","plugin_tags-hotspot","plugin_tags-image","plugin_tags-popover","plugin_category-accessibility","plugin_category-media","plugin_contributors-novicapilipovic","plugin_committers-novicapilipovic"],"banners":[],"icons":{"svg":false,"icon":"https:\/\/s.w.org\/plugins\/geopattern-icon\/tabspot.svg","icon_2x":false,"generated":true},"screenshots":[{"src":"https:\/\/ps.w.org\/tabspot\/assets\/screenshot-1.png?rev=3792681","caption":"Placing and editing hotspots in the block editor."},{"src":"https:\/\/ps.w.org\/tabspot\/assets\/screenshot-2.png?rev=3792681","caption":"An open popup on the front end."}],"raw_content":"<!--section=description-->\n<p>Add pins to an image and show a short text when a visitor activates one. Built for accessibility first:<\/p>\n\n<ul>\n<li>Every pin is a real button, reachable with Tab and opened with Enter or Space.<\/li>\n<li>Popups use the browser's native popover: Esc closes, clicking outside closes, focus returns to the pin.<\/li>\n<li>No JavaScript on the front end.<\/li>\n<li>Pin labels are read by screen readers.<\/li>\n<\/ul>\n\n<p>Most hotspot plugins don't document keyboard or screen-reader support; this one is built around it.<\/p>\n\n<p>In the editor, click the image to add a pin, drag it or use the arrow keys (Shift moves 10%) to move it. Keyboard users can also use \"Add hotspot\" in the sidebar, where each pin has a label, text and position sliders.<\/p>\n\n<p>Popups sit beside their pin in browsers that support CSS anchor positioning and are centred in the others.<\/p>\n\n<h3>Source code<\/h3>\n\n<p>The <code>build\/<\/code> folder is compiled from the <code>src\/<\/code> folder included in this plugin. To rebuild it, run <code>npm install<\/code> and then <code>npm run build<\/code>.<\/p>\n\n<!--section=installation-->\n<ol>\n<li>Upload the plugin to the <code>\/wp-content\/plugins\/<\/code> directory, or install it from the Plugins screen.<\/li>\n<li>Activate the plugin through the 'Plugins' screen.<\/li>\n<li>In the block editor, add the \"Tabspot Image Hotspots\" block and choose an image.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"does%20it%20load%20any%20javascript%20on%20the%20front%20end%3F\"><h3>Does it load any JavaScript on the front end?<\/h3><\/dt>\n<dd><p>No. Popups use the native HTML <code>popover<\/code> attribute.<\/p><\/dd>\n<dt id=\"can%20i%20put%20images%20or%20links%20in%20the%20popup%3F\"><h3>Can I put images or links in the popup?<\/h3><\/dt>\n<dd><p>Not yet. Popup content is plain text; line breaks become paragraphs.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>0.1.0<\/h4>\n\n<ul>\n<li>Release<\/li>\n<\/ul>","raw_excerpt":"Keyboard and screen-reader accessible image hotspots for the block editor.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/395957","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=395957"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/novicapilipovic"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=395957"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=395957"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=395957"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=395957"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=395957"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=395957"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}