Google|Google Sites協作平台自訂主題

Google Sites 是 Google 免費的網站平台,Blogger 其實也可以是一個完整的網站,但要有更多的功能還是要以  Google Sites 為主,Blogger 偏文章內容多較為好用,詳細內容請參考:

之前因為有另外再買一個網址,想測試如何設定子網域,成功後就把主網域留給 Google Sites,還沒思考好如何使用它,畢竟也沒其他內容能再額外分享,也就擱置了好一陣子,直到最近開始迷上水晶,就先把它做為水晶收藏品的展示站,日後再想想如何併整,也因為整頓了起來,所以順便說一下實用的協作平台新功能。

優點

自訂主題主要的好處是可以分別設定字型及顏色,若你只想簡單套用,使用預設主題其實是更方便的。

自訂主題

Google Sites custom theme
圖一:新建主題
  1. 可以自訂一個全新的主題,並為主題命名
  2. 新增標誌:顯示在網站頂端(此也可以經由設定處,如 🔽下圖設定)
  3. 新增橫幅圖片:顯示在頁首區段做為背景
Google Sites setting
圖二:設定處新增品牌圖片
Google Sites banner cover

匯入主題

Google Sites Import themes
  • 若之前也有做過其他協作平台,也可以直接匯入相同的主題
  • 主題也可以直接編輯/複製/移除
Google Sites edit theme

設定主題步驟

Google Sites theme setting
  • 主題最主要可以變更字型
  • 變更主題顏色
  • 顏色/文字/圖片/導覽/元件,都有細項可以設定

顏色設定

Google Sites Theme color settings
  • 背景色也可以先預定三種樣式,或上傳圖片
  • 大標題/標題/子標題/本文也可以分別預設文字顏色
Google Sites Theme Section color style

文字設定

Google Sites Theme font settings
  • 字型:可依大標題/標題/子標題/一般文字/小字體等各別設定字型
  • 大小:依需要設定字型大小
  • 格式:選擇粗體或斜體
  • 對齊:向左/置中/向右靠齊
  • 行距:依需要調整
  • 段落間距:依需要調整
Google Sites menu font
  • 選單字型為套用:一般文字
  • 圖片輪播介面若有設說明,字型為套用:小字體
  • Google 中文字型可以選日文,缺字少的就可套用,可參考:Google|Font字型-日文推薦
Google Sites Image Carousel setting
Google Sites Image Carousel setting

圖片設定

網站首圖和  LOGO 等若從上面 圖二:設定處新增品牌圖片,則會如下圖 🔽左側所示為空白,但二種設定方式都會有相同效果,只是日後要複製主題時,LOGO/背景等就要另外設定(事實上不同網站,通常也不會有相同背景及 LOGO。)

Google Sites banner cover LOGO setting

導覽設定

Google Sites tour setting
  • 導覽的背景即選單背景
  • 選取的頁面圖示
  • 導覽列在頂端或側邊各有不同選項
Google Sites tour navigation bar
Google Sites side navigation bar
手機上側邊導覽設定圖示
  • 通常選單設在側邊,大部份手機都是,電腦上也可以設側邊,依個人喜好
  • 電腦上設頂端導覽列,手機上也會自動顥示為側邊導覽列

元件設定

Google Sites element setting

可調整內容

  • 背景樣式
  • 按鈕
  • 分隔線
  • 連結
  • 圖片輪轉介面
如果有想要自己做網站,當然還是自訂主題比較有完整的自主性,預設主題雖然方便,但顏色和文字就會受到侷限。

Google Sites網站參考

留言

這個網誌中的熱門文章

Google|表單封面及內圖尺寸

KTJ大榮貨運託運單列印及軟體操作運費說明

剪映|新版支援繁體中文及導出SRT做CC字幕

【檔案下載】大榮貨運單列印託運單下載

字型|可商用免費的字型載點來源

【LINE@官方帳號】主頁|訊息項目-圖文訊息版型尺寸