怎么使用CQ5來開發(fā)網(wǎng)站
1. 建立項(xiàng)目結(jié)構(gòu)在“CRXDE Lite”里
a. 右鍵點(diǎn)擊”apps”—“Create”—“Create Folder…” ,在彈出的對(duì)話框里寫入項(xiàng)目名字,如“demoNoah”
b. 右鍵點(diǎn)擊剛創(chuàng)建的文件夾”apps/demoNoah”—“Create”—“Create Folder…” ,在彈出的對(duì)話框里寫入“components”。
c. 用同樣的方法在建立另外一個(gè)文件夾“templates”
建完后的目錄結(jié)構(gòu)如下:
2. 設(shè)計(jì)頁(yè)面的實(shí)現(xiàn)
a. 首頁(yè)打開CQ5的另外 一個(gè)工具“CQ5WCM”點(diǎn)擊如圖所示的“Tools”按鍵
b. 選擇左邊樹中的“Designs”文件夾,然后,點(diǎn)擊“New…”—“New Page…”,然后輸入“demoNoah”作為標(biāo)題。刷新。
c. 回到之前的視圖“CRXDE LITE”中,找到“designs”文件夾,右鍵點(diǎn)擊剛才建好的文件夾,并依次建立“static.css”文件和“images”文件夾。
d. 雙擊剛建的“static.css”文件,在打開的右側(cè)窗口中考入或輸入提前定義好的CSS,比如























e. 對(duì)于“images”文件夾里的圖片,有兩種方式上傳,如果你配置了WebDAV,可能通過電腦資料管理器直接訪問,直接考入。如果沒有配置的話,也可以通過工具“CQ5WCM”中的“Tools”去上傳,選擇左側(cè)樹中的“images”,然后,點(diǎn)擊“New”—“New File…”,在彈出的對(duì)話框中選擇你要上傳的圖片,可多選。
3. 創(chuàng)建頁(yè)面模板
a. 再次進(jìn)入到之前的視圖“CRXDE LITE”中,找到之前建立的項(xiàng)目,右鍵點(diǎn)擊“/apps/demoNoah/templates”,選擇“Create”—“Create Template…”
b. 在彈出的窗口中輸入下面的內(nèi)容,然后點(diǎn)擊“Next”。




c. 接下來的窗口是讓你輸入哪些路徑可以使用這個(gè)Template,這里輸入“/content(/.*)?”表示所有的頁(yè)面都可能使用。
d. 在接上來的Allowed Parents 和 Allowed Children 窗口中不需要填東西,直接Next,直到完成就可以了。
e. 然后,點(diǎn)左上角的“Save All”。
4. 創(chuàng)建頁(yè)面組件
a. 同樣在CRXDE Lite里,右鍵點(diǎn) /apps/demoNoah/components 并且選擇 “Create” –“ Create Component…”.
b. 在彈出的窗口中輸入下面內(nèi)容,并且點(diǎn)“Next”



c. 直接跳過接下來的對(duì)話框,點(diǎn)完成。
5. 定義組件,或叫開發(fā)組件,總之開使往組件里寫代碼了。
a. 雙擊“/apps/demoNoah/components/contentpage/ contentpage.jsp”在右側(cè)打開的窗口中輸入(保留原來的代碼)



















b. 點(diǎn)擊“Save All” 或直接Ctrl+S。
6. 創(chuàng)建自己的網(wǎng)頁(yè)
a. 回到“CQ5 WCM”,選擇“Websites”鍵鈕。
b. 選擇根目錄“Websites”,然后點(diǎn)擊“New”—“New Page…”
c. 在彈出的窗口按下列內(nèi)容輸入和選擇




d. 點(diǎn)擊“Create”按鈕,完成此頁(yè)面的創(chuàng)建。
e. 選擇剛創(chuàng)建的頁(yè)面,用同樣的方法再次創(chuàng)建頁(yè)面“New”—“New Page…”
f. 在彈出的窗口按下列內(nèi)容輸入和選擇




g. 選擇剛創(chuàng)建的頁(yè)面,用同樣的方法再次創(chuàng)建頁(yè)面“New”—“New Page…”
h. 在彈出的窗口按下列內(nèi)容輸入和選擇



i. 更多頁(yè)面可按自己喜好建立。頁(yè)面結(jié)構(gòu)如下
j. 回到CRXDE Lite里,定位到/content/mywebsite/en/jcr:content
k. 在右側(cè)下方的屬性欄里添加如下屬性



l. 這里多加一步,用來確認(rèn)填寫的內(nèi)容是否正確,請(qǐng)仔細(xì)檢查下圖的這三項(xiàng)內(nèi)容
m. 確認(rèn)無誤后,回到“CQ5 WCM”下,在左側(cè)選中“My Website”.
n. 在右側(cè)雙擊“English”,會(huì)打開新建好的網(wǎng)頁(yè)。
o. 目前為止頁(yè)面已經(jīng)可以顯示了,但沒有任何組件可以用。還需要為頁(yè)面開放一些可用的系統(tǒng)組件,點(diǎn)擊如下圖的尺子
p. 然后,點(diǎn)擊“Edit”,并且選擇“General”,然后點(diǎn)OK
q. 剩下的事情我想你應(yīng)該知道了,趕快添加一些組件試試吧。
到此整個(gè)過程完成,CQ5里面還有很多自帶的功能和組件,需要自己去研究去發(fā)現(xiàn)。這里不再一一講解。
眼鏡蛇
posted on 2013-06-26 09:46 眼鏡蛇 閱讀(497) 評(píng)論(0) 編輯 收藏 所屬分類: CQ5