## 參考網站

### 網頁風格
1. https://publicstarts.net/ 日本結婚相談所

### 照片牆風格

1. https://pin.it/2n7NReg
- 照片+敘述

# 網頁專案交接

目標：開發The 27th Wedding Studio的網頁。

業主目前的網站為 https://www.27thwedding.com/ ，對目前的供應商不太滿意，因此想要重新撰寫新的網站。

功能需求：
- 沒有程式設計經驗的工作人員能藉由後台輕鬆管理網站內容，照片、最新消息、聯絡資訊等等 (例如wordpress的內容管理系統)。
- 目前使用的平台為MIT加工網 https://www.mit-machining.com ，編輯體驗較差。
- 響應式網頁設計，在電腦、手機、平板上皆能提供良好的瀏覽體驗。
- 每項攝影作品底下要可以編輯敘述文字。
- 網站各頁皆需要漂浮社群按鈕（floating button），讓網頁瀏覽者能夠網站分享至「Instagram、Facebook、LINE、小紅書」。
- 請見附錄
- 導覽列需要5個項目：
- 關於我們
- 攝影作品
- 最新消息
- 套系方案
- 聯絡我們
- 工作人員要能夠由後台從Google評論裡「挑選數則」評論顯示於主頁上。（顧客評價）
- 相關wordpress擴充套件：https://wordpress.org/plugins/widget-google-reviews/
- 首頁的封面圖要能夠編輯。
- 載入首頁時的動畫：像[日本結婚相談所](https://publicstarts.net/)，單純色塊加中英文名稱，再進到首頁。
- 必須使用PHP開發（為了後續SEO優化）

設計需求：
- 設計風格參考網站：
- https://publicstarts.net/ 日本結婚相談所
- https://www.jojowedding.com.tw/ JOJO婚紗攝影
- 業主提供的視覺樣板：
* 
* 
* 
* 
* ‼️樣板的服務項目背景圖片為版權圖片，日後業主會提供自行拍攝的照片替換
- 簡單色彩配置（白底、綠色塊（比初稿再淡一些，白底綠字，綠底白字，若字體有需要其它顏色就黑色，**以不超過3個顏色為原則**）
- #63949b 綠色背景 
- #ffffff 白色背景 
- #3a6763 深綠字體 
- 主頁照片不要太多，首頁主要內容往下滑也有連結可以讓使用者瀏覽到其他頁面。
- 導覽列的子項目（例如：套系方案底下的分類“婚紗”“全家福”“寫真”）不應以下拉式呈現，而是點選至該頁後再選擇子項目。
- *即非此種呈現方式：*
- 
- 導覽列LOGO使用手寫體

那一幀幀的影像
是南國五月的熱情擁抱 是高山河下的忘情親吻
因幸福互許終身的戀人們
最終被相機記錄下來那美好的瞬間！

我們擁有拍多年婚紗雜誌與影像數位的攝影師
曾為時尚雜誌整體造型與指導的彩妝設計師
風格典雅且慧眼獨具的各式禮服
讓您留下嘆的瞬間！
## 附錄

## 漂浮社群按鈕

html放在widgets裡面，用svg而非圖片，icon是bootstrap抓的
css部份在style.css最底下

d

/* 漂浮按鈕 */
.floating-buttons {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1000;
}

.social-button {
  display: block;
  width: 40px;
  height: 40px;
  margin: 5px;
  /* background-color: #f0f0f0; */
  border-radius: 6px;
  text-align: center;
  line-height: 37px;
}

.social-button svg {
  vertical-align: middle;
}

.social-button:hover {
  opacity: 0.8;
}