在使用 Blogspot 的時候,一開始最先遇到的問題就是「留言版」。目前的 Blogspot 只有提供文章回應的功能,或者是 Google Friend 方式的留言版。但是,在大部份的使用者來說,Google Friend 的留言版,是不太友善的 ( 操作不易 ) 。所以,今天要介紹的是 Shout Mix 的側欄留言版系統。順便一提的是,許多教學對於 ShoutMix 的其他功能設定並沒有介紹,所以,這次我將在附錄的地方一起介紹。

首先,我們來到 ShoutMix! 的首頁,直接點選右上方的「Creat」字樣。Capture18

接著就會來到註冊的畫面。一樣把相關的資訊填入欄位。Capture19

按下「Continue」之後,就算註冊完成了。接下來則是選擇留言板的形式。基本上保留第一種就很實用了。選好之後點「Continue」。Capture20

這樣一切就都就續了。接下來先來到後台來設定一下其他的部份。點選 Control panel 字樣,就可以進入管理後台。Capture21

在後台,我們可以看到 ShoutMix! 的強大功能,我都已經翻譯好了,大家就直接看圖吧。Capture22

這邊我就帶大家一頁一頁看過,對內容有興趣的人可以再深入研究。首先就是「Get Codes」的部份,這部份就是我們所需要的。在這個頁面可以設定「Box」的寬度和高度,這邊我們先不更改它的設定,直接拿到程式碼,貼到側攔的小工具裡頭。Capture23

先來到 Blogspot 的後台,到達《版面設定》裡頭的《網頁元素》。點選側欄的「新增小工具」,並選擇「HTML/JavaScript」工具。在跳出的新視窗裡頭,標題填上「留言版」,內容則是貼上我們剛剛在「ShoutMix」拿到的程式碼。然後按下儲存。Capture44

回到首頁看看,留言版似乎太窄了,和整個面版配起來有點奇怪。Capture46

於是我們再來到後台,點選「留言版」這個小元件的「Edit (編輯) 」打開編輯,並把程式碼裡頭的「width」後頭的數字改成 「230」。然後按下儲存。

 Capture45 Capture47

改過之後,看起來是不是比較合身了一點呢?Capture48

附錄:ShoutMix! 後台其他選項。

Capture22

2.Download MessagesCapture24

3.upgrade shoutbox。ShoutMix 免費帳戶對於某些功能會有所限制,對於需要更多強大功能與自由性的使用者來說,升級服務也是一個選擇。Capture49

4.Logout 登出,這個不用說明了吧。

5.ShoutBox detail,包含使用者聯絡方法和更新密碼的功能。另外,要解除服務也是在這邊。Capture25

6.configuration,如翻譯的。最下面是升級帳號才有的功能,就不翻譯了。Capture26

7.Delete Message,並不能指定要刪除哪一篇留言,只能指定「保留」多少留言而已。 Capture27

8.Website Lock,指定只在特定網域或網址使用此留言版,一樣是升級版專用。Capture28

9.export setting,所有在後台的設定,都可以在這邊下載。同時,匯入 / import 設定也是在這邊。Capture29

10.Style & color,設定 box 的配色,底部有預覽圖可以看。Capture31Capture32

11.Date & time,設定所在地和顯示格式。 Capture33

12.Labels,就是針對box中的各個標籤做更改,也可以改成中文,下面的圖已經幫大家翻譯好了。Capture35 Capture36

13.smilys,表情符號。如果覺得預設的符號不好看,ShoutMix 允許使用者自訂表情符號。免費用戶為 10 個,升級用戶為 500 個。Capture37

14Custom CSS,自訂整個留言版的 CSS,升級用戶專用。Capture38

15.Access control ,控制什麼人可以留言。Capture39

16.Ban Control,黑名單設置。這邊則是提供 IP 位址和網址過濾。Capture40

17.Name proction,保留名字。避免訪客使用的名字。升級者帳戶專用功能。Capture41

18.Protfanity words,過濾字,規定哪些字不可以顯示在留言版中。一樣是升級帳號專屬功能。Capture42

19.ShoutMix Linking,當你擁有超過一個以上的 Shoumix 留言版時,可以將留言版互相連結。一樣是升級使用者的功能。Capture43

好多圖要抓啊。想不到 ShoutMix 有這麼多功能啊!雖然有很多功能都要付費才能用,不過就免費用戶來說,也算足夠了。如果還是覺得不夠用,那就把錢砸下去吧!這樣說,ShoutMix 是不是該給我一些稿費啊?不然讓我抽成也可以~XD。

部落格教學,教你用 Blogspot 建構特色部落格,咱們下次見。( 越來越制式化的感覺。)


| edit post

計數器

Posted on 上午1:18, under ,

再來,我們來談談計數器的功能。這個功能說大不大,說小不小。有的人的部落格裡頭也沒有訪客計數器這個東西。但是,對於經營一個部落格來說,是不是有訪客進來,以及訪客來訪的數量,也可以做為調整部落格內容的一個參考。

好的,這次我們要用的計數器是由 sitmeter 這個網站所提供的免費計數器。sitemeter 提供的計數器有什麼好呢?第一點,當然就是因為它是免費的 (哈!) 。第二點,就算是免費帳號,它也會在每個星期寄一封信給你,告訴你這個星期有多少人來參觀了你的部落格,平均停留的時間有多久。雖然是沒 Google Analytics 那麼詳細的分析,但也是夠用了。

首先,我們來到 sitemeter 的首頁。在首頁我們可以看到一個抖大的字樣“FREE!”,免費,那就是我們要的,把它點下去。Capture01

點下去之後,為了安全起見,sitemeter 還是會再跟你確認一次你要申請的服務是免費的還是付費的?這時候就不要跟它客氣了,點下在“FREE!”旁邊的 SIGN UP!(註冊)Capture02

註冊的第一步,就是填寫你的網站的相關資料。我知道,英文有點惱人,所以我幫大家翻譯好了。 Capture03

網站資料填寫完之後,就是管理者的個人資料的部分了。性別的部份居然有滾軸可以向下?Capture04

上面的資料都填好了,就會來到最後確認的頁面。Capture05

確認資料都沒問題之後,就可以按下一步,完成註冊。下面這個就是完成頁面。完成了之後,我們馬上進入管理介面(manager)設定一下我們的計數器。Capture06

後台的部份,先選擇計數器的樣式。點選一旁的 “meter style”,這邊就可以選則計數器的樣式。我知道,選擇不是很多,但是,功能好最重要,不是嗎? Capture15

選好了之後,拉下來點選“select” 表示已確定。Capture16

再來就是拿取程式碼,點選側欄的“HTML code”項目,就會來到第二張圖的網頁。

Capture07

這邊的 Site Meter JavaScript HTML 就是我們要的東西,把 〈!—Site Meter -- 〉 為開頭的程式碼全部複製起來。Capture08

再來回到我們部落格的後台,進到《版面配置》裡頭的《網頁元素》,計數器一般都是加在側欄的部份,所以我們在側欄的地方點一下《新增小工具》。Capture12

點選《新增小工具》之後,會跳出一個視窗,讓你選擇所需要的工具。這邊我們需要新增的工具是《HTML/JavaScript》,所以就在那個項目旁點下加號《+》。Capture09 Capture10

隨著點選《+》,新增小工具的視窗會關閉,並出現該新增工具的詳細設定。這邊我們就打上“計數器”,再把剛剛從 sitemeter 上複製的程式碼貼到“內容”的部份。然後按下《儲存》。

Capture11

新增完成之後,我們會看到《計數器》這個小工具出現在側欄的最上頭。但是,我們不想要計數器在堆上頭,計數器應該是要在底部偷偷紀錄才是。所以,我們就用滑鼠,按住《計數器》這個小工具,把它“拖”到最下頭來吧。Capture13

當計數器乖乖來到最下層之後,把畫面拉到最上面,不要忘記要按下最後的儲存喔!Capture14

這樣子一切就大工告成了!!趕快回到首頁去看看吧。

教你建構特色 Blogspot ,下次見。(這樣感覺好像什麼育教節目。)

p.s 註冊完 sitemeter 之後,會在信箱收到一封信,裡頭就是寫著 sitemeter 的帳號密碼,以後如果有要更改計數器的設定,就是用這組帳號密碼登入喔!Capture17


| edit post

Blogspot 網頁元素

Posted on 下午11:25, under ,

延續上一篇未完成的首頁中文化,上次提到剩下的兩個部份「Labels」、「Archives」是網頁元素,更改的方式不一樣,反而比較簡單。我們來到《版面配置》中的《網頁元素》的頁面,就可以看到下面的頁面,這就是整個部落格的配置圖。

46-1

把畫面往下拉,我們就可以看到「Labels」、「Archives」這兩個元素。

46-2

而要中文化有多簡單?點一下「Labels」元素旁邊的編輯,會跳出一個元素的設定視窗。

46-3

將標題的「Labels」改為「標籤」,再按儲存就可以了。同樣的「Blog Achives」改為「網頁存檔」。成功後的網頁配置就會變成如下,可以看出已經變成中文了。

46-4

我們看一下最後的結果吧。

46-5

是不是全都中文化了呢!範本教學到這邊正式告一段落!後面將會教大家,如何用 Live writer  以所見即所得的方法新增文章、比無名相本酷絢一百倍的 flash 相本、微形部落格 twitter 、shoutMix 留言系統、用部落格賺錢的方法。請各位朋友期待後面的課程喔


| edit post