作用:
将JCR数据库中的content呈现在你的网站上的一个功能单元
特性:
可复用,可以包含其它的component,有一个标准化的用户界面,
使用widget,editConfig来配置所呈现的用户界面
使用:
通常是找libs/foundation/components下合适的component拷贝至自己的apps下,再进行修改
Name | Type | Description |
. | cq:Component | Current component. A component is of node type cq:Component. |
cq:isContainer | Boolean | Checks if this component is a container component. For example a paragraph system component. |
allowedChildren | String[] | Path of a component that is allowed to be a child of this component. |
allowedParents | String[] | Path of a component that is allowed to be a parent of this component. |
componentGroup | String | Group under which the component can be selected in the Sidekick. |
cq:cellName | String | If set, this property is taken as Cell Id. For more information, please refer to this article in the Knowledge Base. |
cq:noDecoration | Boolean | If true, the component is not rendered with automatically generated div and css classes. |
cq:templatePath | String | Path to a node to use as a content template when the component is added from Sidekick. This must be an absolute path, not relative to the component node.Unless you want to reuse content already available elsewhere, this is not required and cq:template is sufficient (see below) |
dialogPath | String | Path to a dialog in case that the component does not have a dialog node. |
jcr:created | Date | Date of creation of the component. |
jcr:description | String | Description of the component. |
jcr:title | String | Title of the component. |
sling:resourceSuperType | String | When set, the component inherits from this component. |
(**note:** cq:isContainer,allowedParents,allowedChild三组属性是结合在一起使用的,以系统component libs/foundation/components/parsys为例,要想让自定义的component拖入parsys内,必须符合以下条件:
\*. parsys component,即所谓的父component设置cq:isContainer,为true
设置allowedChildren,值为\*,接受所有component
\*.自定义的component,添加属性allowedParents ,值为*/parsys,这样自定义的component才能拖动入parsys中去)
<ul>
下添加了一个div标签,是我所不需要的: cq:noDecoration value=true
,如图: Name | Type | Description |
design_dialog | cq:Dialog | Definition of the design dialog. |
cq:childEditConfig | cq:EditConfig | When the component is a container, as for example a paragraph system, this drives the edit configuration of the child nodes. |
cq:editConfig | cq:EditConfig | Edit configuration of the component. |
cq:htmlTag | nt:unstructured | Returns additional tag attributes that are added to the surrounding html tag. Enables addition of attributes to the automatically generated divs. See Modify the auto-generated DIVs using cq:htmlTag blog post. |
cq:template | nt:unstructured | If found, this node will be used as a content template when the component is added from Sidekick. |
dialog | nt:unstructured | Definition of the edit dialog. |
icon.png | nt:file | Icon of the component, appears next to the Title in Sidekick. |
thumbnail.png | nt:file | Optional thumbnail that is shown while the component is dragged into place from Sidekick. |
\* | cq:ClientLibraryFolder | define the component's js and css style |
virtual | sling:Folder | Enables creation of virtual components. To see an example, please look at the contact component at /libs/foundation/components/profile/form/contact. |
component下的dialog和design_dialog是页面的两种维护模式,dialog是在edit mode下编辑的,而design_dialog是在design模式下编辑的;
功能点: 禁用图片的上传功能,只能由content finder里拖动资源,
设置component下…/dialog…/items/image(jcr:primaryType为cq:Widget),为该image widget添加属性allowUpload :
Name: allowUpload
Type: String
Value: false
即可。
component下的每个jsp文件头部引入global.jsp文件%@include file="/libs/foundation/global.jsp"%
引入该文件后相当于默认初始化了一些jsp标签和类:
e.g slingRequest ,slingResponse ,resource,resourceResolver,currentNode ,log ,sling ,properties ,pageProperties ,pageManager ,component ,designer ,currentDesign ,currentStyle
properties, currentPage, currentNode
JSP标签库,cq标签库以及Sling标签库。
editConfig's properties:
properties1-cq:actions (String array): 定义该component呈现的操作,
properties2-cq:layout (String): : 定义该component修改,删除等功能的呈现方式,值有:rollover,editbar,auto三种,默认rollover点击弹出修改对话框,上图中edit等操作的触发方式是点击edit等的按钮,这就是layout设置为editbar的效果
properties3-cq:dialogMode (String): 可设置的值有: floating,inline,auto默认inline,嵌入页面的方式进行编辑,设置为floating时是以页面的弹出框的方式编辑,见下图,第一个是嵌入页面的方式,其二个是以弹出对话框的方式呈现的
properties4-cq:emptyText (String): defines text that is displayed when no visual content is present.
properties5-cq:inherit (Boolean): defines if missing values are inherited from the component that it inherits from.
cq:dropTargets node (node type nt:unstructured)
定义该component可从content finder接受的资源的类型,组等
为该component添加监听器,如(before/after)(edit/copy/insert/move/childinsert/delete),
规定执行这些操作之前\/之后执行的事件.如图
第一次用markdown,搞得好累!!!