作品集 / 明椿電器 官網
明椿電器 官網
多語系企業官網＋模組驅動後台
白話說明電器產品官網：多國語言、產品型錄、詢價車與下載申請。
專案概要
電器產品廠商的多語系官網：呈現產品分類、產品詳情與規格、電子型錄、影片中心與最新消息；訪客可把產品加入詢價車並送出詢價，媒體與產品檔案下載採申請制，由後台審核啟用。
內容由模組驅動的後台維護：欄位定義存在資料庫，新增一種資料不用再寫一套新增修改程式。
我負責
- 後端功能
- 後台上架功能
- 前端套版
技術
功能清單
產品分類與產品產品分為多個分類，含規格與上下架設定。
電子型錄型錄封面與內頁圖由後台上架。
影片中心以 YouTube 嵌入，點擊後在彈出視窗播放。
最新消息消息內容由後台上架。
首頁橫幅與證書首頁橫幅與證書展示皆由後台維護。
詢價車加入產品與數量，可增減與刪除（刪除前確認）；送出時檢查驗證碼、寫入詢價紀錄並寄出通知信。
媒體與產品檔案申請下載申請表單驗證後送出，由後台審核啟用，期限內可下載。
多語系網站繁體中文、簡體中文、英文、日文、韓文，以語系目錄呈現。
各頁 SEO 設定每頁標題、關鍵字與描述可由後台設定。
Google 地圖聯絡頁嵌入 Google 地圖。
後台模組驅動產品、消息、橫幅、證書、申請審核、電子型錄、影片等模組；批次上下架、排序、複製與關聯。
自寫 jQuery 互動詢價車增減與刪除確認、申請表單驗證、頁籤切換、影片視窗、手機與電腦版切換。
詢價流程
示意畫面
| 詢價編號 | 產品 | 日期 | 狀態 |
|---|---|---|---|
| 範例詢價 01 | 範例產品 甲 | 2026-01-01 | 未處理 |
| 範例詢價 02 | 範例產品 甲 | 2026-01-01 | 已處理 |
| 範例詢價 03 | 範例產品 甲 | 2026-01-01 | 已處理 |
| 範例詢價 04 | 範例產品 甲 | 2026-01-01 | 未處理 |
| 範例詢價 05 | 範例產品 甲 | 2026-01-01 | 已處理 |
整合說明
郵件通知詢價送出後寄出通知信。
Google 地圖聯絡頁地圖嵌入。
影片YouTube 嵌入。