2010年4月16日 星期五

無痛Java程式設計(四):安裝MyEclipse

 

Eclipse是一套業界頂頂有名的程式「整合開發環境(IDE)」

以強大的彈性以及大量的外掛程式讓很多程式設計師愛不釋手

而且它也是一套免費軟體(Freeware)

 

不過今天跟大家說明的是以Eclipse為基礎

整合一些好用的外掛程式的軟體---MyEclipse

這套軟體需要付費

不過很多設定都已經設定好

程式設計師只要安裝完畢就可以開始程式設計的工作

非常方便

 

以下是安裝程序,以6.0.1 GA為例:

1. 執行MyEclipse安裝程式

1

 

2. 點選「Next」2

 

3. 點選「I accept the terms of the License Agreement」

再按「Next」

3

 

4. 點選「Next」4

 

5. 點選「Next」5

 

6. 點選「Next」

6

 

7. 點選「Install」7

 

8. 點選「No - Do not open the release notes」

再按「Next」

8

 

9. 點選「Done」

此時MyEclipse就已經安裝完畢

9

 

 

接下來測試剛剛安裝的MyEclipse正不正確:

1. 點選「開始/所有程式/MyEclipse 6.0/MyEclipse 6.0」10

 

2. 第一次執行時,MyEclipse會問我們預設程式碼的位置

為了方便日後找尋,我們把它改到「C:\workspace」

勾選「Use this as the default and do not ask again」

在點選「OK」

11

 

3. 這個時候MyEclipse會要我們購買或是輸入序號

如果你已經購買的話,請點選「Enter Subscription…」

如果是試用的話,請點選「Close」

12

 

4. 輸入「Subscriber」、「Subscription Code」,再按「Finish」13

 

5. 接下來建立一個Java專案:

點選「File/New/Java Project」

14

 

6. 在「Project name」取個「HelloWorld」的專案名稱

在點選「Finish」

15

 

7. 新增一個專案之後,接著再專案底下建立類別

在src上面點選滑鼠右鍵,選擇「New/Class」

16

 

8. 接著在「Name」欄位幫這個類別命名為「HelloWorld」

在點選「Finish」

17

 

9. MyEclipse會幫我們建立簡單的內容18

 

10. 根據下圖輸入19

 

11. 輸入完畢之後,試試看程式是否能正確執行

在「HelloWorld」專案上方點選滑鼠右鍵

選取「Run As/2 Java Application」

20

 

12. 正確無誤的話就可以在下方的「Console」視窗看到程式執行結果21

 

很有質感的Blog天氣預報元件

 

如果想在Blog放置天氣預報的小圖案

讓大家也能順便知道外面的天氣時

這個很有質感的天氣預報元件就派的上用場了

 

1. 在網址列輸入「weatherlet.com

2. 直接在中間位置輸入你想呈現的天氣預報位置

這邊以台北為例,因為是外國的網站,所以輸入Taipei

輸入完畢之後點選我們比較熟悉的攝氏(oC)

最後點選「Get Weather」

image

 

3. 複製網站呈現的語法

image

 

4. 回到Blogger的後台

點選「版面配置/網頁元素」,在喜歡的欄位點選「新增小工具」

image

 

5. 點選「HTML/JavaScript」

image

 

6. 把剛剛複製起來的語法貼上

image

順便在「標題」欄輸入「台北天氣」,再按「儲存」

image

 

7.  首先把「台北天氣」這個區塊拖曳到適合的位置,再點選「儲存」

image

 

8. 此時Blogger會顯示「您的變更已儲存」,再點選「檢視網誌」

image

 

9. 這個時候我們就可以看到很漂亮的天氣圖案出現了

image

 

讓別人也能在你的Blog自由留言,建立方便溝通管道~

 

讓瀏覽你的Blog的人也能自由留言有時候蠻重要的

原本的Blog系統一般只能在文章後面留言

可是如果瀏覽者只想問其他跟文章無關的事情

就沒有合適的地方留言

之前試過Google的「網上論壇」也曾想過嵌入Plunk的元件

可是這都有一個困擾

就是留言者一定要有Google或是Plunk的帳號才能留言

雖然有這兩個網站帳號的人也很多

不過依然會排除掉沒有這些帳號的朋友

今天逛「摩卡小天地」的Blog時,剛好看到一個蠻好用的留言版元件

正好符合我的需求

所以就找了一下資料開始安裝~~

 

底下是安裝的步驟:

1. 在網址列輸入「www.cbox.ws/index.php

接著進行免費註冊,點選「sign up」

image

 

2. 在紅色框框位置輸入以下資訊:

Cbox name:輸入自己在CBOX的帳號

Email address:輸入自己的電子郵件

Password:輸入想要的密碼

Confirm Password:再次輸入密碼

Website:自己Blog的網址

Language:使用的語言

Style:想要什麼類型的風格(之後還可以改)

image

 

3.  正確的話請輸入剛剛申請的帳號跟密碼,正式登入

image

 

4.  點選「Look & Feel/Layout Options」

image

 

5. Look & Feel/Layout Options主要是設定留言版的版面

Width and height:留言版的寬跟高

Form layout:表格的版面規劃

Messages:要顯示多少訊息

設定好記得要按「Save」按鈕儲存

image

 

6. Look & Feel/Style gallery可以讓使用者挑選預設的範本

image

 

7. Look & Feel/Colours & Fonts:用來調整顏色跟字型

如果對範本的顏色還有字型不滿意的話

可以依個人喜好自行設定

image

 

8. Look & Feel/Edit CSS:調整CSS設定

如果你懂CSS語法的話

這邊也提供完整的客製化設定

image

 

 

9. Option/posting Options:調整留言的設定

Message Length:訊息最大可以保留多少則

Message options:訊息選項

Anti-spam protection:聽說是可以阻擋機器人亂發的垃圾訊息

image

 

10. Options/Date Options:日期設定

Example:下面的設定變更會顯示在這裡,看看是不是喜歡的樣子

Date & formatting:設定年月日的排列順序、12/24小時制、時區

Date display:日期顯示在訊息的上方或下方

image

 

11. Options/Emotions:設定表情圖案

可以修改表情圖案的輸入符號或是上傳個人喜歡的表情圖案

image

 

 

12. 所有設定都好了之後,點選「Publish!」

網站會根據剛剛的設定產生HTML的語法

按「Copy to clipboard」就可以把這串語法貼到剪貼簿上

image 

13. 接著回到Blogger的後台

點選「版面配置/網頁元素」,在喜歡的欄位點選「新增小工具」

image

 

14. 點選「HTML/JavaScript」

image

 

15. 把剛剛複製起來的語法貼上,再按「儲存」

image

 

16. 這時候我們就可以把剛剛的「HTML/JavaScript」拖到喜歡的位置

image

 

17. 此時畫面會顯示”您的變更以儲存”,點選「檢視網誌」

image

 

18. 這時候我們就可以看到留言版出現在Blog上了~~~

image

 

這個網站設計的非常簡約

不過卻提供很大的彈性讓使用者自己修改留言版的版面

蠻好用的一個元件 :D

 

2010年4月14日 星期三

Blog建置(二):套用既有範本

 

通過上一篇文章,我們已經跟Google申請了一個免費的Blog

Google原本的範本可選擇性不多

而且很容易跟別人撞衫

所以我們底下介紹幾個提供Blogger範本的網站給大家參考:

 

BTemplates

精選 Blogger Template 網站

找不到漂亮的模板給 Blogger 用嗎?快來看看!(50 個漂亮的模板)

Blogger Template 模版下載網站全收錄

 

以第一個網站為例

這篇文章將帶領大家尋找適合自己網站的範本

並套用到自己的網站上

 

1. 點選BTemplates進入該網站

image

 

2. 網頁一開始就顯示很多的範本給大家參考

A:大家可以根據網站幫我們做的分類來尋找自己心目中的範本

 

Columns:根據網站的欄位數分類,1到4欄都有

Styles:根據網站的風格分類

Colors:根據網站的底色分類

Sidebar:根據網站「側邊欄」靠左還是靠右來分類

Width:根據網站是否根據使用者螢幕大小調整範圍來分類

 

B:如果看的不過癮,還可以一直翻頁看下去~

C:如果已經有特定主題或佈景想法,也可以直接下英文關鍵字搜尋

image

 

3. 假設我們已經選好自己喜歡的範本,可以直接點選該範本的圖片

image

 

4. 接下來直接點選「Download」

image

 

5. 此時彈跳出另存檔案視窗,我們把這個範本壓縮檔存到桌面

image

結果如下圖

image

6. 解壓縮後出現的文件夾

image

文件夾內容如下,一定會有一個檔案的附檔名是.xml

這就是範本的設定檔!

image

 

7. 接著我們回到Blog的後台

選擇「版面配置/修改HTML」,點選「瀏覽」

image

 

8. 此時會彈出選取檔案的視窗

選取剛剛解壓縮文件夾的位子,點選裡面唯一的xml檔

再按「開啟舊檔」

image

 

9. 點選「上載」按鈕,將範本設定套用到我們的網站上

image

 

10. 此時有可能會出現以下訊息

確認LinkList98跟HTML1的小工具是不是要保留

如果確定請按橘色的「保留小工具」

否則按「刪除小工具」

image

 

11. 我們可以看到Google Blogger告訴我們範本變更已經完成

點選上方的「檢視網誌」

image

 

12. 我們就可以發現新的版面已經完成嘍

如果不滿意的話可以重新下載其他範本試試看

直到找到滿意的為止 :D

image

 

Related Posts with Thumbnails
by TemplatesForYou-TFY
SoSuechtig