页面模板

半个月前,第一次真正意义上的接触页面模板,以前都是在搭好的框架里写写模块,页面样式基本也都是早已存在的,因而一直没有什么强大的认识,一直傻傻的认为页面的样式是一点一点写出来的。

有一次,模块出错,调了多次任无力回天,于是让老大帮忙调了一下,老大看着浏览器上苍白的页面,没有说话,默默地在网上搜了一个比较好看的页面模板,然后,开始了看似漫长的修改。页面其实也没有想像的那么夸张,把模板的js、images、css复制到项目中后,然后在页面中引入要用到的js、css、等文件,可以在框架中引入header和footer文件,然后在页面中修改修改对应组件的class就行了。

还别说,加入页面模板,看起来瞬间就专业多了。

*下面附上ofbiz框架的修饰器:

<screenname="main-decorator">

<section>

<actions>

<property-mapresource="StorageUiLabels"map-name="uiLabelMap"global="true"/>

<property-mapresource="CommonUiLabels"map-name="uiLabelMap"global="true"/>

<property-mapresource="StorageLabels.xml"map-name="uiLabelMap"global="true"/>

<setfield="layoutSettings.shortcutIcon"value="/storage/images/Storage.ico"global="true"/>

<setfield="layoutSettings.styleSheets[]"value="/storage/images/css/bootstrap.css"global="true"/>

<setfield="layoutSettings.styleSheets[]"value="/storage/images/css/site.css"global="true"/>

<setfield="layoutSettings.styleSheets[]"value="/storage/images/css/bootstrap-responsive.css"global="true"/>

<setfield="layoutSettings.javaScripts[]"value="/storage/images/js/jquery.js"global="true"/>

<setfield="layoutSettings.javaScripts[]"value="/storage/images/js/bootstrap.min.js"global="true"/>

<setfield="headerTemplateLocation"from-field="layoutSettings.VT_HDR_TMPLT_LOC[0]"default-value="component://storage/webapp/storage/includes/header.ftl"/>

<setfield="footerTemplateLocation"from-field="layoutSettings.VT_FTR_TMPLT_LOC[0]"default-value="component://storage/webapp/storage/includes/footer.ftl"/>

<setfield="leftTemplateLocation"from-field="layoutSettings.VT_FTR_TMPLT_LOC[0]"default-value="component://storage/webapp/storage/includes/left.ftl"/>

</actions>

<widgets>

<platform-specific><html><html-templatelocation="component://storage/webapp/storage/includes/headerHead.ftl"/></html></platform-specific>

<containerid="header"><platform-specific><html><html-templatelocation="${headerTemplateLocation}"/></html></platform-specific></container>

<containerstyle="container-fluid">

<containerstyle="row-fluid">

<containerstyle="span3">

<platform-specific><html><html-templatelocation="${leftTemplateLocation}"/></html></platform-specific>

</container>

<!--<platform-specific><html><html-templatelocation="component://common/webcommon/includes/messages.ftl"/></html></platform-specific>-->

<platform-specific><html><html-templatelocation="component://storage/webapp/storage/messages.ftl"/></html></platform-specific>

<containerstyle="span9">

<containerstyle="row-fluid">

<decorator-section-includename="body"/>

</container>

</container>

</container>

<containerid="footer"><platform-specific><html><html-templatelocation="${footerTemplateLocation}"/></html></platform-specific></container>

</container>

</widgets>

</section>

</screen>

css

相关推荐