Gallery pro模块定制需要掌握的知识

 
公司演示站点地址http://module.dnngo.net/en-us/DNNGalleryPro
定制之前需要熟悉所有主题的外观和一些功能特点
常常用到的效果http://module.dnngo.net/en-us/ ... lider 这个主要是循环一张图片,一般会修改左右导航外观,如下图红色区域
定制模块的作用:让客户通过可视化的字段进行填写,添加完成后字段会按照一种规律的外观进行动态展示。模块可以根据客户的不同设置自行变化。
Gallery_pro模块定制需要掌握的知识258.png

在服务器中的路径 \\192.168.0.12\需要定制修改的站点\DesktopModules\DNNGo_DNNGalleryPro\Effects------主题路径
1.当定制一个新的主题的时候,我们需要新建一个主题,特别是涉及到对模块结构的修改,为了避免升级的时候默认主题文件被覆盖导致定制主题丢失。
2.根据定制主题的要求,我们会找一个结构比较接近的主题进行复制,这样定制起来比较快,新建了主题后首先要修改主题文件中的SkinDB.xml文件中的
<DNNGo_DNNGalleryPro>
<EffectDB>
<Name>
<![CDATA[Effect_12_UnoSlider]]>
<!--模版名称:必须和模版的文件夹名称保持一致-->
</Name>
<!--这里是让模块主题设置中能够找到新主题而定义的名字,需要跟文件夹的名字一样-->
<Description>
<![CDATA[UnoSlider is an advanced image and content slider which is built with responsive design and mobile devices in mind.]]>
</Description>
<!--模块的简介-->
<Version>
<![CDATA[01.02.02]]>
</Version>  
<!--版本号-->
<Thumbnails>
<![CDATA[http://www.dnngo.net/DesktopMo ... w.jpg]]>
</Thumbnails>
<!--这里是定义主题缩略图的地方-->
<EffectScript>
<![CDATA[unoslider.dev.js,unoslider.css]]>
</EffectScript>
<!--这里是当前主题需要调用的js和css文件,(当前效果特有的)只需要将文件放到对应文件夹就会自动加载--> <GlobalScript>
<![CDATA[]]>
</GlobalScript>
<!--这里是公共的脚本库,如果需要就可以填写。
<DemoUrl>
<![CDATA[http://www.dnngo.net/OurModule ... .aspx]]>
</DemoUrl>
<!--演示地址-->
<Responsive>
<![CDATA[true]]>
</Responsive> 
<!--支持响应式-->
</EffectDB>
</DNNGo_DNNGalleryPro>
\\192.168.0.12\需要定制修改的站点\DesktopModules\DNNGo_DNNGalleryPro\Effects
Gallery_pro模块定制需要掌握的知识1757.png

js当前效果用到的脚本
css当前效果用到的样式(一般是脚本需要用到的样式)
theme不同的主题效果css,结构不变的情况下,各种css控制
--Theme_12_Modern 效果文件夹
---
Gallery_pro模块定制需要掌握的知识1858.png

Effect.html控制主题结构的地方
EffectDB.xml定义主题,让模块能够识别当前主题的文件
EffectSetting.xml主题的设置都在这里*
Gallery_pro模块定制需要掌握的知识1941.png

SliderSetting.xml每个item的设置,也可以说是字段,数据来源
Gallery_pro模块定制需要掌握的知识1983.png

Gallery_pro模块定制需要掌握的知识1985.png

模块设置界面介绍
Gallery_pro模块定制需要掌握的知识1998.png

ALL Sliders 所有已经添加的item都在这里先,可以对item进行修改编辑,添加,删除
Add New 添加新的item
Impor&Eport 导入导出数据,我们公司相同的模块是可以进行数据转移,转移后的图片需要重新上传,出发图片通过在线相对路径进行添加
Library 媒体库,上传的附件和图片都在这里进行管理
Effects 效果相关设置
--Options 可以选择使用不同的css控制效果外观和一些自带设置
-- Effect List 效果列表,在这里选择使用哪个结构
--Style 当前效果的css,可以直接在这里进行修改
General
License 激活码,模块上传到客户站点之后必须要激活,一个模块只需要激活一次。
 
重点:定制模块的时候要根据客户要求进行更改结构
#if($SliderList.Count > 0)
#foreach($SliderItem in $SliderList)
这里是需要循环的结构,会被循环输出,
#end
#end
判断取值是否符合
#if(${xf.ViewSliderSetting($SliderItem,"Description","")} != "") #end
输出item中Description字段的值(在每个数据中)
${xf.ViewSliderSetting($SliderItem,"Description","")}
 
输出设置slideshow_infinite字段的值(主题设置中)
${xf.ViewXmlSetting("slideshow_infinite","true")}
 
写在最后
1.不同模块之间除了字段值获取代码不一样之外,没有什么别的区别
2.尽量使用现有模块的代码,或者别的主题的代码可以借鉴。这样制作效率会很高,
3.活用#if #end可以做出很多好的效果。
4.书写习惯要规范,避免缺失闭合代码
5.如果客户提出用什么插件或者脚本,我们只需要将固定的字段替换成模块输入的字段,这样就是一个模块定制的过程。
 
练手附件
 

0 个评论

要回复文章请先登录注册