新版Google sites使用入門

1. 新舊版Google協作平台切換

Google自2016年底推出了新版的Google sites,使用更直覺方便,如果您也想使用新版本的Google Sites,可以參考以下說明:

1)使用Gmail帳號登入,接著切換至https://sites.google.com/,點選頁面左方的「新版Google協作平台」即可以開啟新版協作平台管理頁面。

 

2)新版協作平台管理頁面點擊頁面左下方的「返回舊版本Google協作平台」即可回到以前舊版的管理頁面。

新版Google sites使用入門

1-1 在舊版本管理頁面中建立新版的協作平台

如果您還是習慣使用舊版本的管理頁面,但又想建立新版本的協作平台,其實很簡單,直接在管理頁面的「建立/建立新版本的協作平台」

 

接著系統就會自動建立一個新的協作平台

新版Google sites使用入門

1-2 新版Google Sites編輯觀念

新版本的Google Sites是以區塊的概念來建置網頁,如下圖,就只有一欄,可以新增紅色1.2.3.4等區域,在區域中可以置入圖文區塊、Google雲端硬碟文件、試算表、簡報、Youtube(藍色1.2.3).......

每個區塊可以手動拖曳調整大小及位置,但位置有限制,如同Bootstrap一樣,將每個區域畫分為一些欄位,圖文及物件的大小就受限於這些欄位

 

欄位如下,在拖曳調整圖文或物件區塊大小及位置時會顯示在區域內,您必須配合這欄位來調整

新版Google sites使用入門

2. 操作介面簡單介紹

因為新版本的Google Sites真得很簡單直覺,所以簡單介紹後,想信您也能快速上手。

  1. 點選即可修協作平台的名稱,輸入後就會直接顯示在網站名稱處(2)
  2. 可以輸入網站的名稱
  3. 使用滑鼠點擊即可以立即修改頁面標題
  4. 在網頁的任何處快速點擊滑鼠左鍵二下即會顯示快顯功能表,可以在滑鼠點擊處插入網址、文字、圖片及雲端硬碟中的檔案。
  5. 編輯功能的「復原上一個動作、重作、預覽網站效果(一般瀏覽器、行動載具)、加入共編者、發佈網站」
  6. 可以針對網站進行主題更換、新增其他頁面及插入物件

預覽有三種模式,一般桌機及行動載具:

 

 

新版Google sites使用入門

2-1 頁面的插入功能

舊版是採用下拉選單的方式,新版本的Google Sites是直接顯示在右側欄,共有「基本插入圖文、Google雲端硬碟、Google嵌入項目、和Google文件」四部份,可以透過其右方「︽︾」做開合顯示

可以透過協作台的「插入」功能,在頁面中可以快速置入圖文、網址及Google雲端硬碟中的檔案、資料夾、文件、試算表......。

 

新版Google sites使用入門

2-2 插入頁面

新版的Google Sites只有一種頁面,但它可以整合Google雲端硬碟的資料夾、雲端檔案,達到檔案櫃的功能。

在建立網站前,最好先將網站架構圖給完成,可以使用心智圖軟體來規劃,如freemind、xmind或者是Coggle

建立新的協作平台時,只會有一個首頁,接下來就是透過建立頁面來增加其他部份。

點選頁面的「新增頁面」圖示按鈕

 

接著輸入新頁面的名稱,按下「完成」按鈕

 

完成頁面新增後會自動開啟該頁面該使用編輯,同時會在頁面上方的選單自動建立選單連結

接著就如同一般頁面一樣進行編輯

 

如果頁面有階層關係,想以下拉選單顯示,請在右側欄的頁面處直接拖曳調整階層,頁面中會以下拉選單呈現

 

新版Google sites使用入門

2-3 協作平台主題

點選「主題」,接著選取主題,頁面會立即套用該主題

 

接著可以更換主題的圖片、顏色及文字的樣式

 

使用滑鼠點選「標題區」即會顯示「變更圖片、標頭類型」

 

點擊「變更圖片」後可以從圖庫、上傳、雲端硬碟等來更改標題區的背景圖

 

如果剛才在「標題區」選取「標頭類型」即可切換標頭類型,共有三種:

  1. 大型橫幅:標題區寬度一樣,但高度會明顯變大
  2. 標準橫幅:目前顯示即是標準橫幅
  3. 只有標題:沒有圖,只有文字

 

大型橫幅如下:

新版Google sites使用入門

2-4 更改文字大小及顏色

New Google sites只有更改粗體及斜體的功能,如果您真的要更改,可以只動到HTML CSS   "Style"

使用「嵌入」--「嵌入程式碼」--「貼入html」

2021年1月已經能直接設定文字大小及顏色了

 

新版Google sites使用入門

3. 完整網站建立示範

第三章將利用一個完整的網站來示範,如何使用Google sites新版的各項功能來建置該網站:

首先利用心智圖來規畫一下網站的架構,如果可以的話整個版面的安排也可以手動繪製一個:

新版Google sites使用入門

3-1 建立協作平台及標題設定

1)切換新版本的協作平台管理頁面,接著點擊頁面右下方的「+」來新增一個協作平台

 

2)在協作平台的名稱處輸入該網站的名稱,網站的名稱會立即顯示在標題左上方的網站名稱處

 

3)點選標題就可以直接修改內容,將滑鼠移至標題上即會顯示其快顯功能,此時就可以標題進行「標題字體大小、對齊、超連結及刪除標題」設定

 

直接拖曳標題即可以調整其水平位置,它的顯示如同Bootstrap一樣,把螢幕區分為一些區域,可以將標題拖曳至該區域即會顯示在該域區。

 

 

4)變更標題的背景圖
將滑鼠移至標題區即會顯「變更圖片、標頭類型」,點選「變更圖片」

 

在選取圖片的視窗中,您可以使用系統內建的圖片,也可以上傳電腦中的圖片、選取相簿或雲端硬碟中的圖片

 

按下頁面左下方的「選取」按鈕即會馬上套用新背景圖,並在標題區的右下方顯示「清晰度調整」,系統會自動將背景圖進行淡化處理,這個設定是可以手動移除,只要點選該「清晰度調整」按鈕即可移除淡化效果。

新版Google sites使用入門

3-2 套用喜歡的佈景主題

點選右側欄的「主題」,接著從下方的主題挑選一個,協作平台會立即套用該主題

接著可以設定顏色及字型樣式,中文字好像沒什麼改變,英文字就會有差了,您可以自己試看看。

新版Google sites使用入門

3-3 新增圖文

1)新增文字:

1-1)在欲新增文字處快速點擊滑鼠左鍵二下,會顯示出快顯功能

 

1-2)輸入文字後,可以調整:

  1. 文字的大小:只有標題,次標題、一般文字三種
  2. 透過格式設定文字的粗體、斜體、超連結及居左、中、右
  3. 調整文字區塊的大小
  4. 直接拖曳文子區塊可以調整水平位置

 

1-3)透過左側的調色盤圖示按鈕,可以設定此區塊的顏色或背景圖
按下「垃圾桶」圖示按鈕可以刪除此區塊

 

1-4)設定成圖片的效果如下

 

2)在欲插入圖片處快速點擊滑鼠左鍵二下,會顯示出快顯功能,點選其中的「圖片」

 

可以上傳本機照片或使用相簿、雲端硬碟的檔案,如果是上傳本機的檔案,在拖曳檔案至上傳處,記得要按下頁面左下方的「上傳」按鈕

 

接著可以透過控制點調整大小,也可以直接拖曳來調整水平位置

  1. 切裁圖片
  2. 回復切裁
  3. 建立圖片超連結
  4. 刪除圖片
  5. 更多:以另一張圖片取代本圖、新增替代文字(當瀏覽者滑鼠移至圖片上方時會顯示圖片說明)

 

在調整文字區塊或圖片的水平位置時會在背景處顯示區域的分隔線,您能調整的大小及位置必須符合這些隔線

新版Google sites使用入門

3-4 嵌入網址

嵌入網址:可以讓我們在網站的區域中插入其他網站的資料,系統會動抓取資料並顯示

1)在欲插入網址處快點滑鼠左鍵二下,接著點擊「網址」

 

2)在嵌入網頁內容的視窗中輸入網址,系統會自動抓取資料,確定後按下「新增」按鈕

 

3)點選該區塊會顯示其快顯功能:(1)點擊後會開啟新視窗並顯示網頁 (2)偏好設定

 

偏好設定可以設定顯示的內容:圖片、標題及說明

 

4)並非每個網站都自動抓到資料,如果網站不支援該功能,就會顯示如下

 

插入網址後就只會顯示一個網址,而且會佔用一個區塊,區塊下方會有空白區

但如果二個網址都是插入不支援還好,會顯示如下:

 

新版Google sites使用入門

3-5 嵌入Youtube影片

我們可以任何一個頁面任何一個區域插入Youtube影片

1)點選右側欄的Youtube

 

2)你可以透過關鍵字搜尋或從您已上傳youtube的來選取影片

  

 

3)接著可以透過滑鼠拖曳調整影片的水平位置,透過控制調整影片的大小,點選影片的「偏好」設定,可以調整:隱藏控制介面、進度列顏色及允許全螢幕顯示設定

 

4)同一區域可以置了多個影片,如下:

新版Google sites使用入門

3-6 嵌入Google日曆

要將Google行事曆整合進新版的Google sites是一件很簡單的事

1)要先將Google行事曆設定為公開

您可以參考站長之前所寫的文件
http://www.phcno1.net/modules/tad_book3/page.php?tbdsn=783

 

2)回到新版的Google sites,點選右側的Google行事曆

 

3)選取您欲插入Google sites的行事曆,然後點擊右下方的「插入」按鈕

 

4)拖曳調整區塊大小(1),接著進行偏好設定(2)

 

可以設定日曆名稱、顯示項目及檢梘模式

 

5)完成如下:

新版Google sites使用入門

3-7 嵌入Google地圖

在Google Sites協作平台嵌入Google地圖的步驟如下:

1)點選右側欄的「地圖」

 

2)在選取地圖的引出視窗中設定您要顯示的地圖,必要時可以加上地標

 

3)如果您之前要建立過自訂的地點,可以透過頁籤的「我的地圖」來選取

 

4)接著就可以透過控制點設定區塊大小;透過拖曳來調整水平位置

新版Google sites使用入門

3-8 整合Google雲端硬碟

網路上那麼多的平台可以快速產生網站,簡易建立網頁,我們為什麼要選取Google Sites呢?就是因為它可以完全整合Google雲端的其他服務:

新版Google sites使用入門

3-8-1 插入雲端硬碟資料夾

這個功能是整理段考試卷、課程計畫特別好用,先在雲端硬碟中開一個共用資料夾,將學校同仁加入共管,請學校仁自行上傳資料,而我們要做的就要在頁面的區域中插入一個雲端硬碟資料夾的區塊即可。

1)切換至欲插入雲端硬碟資料夾的頁面,點選右側欄的「插入/雲端硬碟資料夾」

 

2)選取剛才共用的資料夾,並點選「插入」按鈕。※記得該資料夾必須開放公告瀏覽

 

3)可以拖曳調整區塊大小,點選偏好設定,在彈出的視窗中,可以設定檢視類型:清單或格狀檢視

 

上圖是清單模式,而下圖則是格狀檢視

新版Google sites使用入門

3-8-2 插入雲端硬碟檔案

插入雲端硬碟檔案這個功能就更好用了,直接把檔案置入頁面的區域中,例如:mp4、pdf.....

1)首先必須確認該檔案是設定成公開瀏覽

2)在欲放入雲端硬檔案的頁中點擊右側欄的「插入/檔案」

在頁中置檔案後,可以透過控制點調整大小或透過滑鼠拖曳來調整水平位置

 

新版Google sites使用入門

3-8-3 插入雲端硬碟文件

1)在欲插入Google文件的頁面中,點選右側欄的「插入/文件」

 

2)接著選取雲端硬碟的文件,選取後按下「插入」按鈕

 

3)透過控制點調整區塊大小並拖曳調整水平位置

 

4)進到預覽,右側即會出顯可以上下移覽瀏覽的控制捲動軸

新版Google sites使用入門

3-8-4 插入雲端硬碟資簡報

1)先在雲端硬碟中建立簡報並設定為公開瀏覽

2)在欲插入簡報的頁中點選右側欄的「簡報」

 

3)在彈出視窗中選取雲端硬碟欲插入協作平台的簡報(Powerpoint),並按下「插入」按鈕

 

4)可以透過控制點調整簡報大小並拖曳調整水平位置

 

進到預覽模式就會在右側出現捲動軸,透過捲動軸就可以切換不同的簡報頁

 

果您的簡報檔是Google的簡報,顯示如下:

新版Google sites使用入門

3-8-5 插入雲端硬碟試算表

1)先在雲端硬碟中新增試算表並設定公瀏覽

2)在欲放入雲端硬碟試算表的頁中點擊右側欄的「插入/試算表」

 

3)選取雲端硬碟中的試算表檔案並點擊右下方的「插入」按鈕

 

4)在頁中置入試算表後,可以透過控制點調整大小或透過滑鼠拖曳來調整水平位置

 

5)進到預覽模式就可以透過捲動軸上下瀏覽或透過左下方的工作表

新版Google sites使用入門

3-8-6 插入雲端硬碟表單

在雲端硬碟中先建立表單並設定好瀏覽權限

1)在欲放入雲端硬碟表單的頁中點擊右側欄的「插入/表單」

 

2)選取雲端硬碟中的表單檔案並點擊右下方的「於入」按鈕

 

3)在頁中置入試算表後,可以透過控制點調整大小或透過滑鼠拖曳來調整水平位置

 

4)進到預覽模式就可以透過捲動軸上下瀏覽(2)或透過(1)在新分頁中開啟該表單

 

新版Google sites使用入門

3-8-7 插入雲端硬碟圖表

1)先在雲端硬碟中新增圖表並設定公瀏覽

2)在欲放入雲端硬碟圖表的頁中點擊右側欄的「插入/圖表」

 

3)選取雲端硬碟中的圖表檔案並點擊右下方的「插入」按鈕

 

4)一個試算表中可以有多張圖表,請點選其中欲插入頁面的圖表後按下「新增」按鈕

 

5)在頁中置入圖表後,可以透過控制點調整大小或透過滑鼠拖曳來調整水平位置

新版Google sites使用入門

3-9 使用Google論壇當公告

1)先參考站之前的文章的設計Google論壇

2)複製Google論壇的網址

 

3)使用插入網址的方法,貼上剛才複製的網址

 

4)調整區塊的大小及位置就ok了

新版Google sites使用入門

4. 發佈、共用與管理協作平台

1)發佈

完成網站建置,點選頁面右上方的「發佈」按鈕,接著輸入協作平台的位置,最後按下發佈即可

 

發佈後還可以做「取消發佈」,如下:

 

2)共用

透過共用的設定,可以讓多人一同的建置與維護這個網站,請點選頁面右上方的「人物」圖示按鈕,在發佈按鈕的左邊那個按鈕,在邀請別人處可以輸入共編者的email,按上傳送即可,對方收到email信件並確認後即可共編。

※如果要協作平台公開在網路上讓大家都可以瀏覽,請點擊上圖「私人-只有您可以編輯」右方的「變更」,請更改為「公開」

 

3)管理協作平台

在協作平台的管理頁面中,會列出目前已置的網站,在網站圖示上按下滑鼠右鍵會顯示快顯功能,就可以重新命名或更改,在網站圖示上按下滑鼠左鍵二下即可開啟進行編輯

 

如果是在一般的網站編輯模式下,按下左上角的圖示按鈕即會回到協作平台的管理頁面