Swapan Interactive Hotspots

外掛說明

Swapan Interactive Hotspots is a lightweight, responsive WordPress plugin that allows you to draw polygon annotations and add hotspots to any image in your Media Library. Visitors can hover or tap on marked areas to reveal customizable tooltips with titles, descriptions, and links.

Built with performance in mind using native HTML5 and SVG coordinate calculations.

Key Features

  • Interactive Polygon Canvas: Draw, edit, and drag vertices of custom shapes on any image.
  • Fully Responsive Coordinates: Math calculated as percentages ensures annotations always point to the correct visual areas across all screen sizes.
  • Glassmorphic Design: Sleek modern tooltips with blur effects and smooth animations.
  • Shortcode & Block Support: Render annotated images anywhere using shortcodes or filters.

安裝方式

  1. Upload the swapan-interactive-hotspots directory to the /wp-content/plugins/ directory.
  2. Activate the plugin through the ‘Plugins’ menu in WordPress.
  3. Open any image in your WordPress Media Library, click the Edit Annotations button to begin drawing.

常見問題集

How do I display the annotated image?

You can use the shortcode [swapan_interactive_hotspots id="YOUR_ATTACHMENT_ID"] anywhere in your post content. Alternatively, the plugin automatically filters standard images embedded in your content to display annotations if they have drawn metadata.

How do I draw a shape?

Click on the image to place vertices. A line will connect your points. Click on the first red vertex to close the polygon shape. Once closed, you can customize the label, details, and color in the sidebar.

使用者評論

這個外掛目前沒有任何使用者評論。

參與者及開發者

以下人員參與了開源軟體〈Swapan Interactive Hotspots〉的開發相關工作。

參與者

將〈Swapan Interactive Hotspots〉外掛本地化為台灣繁體中文版

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄

變更記錄

1.0.0

  • Initial Release. Stable polygon drawing canvas and responsive tooltip overlays.