liferay5主题制作.doc

Liferay5主题制作说明：通过下载预览liferay功能的文件liferay-portal-tomcat-5.5-5.2.3；来制作主题对机子的性能要求不高。若要直接搭建好的Liferay中制作主题参考，VSS中的“成果资料”中的“主题.rar”(一) 准备文件1) liferay-portal-5.2.3（即下载的liferay-portal-tomcat-5.5-5.2.3包）2) liferay-plugins-sdk-5.2.33) apache-ant-1.8.0 4) lib（一些常用包，该目录复制Liferay环境搭建中的lib包即可）(二) 存放文件1) 将lib文件放在liferay-portal-5.2.3tomcat-5.5.27文件夹下2) 这里我将“liferay-portal-5.2.3”和“liferay-plugins-sdk-5.2.3”放在同级目录中。如下图所示：(三) 配置ANT环境变量 右击“我的电脑”“属性”“高级”“环境变量” 在系统变量中新建“ANT_HOME”情况如下图： （变量值为该软件存放路径）在path中增加%ANT_HOME%bin;(四) 修改文件1) 获取本机计算机名；操作如下： 开始运行cmdset 输入如下图所示：从红色部分就可以知道计算机名为“Administrator”。2) 增加文件重写“perties”文件中某些属性 在“liferay-plugins-sdk-5.2.3”目录下，增加“perties”文件；其中中间的“administrator”就是前面查询出来的计算机名。 在该文件中编写语句如下：app.server.dir=E:/liferay-portal-tomcat-5.5-5.2.3/liferay-portal-5.2.3/tomcat-5.5.27auto.deploy.dir=E:/liferay-portal-tomcat-5.5-5.2.3/liferay-portal-5.2.3/deploy红色部分为相应文件的目录。(五) 用SDK制作主题（1）、 开始运行cmd用命令切换到“liferay-plugins-sdk-5.2.3themes”目录下。如下 创建文件,create test “test” 其中这里的test是名字，自己可以随便命名，如下图则就在“E:liferay-portal-tomcat-5.5-5.2.3liferay-plugins-sdk-5.2.3themes”目录下建立了“test-theme”文件夹。（2）、复制系统主题文件夹到“test-themedocroot_diffs”文件夹中。如： 从“liferay-portal-5.2.3tomcat-5.5.27webappsROOThtmlthemesclassic”下复制“css,images,javascript,templates”这四个文件夹到刚刚创建的“test-themedocroot_diffs”文件夹中。如下图（3）在命令行中输入：ant deploy 进行编译 运行如下图：(六) 启动服务启动liferay-portal-5.2.3tomcat-5.5.27bin目录下的startup.bat批处理文件。(七) 打开网页选择制作的主题登录平台后，选择“管理页面”。如下图接着切换“外观和风格”点击“可用主题模式”中前面编译的主题test-themes.如下图：这个整个页面就切换到该主题。(八) 修改成我们需要的主题进入“liferay-plugins-sdk-5.2.3themestest-themedocroot_diffs”该目录下，可以修改各个文件内容来调整主题。如下图：下面对各文件进行说明：CSS文件中（主题样式文件）：main.css：主样式文件；base.css：基础样式；custom.css：个性化样式；form.css：portlet中form样式；layout.css：布局样式；navigation.css：导航样式；portlet.css：portlet样式；tabs.css：表格样式images文件（主题的图片文件）javascript文件（主题所需要的javascript文件）templates文件（主题的velocity模板文件） portal_normal.vm是整体portal模板，它包括了banner部分，logo微标，dock管理工具， navigation导航部分，portlet容器部分等 navigation.vm 导航模板 dock.vm 管理工具模板 portlet.vm portlet模板 (九) 重新编译进行查看 当对“liferay-plugins-sdk-5.2.3themestest-themedocroot_diffs”该目录下的4个文件修改后，需要查看页面效果。重新编译改文件即可。操作如下： （1）、 开始运行cmd用命令切换到“