怎么使用CQ5來開發(fā)網(wǎng)站

          CQ5用的人非常少,在中國(guó)更是少之更少。并且,中文方面的資料可以說為0.在這里我就先為大家拋塊磚,簡(jiǎn)單的介紹一下CQ5的使用,比如怎么站一個(gè)網(wǎng)站,怎么建一個(gè)template,怎么為網(wǎng)站加CSS樣式,圖片等,怎么開發(fā)組件等等吧

          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,比如

          /* general */
          body  
          {
              background
          : white;
              color
          : black;
          }

          body, img, a, td, th 
          {
              font
          :normal 11px Tahoma, Geneva, Arial, Helvetica, sans-serif;
              padding
          : 0 0 0 0;
              margin
          : 0 0 0 0;
              border
          : 0;
          }

          body a       
          {color:#4F960F;}
          body b a     
          {font:bold 11px Tahoma, Geneva, Arial, Helvetica, sans-serif; color:#4F960F; }
          body a:hover 
          {text-decoration:underline;}
          body span    
          {color:#8F8F8F; font-size:10px}
          body b       
          {font:bold 11px Tahoma, Geneva, Arial, Helvetica, sans-serif; color:#0D5FA5; font-style:inherit;}
          body strong  
          {font:bold 11px Tahoma, Geneva, Arial, Helvetica, sans-serif; color:#0D5FA5;}
          {text-decoration:underline }
          body H1 
          {
              margin-top
          :6px;
              margin-bottom
          :23px;
          }

          e.       對(duì)于“images”文件夾里的圖片,有兩種方式上傳,如果你配置了WebDAV,可能通過電腦資料管理器直接訪問,直接考入。如果沒有配置的話,也可以通過工具“CQ5WCM”中的“Tools”去上傳,選擇左側(cè)樹中的“images,然后,點(diǎn)擊“NewNew File…,在彈出的對(duì)話框中選擇你要上傳的圖片,可多選。


          3.       創(chuàng)建頁(yè)面模板

          a.       再次進(jìn)入到之前的視圖“CRXDE LITE”中,找到之前建立的項(xiàng)目,右鍵點(diǎn)擊“/apps/demoNoah/templates,選擇“CreateCreate Template…

          b.      在彈出的窗口中輸入下面的內(nèi)容,然后點(diǎn)擊“Next”。

          Label: contentpage
          Title: My Website Content Page Template
          Description: This is my Website Content Page Template
          Resource Type: demoNoah/components/contentpage

          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

          Label: contentpage
          Title: My Website Content Page Component
          Description: This is My Website Content Page Component

          c.       直接跳過接下來的對(duì)話框,點(diǎn)完成。

          5.       定義組件,或叫開發(fā)組件,總之開使往組件里寫代碼了。

          a.       雙擊“/apps/demoNoah/components/contentpage/ contentpage.jsp”在右側(cè)打開的窗口中輸入(保留原來的代碼)

          <%@taglib prefix="cq" uri="http://www.day.com/taglibs/cq/1.0" %><%
          %>
          <cq:include script="/libs/wcm/core/components/init/init.jsp"/>
          <cq:defineObjects />
          <%@ page language="java" contentType="text/html; charset=ISO-8859-1"    pageEncoding="ISO-8859-1"%> 
          <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
           
          <html>
           
          <head>
           
          <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
           
          <title>My title</title>
           
          </head>
           
          <body>
           
          <div>Hello world!</div>
          <div class="center"> 
              
          <div><cq:include path="par" resourceType="foundation/components/parsys"/></div> 
          </div>
           
          </body> 
           
          </html>


          b.       點(diǎn)擊“Save All 或直接Ctrl+S

          6.       創(chuàng)建自己的網(wǎng)頁(yè)

          a.       回到“CQ5 WCM”,選擇“Websites”鍵鈕。

          b.      選擇根目錄“Websites,然后點(diǎn)擊“NewNew Page…

          c.       在彈出的窗口按下列內(nèi)容輸入和選擇

          Title: My Website
          Name: mywebsite
          Select the My Website Content Page Template


          d.       點(diǎn)擊“Create”按鈕,完成此頁(yè)面的創(chuàng)建。

          e.      選擇剛創(chuàng)建的頁(yè)面,用同樣的方法再次創(chuàng)建頁(yè)面“NewNew Page…

          f.       在彈出的窗口按下列內(nèi)容輸入和選擇

          Title: English
          Name: en(這個(gè)要注意,這個(gè)代表的是國(guó)際化的標(biāo)識(shí),不能錯(cuò),以后會(huì)用得到)
          Select the My Website Content Page Template

          g.       選擇剛創(chuàng)建的頁(yè)面,用同樣的方法再次創(chuàng)建頁(yè)面“NewNew Page…

          h.      在彈出的窗口按下列內(nèi)容輸入和選擇

          Title: Products
          Select the My Website Content Page Template

          i.       更多頁(yè)面可按自己喜好建立。頁(yè)面結(jié)構(gòu)如下


          j.       回到CRXDE Lite定位到/content/mywebsite/en/jcr:content

          k.      在右側(cè)下方的屬性欄里添加如下屬性

          Name: cq:designPath
          Type: String
          Value: /etc/designs/demoNoah


           

          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

          <2025年6月>
          25262728293031
          1234567
          891011121314
          15161718192021
          22232425262728
          293012345

          導(dǎo)航

          統(tǒng)計(jì)

          常用鏈接

          留言簿(6)

          隨筆分類

          隨筆檔案

          文章分類

          文章檔案

          搜索

          最新評(píng)論

          閱讀排行榜

          評(píng)論排行榜

          主站蜘蛛池模板: 娱乐| 辽中县| 怀化市| 巴林右旗| 库伦旗| 若尔盖县| 尉氏县| 怀集县| 二连浩特市| 武川县| 株洲县| 信宜市| 武鸣县| 姚安县| 四川省| 清新县| 泰州市| 静海县| 宜兰县| 阜平县| 元阳县| 富民县| 南乐县| 察哈| 津市市| 西藏| 南丹县| 苗栗县| 永丰县| 武山县| 新乡县| 甘孜县| 常州市| 天峨县| 筠连县| 万州区| 天水市| 西乌| 左权县| 西青区| 固安县|