Title: Draggable Content – create layouts visitors can move and explore
Author: bPlugins
Published: <strong>2025 年 9 月 19 日</strong>
Last modified: 2026 年 9 月 22 日

---

搜尋外掛

![](https://ps.w.org/draggable-cards/assets/banner-772x250.png?rev=3623271)

![](https://ps.w.org/draggable-cards/assets/icon.svg?rev=3623271)

# Draggable Content – create layouts visitors can move and explore

 由 [bPlugins](https://profiles.wordpress.org/bplugins/) 開發

[下載](https://downloads.wordpress.org/plugin/draggable-cards.1.0.1.zip)

 * [詳細資料](https://tw.wordpress.org/plugins/draggable-cards/#description)
 * [使用者評論](https://tw.wordpress.org/plugins/draggable-cards/#reviews)
 *  [安裝方式](https://tw.wordpress.org/plugins/draggable-cards/#installation)
 * [開發資訊](https://tw.wordpress.org/plugins/draggable-cards/#developers)

 [技術支援](https://wordpress.org/support/plugin/draggable-cards/)

## 外掛說明

**Give your pages a playful, interactive touch with content cards and badges you
can drag to the exact position you want.**

### Why Draggable Content?

Most drag-and-drop solutions are bloated page builders. **Draggable Content** is
a specialized Gutenberg block that does one thing exceptionally well: it gives you
a completely draggable content element with complete control over badge placement
through intuitive drag functionality.

Only the badge element itself is draggable – no other content is affected – so your
layout stays intact while you position elements with smooth, precise movement. Cards
can hold text, images, videos, and other media, and everything works in all modern
browsers.

### Free Features

 * **Precise Badge Dragging:** Only the badge element is draggable, so no other 
   content is affected.
 * **Exact Positioning:** Drag your badge to exact positions with smooth, precise
   movement.
 * **Flexible Content:** Cards can contain text, images, videos, or other media.
 * **Block Settings:** Control appearance and behavior from the block sidebar.
 * **Smooth Animations:** Polished animation and positioning out of the box.
 * **Browser Support:** Compatible with all modern browsers.

### How to Use – Quick Start

 1. Install the **Draggable Content** plugin from the WordPress dashboard.
 2. In the Gutenberg editor, add **Draggable Content** from the “widgets” block category.
 3. Adjust the block settings from the right-side settings sidebar.
 4. Publish and enjoy!

Did you like this plugin? Have a feature request? [Please share your feedback with us](https://tw.wordpress.org/plugins/draggable-cards/support@bplugins.com?output_format=md).

### ⭐ Check out the Parent Plugin of this plugin-

🔥 **[B Blocks](https://bblockswp.com)** – Best gutenberg blocks collections for
WordPress.

### ⭐ Check out our other WordPress Plugins-

🔥 **[Html5 Audio Player](https://bplugins.com/products/html5-audio-player)** – 
Best audio player plugin for WordPress.

🔥 **[Html5 Video Player](https://bplugins.com/products/html5-video-player)** – 
Best video player plugin for WordPress.

🔥 **[PDF Poster](https://bplugins.com/products/pdf-poster)** – A fully-featured
PDF Viewer Plugin for WordPress.

🔥 **[Document Embedder](https://bplugins.com/products/document-embedder)** – Best
WordPress Document Embedder Plugin.

🔥 **[3D Viewer](https://bplugins.com/products/3d-viewer)** – Display interactive
3D models on the webs.

🔥 **[Advanced Post Block](https://bplugins.com/products/advanced-post-block)** –
Best Post Display Plugin for WordPress.

## 螢幕擷圖

[⌊Add Draggable Content⌉⌊Add Draggable Content⌉[

Add Draggable Content

[⌊Gutenberg Settings⌉⌊Gutenberg Settings⌉[

Gutenberg Settings

[⌊Preview⌉⌊Preview⌉[

Preview

## 適用於區塊編輯器

這個外掛提供 1 個可供區塊編輯器使用的區塊。

 *   Draggable Content A block for displaying a draggable content.

## 安裝方式

**From your WordPress dashboard (recommended):**

 1. Go to **Plugins  Add New**.
 2. Search for **“Draggable Content”**.
 3. Click **Install Now**, then **Activate**.
 4. Add the **Draggable Content** block to any post or page from the Gutenberg editor.

**Manual installation:**

 1. Download the **Draggable Content** plugin (_.zip file_).
 2. In your admin area, go to **Plugins  Add New** and click **Upload Plugin**.
 3. Choose the **`draggable-content.zip`** file and click **Install Now**.
 4. Activate the plugin through the **Plugins** menu in WordPress.

## 常見問題集

### What content can I put inside a draggable card?

Cards are customizable content blocks that can contain text, images, videos, or 
other media.

### Is everything on the page draggable?

No. Only the badge element itself is draggable – no other content is affected, so
your layout stays stable.

### Does it work with any WordPress theme?

Yes, it will work with any standard WordPress theme.

### Can I change block settings?

Yes, you can change block settings from the Gutenberg block editor’s right sidebar.

### How many times can I reuse the block?

You can use the block unlimited times across your site.

### Where can I get support?

You can post your questions on the [support forum here](https://wordpress.org/support/plugin/draggable-content/)

## 使用者評論

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

## 參與者及開發者

以下人員參與了開源軟體〈Draggable Content – create layouts visitors can move and
explore〉的開發相關工作。

參與者

 *   [ bPlugins ](https://profiles.wordpress.org/bplugins/)
 *   [ Murad Wahid ](https://profiles.wordpress.org/muradwahid/)

[將〈Draggable Content – create layouts visitors can move and explore〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/draggable-cards)

### 對開發相關資訊感興趣？

任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/draggable-cards/)、
查看 [SVN 存放庫](https://plugins.svn.wordpress.org/draggable-cards/)，或透過 [RSS](https://plugins.trac.wordpress.org/log/draggable-cards/?limit=100&mode=stop_on_copy&format=rss)
訂閱[開發記錄](https://plugins.trac.wordpress.org/log/draggable-cards/)。

## 變更記錄

#### 1.0.1 – 13 Oct 25

 * Added Advanced options

#### 1.0.0

 * Initial Release

## 中繼資料

 *  版本 **1.0.1**
 *  最後更新 **4 天前**
 *  啟用安裝數 **20+**
 *  WordPress 版本需求 ** 6.3 或更新版本 **
 *  已測試相容的 WordPress 版本 **6.9.9**
 *  PHP 版本需求 ** 7.2 或更新版本 **
 *  語言
 * [English (US)](https://wordpress.org/plugins/draggable-cards/)
 * 標籤:
 * [block](https://tw.wordpress.org/plugins/tags/block/)[content builder](https://tw.wordpress.org/plugins/tags/content-builder/)
   [draggable](https://tw.wordpress.org/plugins/tags/draggable/)
 *  [進階檢視](https://tw.wordpress.org/plugins/draggable-cards/advanced/)

## 評分

這個項目尚無任何評論記錄。

[撰寫評分](https://wordpress.org/support/plugin/draggable-cards/reviews/#new-post)

[查看全部使用者評論](https://wordpress.org/support/plugin/draggable-cards/reviews/)

## 參與者

 *   [ bPlugins ](https://profiles.wordpress.org/bplugins/)
 *   [ Murad Wahid ](https://profiles.wordpress.org/muradwahid/)

## 技術支援

使用者可在技術支援論壇提出意見反應或使用問題。

 [檢視技術支援論壇](https://wordpress.org/support/plugin/draggable-cards/)

## 贊助

想要支援這個外掛的發展嗎？

 [ 贊助這個外掛 ](https://gum.co/wpdonate/)