作品集 / 家而適 品牌官網
家而適 品牌官網與後台
品牌官網+模組驅動後台
白話說明品牌官網與後台:介紹品牌、影片與活動,內容由店家自己更新。

專案概要
以 PHP 開發的官網與後台,涵蓋品牌展示、影片與內容管理、轉址管理、第三方登入。
後台為模組驅動設計:欄位定義存在資料庫,每種欄位對應一個元件,新增一種資料不用再寫一套新增修改程式。
我負責
- 後台資料上架功能
- jQuery 前端互動
技術
功能清單
資料上架流程逐欄驗證、圖片與檔案上傳、掛到分類,一條流程走完。
多圖上傳動態新增欄位、拖曳排序、數量上限、預覽,送出後才真正刪除。
圖片裁切在畫面上選取範圍,以 AJAX 送出裁切設定。
項目拖曳排序列表上直接拖曳調整順序。
權限控管與列表搜尋依角色控管可用功能,列表可搜尋。
影片管理以 YouTube 網址建立影片,並掛到分類。
轉址管理後台設定網址轉址規則。
第三方登入支援 Google、LINE 登入。
資料上架流程
示意畫面
| 影片標題 | 分類 | 狀態 |
|---|---|---|
| 範例影片 01 | 範例分類 甲 | 已上架 |
| 範例影片 02 | 範例分類 乙 | 已上架 |
| 範例影片 03 | 範例分類 甲 | 草稿 |
| 範例影片 04 | 範例分類 丙 | 已上架 |
| 範例影片 05 | 範例分類 乙 | 已下架 |
整合說明
第三方登入Google、LINE。