內容簡介
Softicon Model Viewer 外掛為區塊編輯器新增了一個 3D 模型檢視器區塊，讓使用者能夠輕鬆地在網站上展示 GLB 或 glTF 檔案，並提供互動體驗，如旋轉、縮放及擴增實境功能，適合用於家具、裝飾品、產品及藝術品等展示。
【主要功能】
• 支援 GLB 和 glTF 檔案上傳
• 提供模型旋轉和縮放功能
• 擴增實境功能可在手機和平板上使用
• 自動旋轉模型選項
• 可自訂替代文字和海報圖片
• 無需外部服務，完全免費
外掛標籤
開發者團隊
② 後台搜尋「Softicon Model Viewer – Interactive 3D & AR Product Viewer」→ 直接安裝（推薦）
原文外掛簡介
Let people see your product from every side, and then in their own room.
Softicon Model Viewer adds one block, 3D Model Viewer, to the WordPress editor. Drop in a GLB or glTF file and your visitors can:
Rotate the model and zoom into every detail.
Watch it turn slowly on its own.
Tap View in your room on a phone or tablet and place the model in their own space with augmented reality (Android Scene Viewer, iPhone and iPad Quick Look, and WebXR).
It is perfect for furniture, lighting, decor, fashion, art, products and anything people want to look at from every side.
Everything in one block
Your model: upload a GLB or glTF file, pick one from the media library, or add one from a URL.
Accessibility: alternative text, plus an optional poster image that shows while the model loads.
Interaction: rotate and zoom, automatic rotation, and a small hint that invites visitors to drag.
Augmented reality: turn the “View in your room” button on or off, and write your own button text.
Appearance: height, brightness, shadow strength, and two lighting styles (soft studio or classic).
Camera: choose the starting angle, or let the viewer pick one for you.
Design: caption, wide and full width, background colour or gradient, spacing and rounded borders.
Why you’ll like it
One light block, nothing else. No settings page, no admin notices, no account and no external service.
Everything is free. Augmented reality, posters, lighting and every other setting are included. There is no Pro version.
Fast pages. The 3D viewer only loads on pages that use the block, and the model is lazy-loaded.
Works with any theme, and with the block editor you already know.
Readable code. The block’s own code has no build step, so it is easy to review and extend.
Video tutorial
See every step, from adding the block to publishing the page, in about 90 seconds:
Privacy
This plugin does not collect data, set cookies or contact any external service. Models are loaded from your own media library or from the URL you enter.
Support
Need help, found a bug, or have an idea for a new feature? We are happy to help.
Email: [email protected]
Forum: open a topic in the support forum.
Video tutorial: watch on YouTube
To help us answer faster, please include your WordPress version, your theme, and a link to the page (or the model file).
Third-party libraries
The block loads one bundled library, model-viewer by Google, from the plugin folder. Nothing is loaded from a CDN or another server.
@google/model-viewer 4.4.0, Apache License 2.0. Source: https://github.com/google/model-viewer/tree/v4.4.0
It includes three.js r183 (MIT, https://github.com/mrdoob/three.js), Lit (BSD-3-Clause, https://github.com/lit/lit) and @monogrid/gainmap-js (MIT, https://github.com/MONOGRID/gainmap-js).
The minified file vendor/model-viewer/model-viewer.min.js is the unmodified dist/model-viewer-umd.min.js from the npm package. The readable, non-minified build of the same version is included next to it as vendor/model-viewer/model-viewer.js, together with the Apache license and a list of all bundled projects in vendor/model-viewer/THIRD-PARTY-NOTICES.txt.
Models in the screenshots and videos
The screenshots, banner and videos use sample models from the Khronos glTF Sample Assets (https://github.com/KhronosGroup/glTF-Sample-Assets): Anisotropy Barn Lamp by Eric Chadwick, © 2023 Wayfair LLC (CC BY 4.0), Diffuse Transmission Plant by Eric Chadwick (CC BY 4.0) and Rico Cilliers (CC0), and Lantern (CC0). They are not included in the plugin.
Source code of this plugin
The block’s own code is plain, readable JavaScript and PHP with no build step: block/index.js (editor), block/render.php (front end), block/block.json (block settings) and the CSS files are the source files themselves.
