如何用google協作平台建置個人主頁？

Patrick.Wong

發佈於Patrick的人生故事館

更新於 2021/10/07發佈於 2021/10/07閱讀時間約 10 分鐘

開頭要先特別感謝換日線、Shirley 梁雪莉兩位大神的文章，讓長期困擾沒有個人頁面的我動起了念頭，尤其是身為驕傲免費仔的我，研究WordPress架設網站知道要付費後，這把火更是被澆熄許久。

目前網站主要規劃放置過往的文章為主，首先來看成品的部分：木村白哉的個人寫作空間。

個人主頁首頁

比較遺憾的是，個人長期活躍的平台是在MEDIUM，SEO每天帶來穩定的流量，所以首發文章也都會先上傳至MEDIUM。

直到2021年4月開始因為MEDIUM政策改變，日流量從原先每日三、四百，至今已經趨近於零，近期逐漸將文章慢慢轉向VOCUS，因此個人頁面所提及的文章都是來自上述兩個平台。

所以在Matters上的第一篇原創文章，這篇算是第一篇吧！

取之於Matters、回饋於Matters。

今天各位讀者在VOCUS看到本文，主要是筆者覺得時候到了，可以將文章轉發至此的緣故。

關於google協作平台基礎上的操作，上述兩位大大皆有提到的建議，個人就不再贅言，這邊就直接附上參考連結：

前言說完了，站在巨人的肩膀上，換我給想要透過google協作平台製作個人網站的人一些個人在製作頁面上的建議。

網頁造訪人次計數器

我在頁尾放上一個部落格很常用到的造訪人數計數器功能：

造訪人數計數器（網站計數器）

只要上網搜尋瀏覽人次、網頁計數器等關鍵字，就能查到許多免費的版本。個人目前使用的是日本提供的版本：無料アクセスカウンター，設定方式在右上角有「大家尊敬的台灣」，點下去後就會變成繁體中文版。

設定完初始值、顯示位數、背景顏色，再選完樣式後送出，就會產生一組程式碼，原封不動的複製下來後，回到個人頁面，在右方編輯欄的「插入」選項中選擇「內嵌」，將複製的程式碼貼上「嵌入程式碼」，點選「下一個」後就大功造成了！

google協作平台，嵌入網頁內容設定

最後再根據排版改變大小與位置，就能幫自己紀錄開站至今（使用計數器後）的累計造訪人數。

版權宣告

身為一個寫作人，沒有人希望自己的文章被有心人士所盜用，所以我在頁尾的最下方附上版權宣告：

頁尾最下方呈現的版權宣告

為了確保格式正確，特地去找了中英兩個版本的格式。首先要先對版權宣告的基本構成有所了解：

Copyright ©
©
©opyright

年份：可以是一個發表的年份(2021)，或是一個年份區間(2015–2021)。

作者：著作權擁有者的名稱或是縮寫，可以是公司（如果是公司網站，通常是掛公司的抬頭全名），也可以是作者筆名或暱稱。

完整的版權宣告寫法：

ENGLISH：Copyright © [year] [owner]. All rights reserved.
中文：版權所有© [年] [擁有者]
中英混搭：Copyright © [年] [擁有者] 版權所有

精簡的版權宣告寫法：

ENGLISH：© [year] [owner].
中文：© [年] [擁有者]

範例參考

Apple：

台積電：

Gogoro：

Microsoft：© Microsoft 2021

基本上很彈性，有許多知名企業的官網頁尾都能參考。個人則是沒想太多，純粹因為頁尾很空，所以就先將中英兩版先都丟上去站版位，也順便把圖片的來源也一併說明（網頁圖片皆來自本人拍攝）。

確認好自己想呈現的版權宣告格式後，為了避免每年手動修改年份，因此我內嵌了一段程式碼，每過一年就會幫我自動更新到最新的年份。

英文格式：

Copyright ©
<script language="JavaScript" type="text/javascript">
now = new Date
theYear = now.getYear()
if (theYear < 1900)
theYear = theYear + 1900
document.write(theYear)
</script> Patrick Wong. All rights reserved.

版權所有 ©
<script language="JavaScript" type="text/javascript">
now = new Date
theYear = now.getYear()
if (theYear < 1900)
theYear = theYear + 1900
document.write(theYear)
</script> 木村白哉

大家就根據自己的喜好修改後，同樣在「插入」的「內嵌」選項中，將複製的程式碼貼上「嵌入程式碼」，並修改成自己想樣的文字內容，點選「下一個」後就大功造成了！

內嵌like.co拍手連結

個人一開始是直接仿造MEDIUM文章的方式，將網址連結使用「插入」的「內嵌」選項中，將複製的連結貼在「使用網址上傳」：

「插入」的「內嵌」選項中，將複製的連結貼在「使用網址上傳」，最後會如右圖所示

雖然個人在發布後，用個人帳號看是沒有問題，但是只要在非帳號模式下觀看（無痕模式），就會顯示「like.co拒絕連線」。

非帳號模式下看，原先正常的拍手會無法正常顯示

才發現google協作平台沒有像MEDIUM這麼人性化，將網址丟入文章就能使用。最後沒辦法，與大神換日線請教，正確的方式要在右方編輯欄的「插入」選項中選擇「內嵌」，將以下程式碼「修改成自己的格式」後貼在「嵌入程式碼」，最後點選「下一個」就可以成功顯示。

<iframe data-v-b66e9a5a=”” frameborder=”0" height=”230" src=”https://button.like.co/in/embed/你們的ID /button?referrer=單篇網頁的網址” width=”100%”></iframe>

像是我自己最後的「嵌入程式碼」設定如下（要記得改成自己的網址！）：

<iframe data-v-b66e9a5a="" frameborder="0" height="200" src="https://button.like.co/in/embed/patrick_wong/button?referrer=https://sites.google.com/view/patrick-wong/" width="100%"></iframe>

拿「嵌入程式碼」與「使用網址上傳」比較一下：

右上為「嵌入程式碼」，右下為「使用網址上傳」

會發現「使用網址上傳」的內嵌方式會多出一個「返回」的橫條，最後在非本人帳號或是非帳號模式下進入頁面，就會跑出剛剛無法顯示拍手、或是「like.co拒絕連線」的情況發生。

所以有考慮在google協作平台上內嵌like.co拍手功能的朋友，關於like.co拍手功能該如何「正確」嵌入才能正確顯現在網頁上，上述方法一定要學起來！

結語

關於透過google協作平台自建個人網站的補充，大概就說到這，希望藉由這篇文章拋磚引玉式，吸引其他厲害的設計者分享自己如何美化個人頁面的方式與手法。

對於個人網頁內的文章連結，沒有任何一個來自Matters，實在是愧對馬格市的各位先進。雖說如此，若喜歡敝人文章，歡迎大家直接造訪MEDIUM、方格子VOCUS以及Matters。

最後，對於個人主頁木村白哉的個人寫作空間內容有任何指教，也歡迎大家不吝提出（路過可以順便拍個手，當作是「到此一遊」的足跡證明XD）。

參考資料

Patrick.Wong的沙龍Patrick的人生故事館

Patrick.Wong的沙龍

248會員

476內容數

一位在因緣際會之下，動了想去紐西蘭的念頭，卻陰錯陽差跑到澳洲打工度假的背包客。脫離台灣世俗的期待，踏上打工度假的不歸路，第二人生正式在澳洲啟航。如果人生很短，那青春就是短暫一瞬間，屬於你的第二人生，下一站在哪呢？還沒開始的理由，又是什麼呢？歡迎來到我的澳洲故事館，分享我在澳洲的旅程故事。

留言0

查看全部

發表第一個留言支持創作者！

Patrick.Wong的沙龍的其他內容

當經理人與數位時代的文章同質性過高，是否還有兩者皆訂閱的必要？

身為一個長期訂閱經理人與數位時代的讀者，對於這幾個月來巨思文化集團在電子報上的做法，我想說：我看不到以往「經理人」與「數位科技」的「Sense」有用心在像我這種透過Email訂閱電子報的觀眾上。門面有失專業，文章內容與定位不符，恭喜你們得到了許多蹭時事流量的觀眾，失去的只是像我這種少數人種。

#經理人 #數位時代 #定位

研究所，值不值得花兩年的時間投入？

回想大四那年，對企管有了濃厚的興趣，就在思考是要就讀MBA，還是當兵然後出社會。當時糾結於：多花兩年所得到的成效，到底值不值得我投入？長期角度而言，我不知道，就當作追求興趣吧！短期角度而言，我知道自己讀研究所的目的，就是讓自己對企管的學習一次到位。剩下的，就是我有沒有下定決心，用兩年的時間全力以赴。

#研究所 #人生 #生命是長期而持續的累積

追憶，至聖先師：悼念作育菁莪無數的雷漢聲老師

還記得兩年前的今天，2019年9月16日下午，得到雷老師心肌梗塞離世的消息。蜂擁而至的追念映入眼簾，噩耗宛如病毒感染般在臉書、賴群中蔓延。我想老師一定滴酒不沾持續很長一段時間，否則怎麼會揮一揮衣袖，卻不帶走一瓶威士忌？想不到，離校前的最後一堂課，在歡笑中跟老師道別，竟也成了與老師的最後一面。

#人物 #悼文 #悼念

科技趨勢下的新興階級－數據新貴

虛實整合之後，接下來跟數據有關的專業，就是屬於虛擬世界中的製造業者－數據業該做的事。數據在兩者間流通，這些數據就像原物料一樣，藉由互聯網這條高速公路，將數據送到各個系統中，把數據加工處理成有用的資訊，最終讓需求者進行商業運用、產業優化，或是進行更高階的數據演算應用。

#資料 #數據 #產業

培養可以「帶著走」的專業能力

在職涯的發展上，必須要思考自身的專業技能是「依附」在什麼樣的資產上？是必須在重資產、輕資產還是無形資產上才能一展長才呢？在已累積的資歷下，專業能力依附於重資產上，要轉換跑道時，由於重資產無法輕易取得或變動，自身價值也被綁定在特定的產業或企業中，一但跳脫環境，擁有的專業能力可能就變得一文不值。

#職涯 #通才 #專才

我的職涯目標－產品經理以及專案經理

雖然我還不知道要走什麼產業，從未來創業的角度去思考職涯發展，資源整合是創業最需要的核心技能。因此在職涯中，要盡可能把資源整合變成自己的專業，立志要當一個資源整合者，而能達成這個目標的職位也就是雙PM－產品經理以及專案經理。現在的職涯目標，就先朝這兩個職位目標邁進。