前言介紹
- 這款 WordPress 外掛「Code Three 3D Interactive」是 2025-07-29 上架。
- 目前有 10 個安裝啟用數。
- 上一次更新是 2025-07-31，距離現在已有 210 天。
- 外掛最低要求 WordPress 6.2 以上版本才可以安裝。
- 外掛要求網站主機運作至少需要 PHP 版本 7.4 以上。
- 尚未有人給過這款外掛評分。
- 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。
外掛協作開發者
外掛標籤
3d | three.js | animation | interactive | multi object |
內容簡介
**外掛總結:** Code 3 讓您能夠使用簡單的短代碼將多個物件、互動式 3D 場景嵌入您的 WordPress 網站中。
#### 問題與解答:
1. Code 3 是用來做什麼的？
- Code 3 讓您能夠使用簡單的短代碼在 WordPress 網站中嵌入多個物件、互動式 3D 場景。
2. Code 3 對哪些人群來說是理想的工具？
- Code 3 對開發者、設計師和數位創意人員是理想的工具，他們想要創建引人入勝的 3D 網頁體驗，而不必將它們硬編碼到模板中。
3. Code 3 提供了哪些功能？
- 上傳多個 GLB 模型到場景中，並更改它們的變換 (位置、旋轉、比例)。
- 將來自媒體庫的圖像添加為場景中的物件 (完全可變形)。
- 透過短代碼嵌入 3D 場景。
- 滑鼠移動和滾動互動。
- 在正交和等距攝影機之間切換。
- 為特定斷點構建獨立組合。
4. 使用 Code 3 的工作流程是怎樣的？
- 點擊「新增場景」後，您可以通過上傳 GLB 到媒體庫來添加模型。
- 您可以在場景編輯器中更改所有物件的位置/旋轉/比例。
- 您可以更改全局設置，如光線強度和滾動/滑鼠互動。
- 在希望顯示的任何地方放置短代碼。
5. Code 3 的短代碼範例是怎樣的？
- [codes_scene id="39"]
- 默認情況下，寬度將是放置短代碼容器的 100%，高度為 500px。
- [codes_scene id="39" width="500px" height="30vh"]
- 設置短代碼的自定高度和寬度，接受所有 CSS 尺寸測量。
原文外掛簡介
Code 3 lets you embed multi-object, interactive 3D scenes into your WordPress site using a simple shortcode.
Live Demo – Multiple Scenes
Ideal for developers, designers, and digital creatives who want to create engaging 3D web experiences — without hardcoding them into templates.
Features
Upload multiple GLB models to a scene and change their transforms (position, rotation, scale)
Add images from media library as objects in the scene (fully transformable)
Embed 3D scenes via shortcode
Mousemove and scroll interaction
Switch between Orthographic and Isometric camera
Build a seperate composition for a defined breakpoint
How It Works
After clicking Add New Scene, you can add models by uploading GLB to the media library
You can change all objects position/rotation/scale in the scene editor
You change global settings like light intensity and scroll/mouse interaction
Place the shortcode anywhere you want it to display
Shortcode Examples
[codes_scene id="39"]
By default the width will be 100% of the container the shortcode is placed and the height will be 500px
[codes_scene id="39" width="500px" height="30vh"]
Set custom height and width of the shortcode, accepts all CSS measurements.
各版本下載點
- 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「Code Three 3D Interactive」來進行安裝。
（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。
延伸相關外掛（你可能也想知道）
Blocks Animation: CSS Animations for Gutenberg Blocks 》Blocks Animation 可以讓您以優雅的方式，為所有的 Gutenberg 區塊添加 CSS 動畫。, Blocks Animation 的用戶介面非常原生且直觀，您甚至不會注意到它已經被...。
Greenshift – animation and page builder blocks 》, 高度優化的網站建構工具, 您是否想建構高品質的動畫和網頁，但卻因常見的頁面建構工具表現低落而感到困擾？Greenshift 將為您解決這個問題。, 此外插件也不...。
UiCore Animate – Free Animations, Transitions, and Interactions Addon for Elementor & Gutenberg blocks 》總結: 「UiCore Animate」可以在「Elementor」中輕鬆創建引人入勝的部件動畫，不需要花費太多時間，亦不會降低品質。, 以下是使用繁體中文製作的問題與答案:,...。
Animation Addons for Elementor – GSAP Powered Elementor Addons & Website Templates 》**摘要:**, , "Animation Addons for Elementor" 是一款專為 WordPress 和 Elementor 使用者設計的網頁動畫建構外掛，提供35種元素和獨特功能，讓...。
Loading Page with Loading Screen 》使用 Loading Page with Loading Screen 外掛功能：, → 顯示正在載入頁面的百分比的螢幕, → 載入完成後以動畫顯示頁面內容, → 提高 WordPress 的效能, → 允許...。
Animations for Blocks 》輕量級插件，可以為塊狀編輯器塊添加額外的檢查器控件，使得在滾動過程中，一旦塊可見就可以對其進行動畫。這些控件可用於選擇動畫類型（淡入淡出，翻轉，滑...。
LottieFiles 》LottieFiles for WordPress 提供您超過 50,000 個免費的 Lottie 動畫，您可以輕鬆地在您的網站上嵌入這些動畫。添加動畫快速簡單：只需要將您選擇的動畫拖放...。
Ghost Kit – Page Builder Blocks, Motion Effects & Extensions 》Gutenberg 區塊和 WordPress 頁面建構外掛程式, , ★★★★★, , Ghost Kit 是 WordPress 的強大頁面建構體驗。Ghost Kit 提供大量的 Gutenberg 區塊、模板和擴充...。
Maintenance & Coming Soon Redirect Animation 》這個超輕量的外掛主要是為開發人員、設計師和網站管理員而設計的，他們需要讓客戶在公開前預覽網站，或在進行重大更新時暫時隱藏網站。, 任何擁有 WordPress ...。
Better Block Editor (BBE) 》總結：Better Block Editor 在原生 WordPress 編輯器中新增了響應式佈局控制、懸停效果、捲動動畫和現成的網站模板。它不是另一個頁面建構工具，也不會取代核...。
Animentor – Lottie & Bodymovin for Elementor 》這是一個非官方的 WordPress 外掛，可在 Elementor 頁面建構器 中增加 Lottie 小工具。, 特點, , 直觀的使用者介面，所有內容皆可透過小工具控制項直接於 Ele...。
Animated Headline 》Animated Headline 是一個使用簡碼展示帶有動畫效果標題文字的 WordPress 外掛程式，使用方便。只需使用 Animated Headline 簡碼即可。, 範例：, [animated-h...。
Animate on Scroll 》使用熱門的 AOS JS 庫，透過新增 class names 完成任何元素的滾動動畫效果。, 此外掛可協助您簡單接合 AOS JS 庫，以新增任何滾動動畫效果至 WordPress 網站...。
LottieFiles – JSON Based Animation Lottie & Bodymovin for Elementor 》這是一個 Elementor 外掛，可使用 Lottie 動畫將創意佈局應用到您的網站，並使用較小的 JSON 檔案。, , 基於 JSON 的動畫嘗試測試環境, , 請參閱以下演示頁面...。
AOS Animation for SiteOrigin Page Builder 》此插件可為 SiteOrigin Page Builder 中的任何小工具和行添加可自定義的動畫。此插件基於免費的 AOS 動畫庫。您可以設定：, – 動畫類型。, – 持...。