內容簡介
### 總結：
Magic Extra Field Light 是一個輕量級的 WordPress 外掛，可以使用 Elementor 的介面將自訂欄位新增至 WooCommerce 產品中。適用於在產品頁面添加文字輸入、核取方塊等表單元素。
### 問題與答案：
1. Magic Extra Field Light 是什麼樣的 WordPress 外掛？
- Magic Extra Field Light 是一個輕量級的 WordPress 外掛，可以讓你使用 Elementor 的介面向 WooCommerce 產品新增自訂欄位。
2. 這個外掛的特色有哪些？
- 可以新增自訂欄位至 WooCommerce 產品
- 使用 Elementor 的介面來設計欄位
- 支援文字輸入、核取方塊等
- 欄位在購物車和訂單詳細資訊中顯示
- 輕量快速
3. Magic Extra Field Light 的需求是什麼？
- WordPress 5.0 或更高版本
- WooCommerce 5.0 或更高版本
- Elementor 3.0 或更高版本
- PHP 7.4 或更高版本
4. 在哪裡可以找到 Magic Extra Field Light 的源代碼？
- Magic Extra Field Light 的源代碼存放在 assets/src/js/ (JavaScript) 和 assets/src/css/ (CSS) 資料夾中。
- 編譯/壓縮後的資源位於 assets/dist/ 資料夾中，通過 webpack 從源檔案生成。
5. 使用哪些建置工具來編譯 Magic Extra Field Light 的資源？
- Webpack：用於打包和優化 JavaScript 和 CSS 資源
- npm：用於依賴管理和建置腳本
6. 如果要修改外掛的前端或管理介面，應該採取哪些步驟？
1. 在 assets/src/ 中編輯源檔案
2. 執行 npm run build 來編譯更改
3. 測試您的修改
7. 外掛的源代碼在哪裡可以找到？
- Magic Extra Field Light 的源代碼也可以在 GitHub 上找到：https://github.com/loyalcoder/magic-extra-field-light
外掛標籤
開發者團隊
原文外掛簡介
Magic Extra Field Light is a lightweight WordPress plugin that allows you to add custom fields to your WooCommerce products using Elementor’s interface. It’s perfect for adding text inputs, checkboxes, and other form elements to your product pages.
Features
Add custom fields to WooCommerce products
Use Elementor’s interface to design your fields
Support for text inputs, checkboxes, and more
Fields appear in cart and order details
Lightweight and fast
Requirements
WordPress 5.0 or higher
WooCommerce 5.0 or higher
Elementor 3.0 or higher
PHP 7.4 or higher
Development Setup
Prerequisites
Node.js (v14 or higher)
npm or yarn
WordPress development environment
WooCommerce installed and activated
Elementor installed and activated
Installation Steps
Clone the repository:
bash
git clone https://github.com/loyalcoder/magic-extra-field-light.git
Navigate to the plugin directory:
bash
cd magic-extra-field-light
Install dependencies:
bash
npm install
Build the assets:
bash
npm run build
Source Code
This plugin uses build tools to generate optimized production assets. The source code for all JavaScript and CSS files is available in the following locations:
JavaScript Source: assets/src/js/ – Contains the original, human-readable JavaScript source files
CSS Source: assets/src/css/ – Contains the original, human-readable CSS source files
Build Configuration: webpack.config.js – Webpack configuration for asset compilation
The compiled/minified assets are located in assets/dist/ and are generated from the source files using webpack.
Build Tools
This plugin uses the following build tools:
* Webpack: For bundling and optimizing JavaScript and CSS assets
* npm: For dependency management and build scripts
To modify the plugin’s frontend or admin interface:
1. Edit the source files in assets/src/
2. Run npm run build to compile changes
3. Test your modifications
The source code is also available on GitHub: https://github.com/loyalcoder/magic-extra-field-light
