页面模板制作

dedecms建站移动化问题，从6.18织梦更新手机站后问题就解决了，下面是对网站系统做的一些升级记录（记得升级之前一定要备份，切记）以网站http://boaer.com为例：第一步：下载官方升级文件v57sp1-20150618.zip （记得升级之前一定要备份，切记）第二步：解压覆盖原来的文件。上传到服务覆盖之前的文件。第三步：对模板文件的修改。复制以前的老模板文件，分别加上一下代码：首页：<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/index.html"><script type="text/javascript">if(window.location.toString().indexOf('pref=padindex') != -1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?mobile")<0){try{if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/index.html";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}</script>栏目页<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/list.php?tid={dede:field.id/}"><script type="text/javascript">if(window.location.toString().indexOf('pref=padindex') != -1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?mobile")<0){try{if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/list.php?tid={dede:field.id/}";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}</script>文章页面<meta http-equiv="mobile-agent" content="format=xhtml;url={dede:global.cfg_mobileurl/}/view.php?aid={dede:field.id/}"><script type="text/javascript">if(window.location.toString().indexOf('pref=padindex') != -1){}else{if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){if(window.location.href.indexOf("?mobile")<0){try{if(/Android|Windows Phone|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){window.location.href="{dede:global.cfg_mobileurl/}/view.php?aid={dede:field.id/}";}else if(/iPad/i.test(navigator.userAgent)){}else{}}catch(e){}}}}</script>建议把其中的{dede:global.cfg_mobileurl/} 修改为手机站网站，例如修改成http://m.boaer.com/ 。这代码的主要含义是手机跳转到手机页面。对手机端模板修改，主要是添加统计代码，对css的一些调整，手机模板也存在于默认模板下.主要的有：header_m 顶部index_m   首页footer_m  底部index_default_m  列表页修改之后覆盖。解决验证码失效问题：直接取消验证码1、打开 login.php 找到：if($validate==” || $validate != $svali)替换为：if( false )2、在模板文件dede/templets/login.htm里去掉以下验证码的具体HTML代码：<li><span>验证码：</span>   <input name=”validate” type=”text” id=”vdcode” style=’width:50px;text-transform:uppercase;’ />   <img id=”vdimgck” src=”../include/vdimgck.php” alt=”看不清？点击更换” align=”absmiddle” style=”cursor:pointer” onclick=”this.src=this.src+’?'” /></li>第四步：把二级目录变为二级域名，就可以方位手机站了。网址：http://www.boaer.com/m/ 为了更友好，可以把二级目录变为二级域名。1、解析二级域名到服务器IP。2、解决图片不显示的问题。把图片变成绝对地址改目录include下的文件extend.func.php，在最后面添加一个函数方法function replaceurl($newurl){$newurl=str_replace('src="/uploads/allimg/','src="http://你的域名/uploads/allimg/',$newurl);return $newurl;}另外调用文章正文内容的标签{dede:field.body/}需要改成： {dede:field.body function='replaceurl(@me)'/}此方法可以适用于任何调用绝对路径图片的页面。手机访问网站时就会自动跳转到手机站网址了。其他问题可以去DEDECMS官方论坛看看，或者百度搜索基本上都能找到答案。

设置和制作word模板操作方法：1.首先新建一个空白文档，并另存为“Normal.dotm（Word2007及以后版本）Normal.dot（Word2003-2007版本）”，如图所示。2.进行需要的模板设置，对字体、段落、页眉页脚，页面边距等进行设置，具体操作如图。3.对字体、段落的设置：在空白的新文档中，右击进行对字体的设置，在设置完成后，点击“默认”按钮。4.对页眉页脚，页面边距：同样在菜单栏，选择插入"页眉页脚"进行设置，设置后点击“默认”按钮，并同时设置“页面边距”并点击“默认”按钮。5.在全面进行模板设置后，需要保存，在操作中会出现对一些“默认的设置”如果所示，要选择“是”，“你准备将默认的字体更改为.....，是否将此更改应用于所有基于NORMAL模板的新文档？”6.把刚才保存的模板，复制起来，在打开“C:\Users\Administrator\AppData\Roaming\Microsoft\Templates”替换原有的Normal.dotm或Normal.dot。关闭。7.测试效果：打开一个Word文档，并按下“CTRL+N”新建一个空白文档，任意输入内容，可以看到是刚才设置的模板，如页面边距：版面上空3.5cm，下空3cm，左空2.8 cm，右空2.8 cm；页面页脚为：页眉1.8，页脚2.3；段落为：标题段落38磅；正文段落29.8磅；字距加宽0.3磅。设置和制作onenote模板方法如下：1.利用模板库中丰富的图案帮助做页面的美化工作，然后在空白页面输入自己想要的模板内容即可。2.编辑好内容和格式后，我们同样也可以另存为自己的模板，点击右下角的“将当前页另存为模板”，并命名“模板名称”，勾选“设为当前分区中新页的默认模板”即可。以后写日计划时添加页面就是“职场小强的日计划”模板内容啦。同时，在模板库中也会新增“我的模板”这一项内容。

　　HTML5页面制作工具，大体分为两类：基于HTML5的网站工具和手机APP工具（当然还有一些其他的，例如基于微信公众号的等，下面也会介绍）。　　先总的说一下个人感受1.基于HTML5的工具网站：功能较强大，单页面的操作性较强，可完成各种页面交互效果；但是某些时候会有操作“失灵”的现象，如上传图片失败，点击保存失败，生成失败等。原因你懂得~2.手机工具APP：相比起工具网站来讲，显得比较顺手，有大量模板套用，制作简单快捷；但是拘泥于现有的模板，使得单页面不会有较大的可操作空间，从而无法实现DIY交互效果。　　下面展开说下每个使用过的工具吧基于HTML5的工具网站：【兔展】 优点：页面DIY程度较高，动效实现起来也简易方便，可制作比较任性的H5页面。缺点：屏幕界面大小不可调节，上传的图会比例失调；生成后到各尺寸屏上页面会存在拉伸现象。（此图意在说明上传的图片的尺寸都是网站自己默认的一个尺寸，不是图片本身的尺寸，不利于使用者调整）【MAKA.im】 可以具体编辑，单页操作性较高，有新手（有模板）和高阶（无模板）两种编辑模式；翻页效果比兔展多，模板也更强大一些。【居高互动刊】 优点：最简单易上手的工具之一，根据提示一步一步的添加，共4步，最后生成微杂志。相比其他在线工具，较稳定。缺点：目前没试通制作单页上的交互效果，没找到开启pro功能的入口。【ANIMATRON】 优点：像flash的在线版，功能强大，可以创建HTML5动画。适合有动画基础的人做演示制作。缺点：需要动画制作基础；工作界面响应时间长；貌似只能分享到twitter、Facebook、google+、tumblr？【iSpring 7】 噱头是PPT转HTML5工具，完美与PPT兼容，可制作Html5移动课件。不过，目前我只能连着VPN再用Safari才能打开网站链接。【秀制作】 优点：版式轻松，制作快捷，宽带稳定。缺点：对图片和文字在各种屏幕上的显示没有做很好的适配；不能对模板中文字的编辑调整位置。手机工具APP：【初页】优点：模板质量高，套用模板编辑时效率高，操作简单快捷，效果和体验在制作H5页面的APP工具里面算是出类拔萃。缺点：单页面可操作性较低，仅支持套用模板。【快邀约】快速制作邀请函优点：易上手，省时高效，便于统计。缺点：页面简陋，只能选择固有模板创建文字和添加图片。【易企秀】中小微企业的移动场景营销管家优点：套用模板，创建快捷，用来做企业介绍、产品推荐。拥有强大的推广统计、客户管理功能。嗯，这里应该赞一个。缺点：只能用模板，DIY程度低；统计数据是否准确需要进一步确认，目前看来可能有遗漏数据的现象（在小范围测试中，统计到的数量小于应有的数量）。【微贴】：通过微信公众号创建H5页面优点：手机公众号内直接创建简单页面，根据提示创建即可，无脑方便快捷。缺点：只是单页面展示，承载不了交互效果等特效和内容。　　总结　　工具网站做的H5页面，多注重单独页面的自定义交互方案，DIY程度高，相对来说用时较长，又受制于带宽因素，故影响操作；工具APP做的H5页面，多注重效率，目前都是套用模板，因而对单页面的DIY程度较低，交互效果受限。作为我个人而言，移动互联的新任PM，我平时常用到的是【MAKA】和【兔展】，这两个相对来说更适合半天时间来完成；如想快速制作展示页面就用【初页】，这个在功能效率与设计感方面更突出一些；组织活动、制作邀请函、分发活动通知等用【快邀约】；平时推广新产品、联络客户和招聘新人用【易企秀】。转载

1，打开PPT，点击开始，新建幻灯片，选择任意一个幻灯片。2，点击视图，然后选择其中一个母版，在母版幻灯片中进行设计，例如插入图片，插入音频等等。3，点击工具栏的关闭母版，然后可以在刚刚新建的幻灯片中可以看到刚刚设置的母版效果。4，再按照上述方法重复，就可以创建多页多版式的模板了。

那么如何用MAKA做一个漂亮的微信H5呢？以下是方法步骤：方法/步骤1、点击制作栏目，进入模板选择页a、选择空模板，自由创作；b、选择主题模板，更快速的创作出炫丽的展示。2、选择模板后，进入创作界面3、预览树操作a、显示的页面的显示顺序；b、右键调整页面的显示顺序；c、点击页面右上角的X,可以把不需要的页面删除。4、功能—添加修改文字a、添加文字：点击右侧的文字选项→主编辑区会出现文字输入框→双击修改b、文字属性修改：右侧文字属性修改选项，包括字体种类，字体大小、颜色等等。5、功能—添加修改图片a、上传图片：点击右侧图片选项→上传按钮→选择图片→确定b、截图：点击截图按钮→选择图片区域→双击6、功能—添加修改按钮添加按键：点击右侧按钮选项→点击编辑区的按钮→修改文字、链接7、功能—添加修改表单a、添加表单：点击右侧的添加表单按钮，在弹出的窗口中填写提交数据的名称b、修改表单样式：在右侧的属性栏中，修改表单的显示样式c、查看及下载数据：客户提交数据后，可以在表单数据中看到，并提供下载8、功能—添加修改底图a、修改背景颜色：点击右侧底图选项→选择颜色b、上传底图：点击右侧底图选项→点击上传按钮→确定9、功能—添加修改背景音乐添加背景音乐：点击右侧音乐选项→点击选择文件按钮→确定→点击上传按钮10、功能—添加修改切换效果添加切换效果：选择页面→点击配置选项→选择切换效果11、功能—添加修改动画效果添加动画效果：点击添加动画的组件→点击动画选项→点击动画效果12、保存点击导航栏的保存按钮→再点击预览按钮→进入发布页面13、生成a、添加标题、描述、缩略图b、生成的二维码和链接可以用于分享到微信、微博等c、点击生成按钮，即完成了一个作品的制作过程。

这个操作要分不同的PPT版本，2003的版本，使用背景-->全部应用，就可以实现。2007以上版本，可以使用视图-->幻灯片母板-->右侧里选择图片或纹理填充，然后调用下面“全部应用”它就是了~

用word制作完成后，点击”文件“—”另存为“—HTML格式文件即可。1）点击最上角的蓝色向下箭头，2）点击”另存为“，出现如下页面3）下拉保存类型，选择”网页文件html“，4）选择完成后，点击保存5）就成功制作成HTML文件了。

网页设计，不知道你是单纯的设计还是设计加制作。现在来说，设计软件越来越多，可以选择的余地比较大。以前流行的说法是网页三剑客：Dreamweaver、firework、flash。现在来说，个人还是喜欢：设计类：Photoshop（数字）、illustrator（矢量）、flash（动画）。网页编程类：Dreamweaver（html+div+css）myeclipse eclipse notepad++ editplus等等很多优秀软件。

选择模板先百度搜索兔展，进入网站后注册账号并登录后，即可进入制作界面。在界面上可以看很多可供使用的模板，根据自己的需要，点击相应的模板。进入制作平台选择完模板后，会自动进入制作平台。在制作平台上，主要分三大区域：左侧的作品结构显示区域，中间的是作品制作区域，右侧的是组件属性修改区域。文字1、功能定义：用于展示文字内容，通过修改文字的显示属性，可以生成各式各样的显示效果。2、操作方法：点击右侧的文字选项，编辑面板的右上角会出现文字输入框，双击输入框可以修改文字内容；修改右侧的属性选项，可以改变文字的显示样式。3、属性说明：1）字体：改变文字的字体，提供的是兔展数据库的字体，非电脑本地字体。2）字号：修改文字的显示大小。3）行距：修改两行文字间的间距。4）调色板：修改文字颜色。5）宽度：修改文字输入框的宽度，单位像素。6）高度：修改文字输入框的高度，单位像素。7）透明度：修改文字的透明度，100%为不透明，0%为全透明。8）旋转：调整文字与水平线的夹角，正数为顺时针旋转，负数为逆时针旋转。图片1、功能解释：用于显示图片，通过修改图片的显示属性，可以改变图片的大小、透明度、角度等。2、操作方法：1）激活功能：点击右侧的图片选项，编辑面板的右上角会出现兔展的logo图片。2）上传新图片：点击属性栏中的上传按钮，上传本地电脑中的图片进入替换。3）图片库中的图片：如果之前已经上传过图片，可以从图片库中选择需要显示的图片。4）截图：按住鼠标左键拖动选择图片区域，然后点击截图按钮或者双击选中的图片区域，便可以裁剪出选中的图片区域。3、属性说明：1）宽度：修改图片的宽度。2）高度：修改图片的高度。3）原比例：此选项打上勾好，图片的宽度和高度将按照图片原来的比例显示，修改其中的一个数值，另外一个数值会除之改变。4）透明度：修改图片的透明度，100%为不透明，0%为全透明。5）旋转：调整图片与水平线的夹角，正数为顺时针旋转，负数为逆时针旋转。按钮1、功能解释：用于添加链接按钮，可以添加一切页面的链接，如:微博链接、微信公众号关注链接、官网链接、淘宝链接等等。2、操作方法：点击右侧的按钮选项，编辑面板的右上角会出现文字输入框；修改右侧的属性选项，可以改变按钮的参数和样式。3、属性说明：1）文字：修改按钮上显示的文字。2）链接：需要按钮链接到的页面，注意链接开头要包含“ http:// ”。3）填充色：按钮上的背景颜色。4）边框色：按钮的边框颜色。5）形状-边框：修改边框的宽度，“0”代表按键无边框。6）边框-圆角：修改边框边角的圆润程度，数值越大，按钮边角越圆润。7）宽度：修改按钮的宽度。8）高度：修改按钮的高度。9）透明度：修改按钮的透明度，100%为不透明，0%为全透明。10）旋转：调整按钮与水平线的夹角，正数为顺时针旋转，负数为逆时针旋转。表单1、功能解释：是允许用户在表单中输入并提交文本信息的功能组件，用户提交的信息可以在帐户栏目下的表单数据中显示。表单中，可以自定义每个选项的名称和项目的数量。2、操作方法：点击右侧的表单选项，弹出新建表单窗口，对表单内容进入添加。3、属性说明：1）表单标题：添加表单的标题。2）行标题：添加表单的行标题。3）按钮内容：添加按钮的显示文字。