主題: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: copper 於 十二月 11, 2005, 11:32:12 上午 关于字体大小和汇总页面的一些修改
--用LifeType做自己的应用网站的第一步: 最近,花了一段时间,对LifeType做了一点微小的修改,做了自己的一个应用网站。 因为以前对LifeType不熟悉,所以有些地方摸索得很费劲,下面把自己的体会写一下,有些地方可能走了弯路,希望高手指正! LifeType的修改记录 到目前为至改动过的所有文件 Style\summary.css Style\admin.css Style\admin-ff.css templates\summary\footer.template templates\summary\index.template templates\summary\agreement.template 按照自己的网站需求修改LifeType summary中部分字体太小的问题 上部导航栏字体大小修改 通过检查templates\summary\下的文件,发现header.template中说明了相关的div定义: 程式碼: <div id="menubar"> 到www/styles中找到summary.css,并找到相关的menu项<div id="menu"> <ul class="menuTop"> <li class="menuOption"><a href="?op=Summary">{$locale->tr("summary")}</a></li> <li class="menuOption"><a href="?op=RegisterStep0">{$locale->tr("register")}</a></li> <li class="menuOption"><a href="?op=BlogList">{$locale->tr("blogs")}</a></li> <li class="menuOption"><a href="?op=UserList">{$locale->tr("users")}</a></li> </ul> </div> </div> 引用 #menu li 原来的font-size太小,是0.83em,改为1em就行了。{ position : relative; padding : 0; border-left : 0px solid #B4B4B4; display : inline; font-weight : bold; font-family : verdana, tahoma, sans-serif; font-size : 1em; letter-spacing : 0.20em; text-transform : uppercase; } 登录和搜索框中的文字太小 在summary.css中找到相关的控制项,属于form中的控制。 引用 /* -------------------------------------------------------------- */ 在filedset中,原来的字体太小。该为0.95em即可。/* Form controls (input, ...) */ /* -------------------------------------------------------------- */ form { margin : 0px; } fieldset { border : 1px solid #DEDEDE; color : #000000; font-family : verdana, tahoma, sans-serif; font-size : 0.95em; padding-bottom : 0px; margin : 0px; } textarea, input, select { background : #FFFFFF; border : 1px solid #b2b2b2; color : #000000; font-family : verdana, tahoma, sans-serif; font-size : 0.95em; } 不好的修改方法 最初我用这样的修改方法: Summary.php中,导航条上的字体太小,几乎看不清楚。在\styles\summary.css文件中,把 font : 12px verdana, tahoma, arial, sans-serif;修改为: font : 14px verdana, tahoma, arial, sans-serif; 但是这样之后,整个版面出现问题, 搜索播客一块沉到底下去了。检查结果是版面因为字体变大而变宽。而原来整个版面的宽带是784,现在改成796就可以了。 引用 #container 尽管这样可以凑合着用,但是自己感觉这个方法很烦琐,容易出现问题。最好不要使用。{ width : 796px; text-align : left; margin-left : auto; margin-right : auto; } 管理界面中的字体问题 管理界面中上部的导航栏的文字大小 这个是在admin.css中修改, 和summary.css中的类似。 管理界面中的右侧的导航栏的文字大小太小 这个是在admin.css中修改: 引用 /* -------------------------------------------------------------- */ /* Section title and navigation history bar */ /* -------------------------------------------------------------- */ #nav_bar { margin-left : auto; margin-right : auto; width : 100%; margin-bottom : 15px; border-bottom : 1px dotted #DEDEDE; } #section_title { float : left; width : 39%; } #section_title h2 { color : #588BCA; font-weight : bold; font-family : trebuchet ms, tahoma, sans-serif; font-size : 1.5em; letter-spacing : 0.08em; margin : 0; padding-left : 4px; } #navigation { float : right; width : 60%; text-align : right; padding-top : 7px; font-family : verdana, tahoma, sans-serif; font-size :0.9em; letter-spacing : 0.09em; padding-right : 2px; } 管理界面中的说明文字太小 引用 .formHelp 把font-size 90% 改为100%字体就比较好看了。{ font-size : 100%; color : #76797c; margin : 0 0 0.2em 0; } 版权信息 把templates\summary\目录中的footer.template中增加相关的版权信息说明 程式碼: </div> </div> <div id="Bottom"> Copyright 2005, <a href="http://www.blogyard.net/">blogyard.net</a>, All rights reserved.<br/> Powered by <a href="http://www.plogworld.net">pLog/Lifetype</a><br/> Design by <a href="http://www.bookofstyles.org/">Book of Styles</a><br/> </div> </body> </html> 修改欢迎信息 欢迎词的修改是在“templates\summary\index.template”文件中,把: 程式碼: <div id="maincolumn"> 中间的英文字该成自己喜欢的中文语句,并且存的时候选择utf8格式(这个在ultraedit中可以选择,其他编辑器中应该也有类似的选项。)<div id="intro"> <h4>{$locale->tr("summary_welcome")}</h4> You should place here whatever welcome message you would like your users to see. Or remove this one completely and rearrange the whole page. Or something :) Take a look at templates/summary, that is where all template files that make up this page are stored. You are free to change them in any way you like. </div> {include file="summary/recent.template"} </div> 关于CC版权声明 如无特别说明,本站内容采用的授权为: Creative Commons Attribution-NonCommercial-ShareAlike 2.5 License. Logo和top_admin.jpg的修改 1、Style\summary.css 引用 /* -------------------------------------------------------------- */ /* Common stuff and basic page layout */ /* -------------------------------------------------------------- */ #container { width : 786px; text-align : left; margin-left : auto; margin-right : auto; } #header { height : 130px; width : 100%; background : #FFFFFF url("../imgsum/blogyard.jpg") no-repeat right; padding : 0px; margin : 0px; } height : 60px; width : 100%; background : #FFFFFF url("../imgs/top_admin.jpg") no-repeat right;现在我们把自己的图片放到imgsum目录中,并切替换原来的图片。因为图片的高度和原来的不同,所以高度也要调整一下。 2、 Style\admin.css文件 同样修改。 3、 Style\admin-ff.css文件 同样修改。这个文件是用于firefox浏览器的也应该修改。 更好的修改方法是: 当然这种改法不如不原来的图片top_admin.jpg直接替换掉。当然各个css文件中的height要相应改过来。 主題: Re: 如何用LifeType做自己的应用网站 作者: james 於 十二月 11, 2005, 12:20:55 下午 Hi copper:
真是相當詳盡的一篇心得分享 :-D 期待能再次見到你更多的文章:) James. 主題: Re: 如何用LifeType做自己的应用网站 作者: winman 於 十二月 11, 2005, 12:57:01 下午 真是蛮详细的哦,这基本包括了我认为应用中文语言文件后字体大小
需要改的地方,这篇对需要修改字体大小的朋友很有帮助,我比较懒了, 到现在还是用默认的设置,也懒得去改了。 :-D ps: 能否把标题修改为类似:“关于字体大小和汇总页面的一些修改”, 这样的标题对有需要的朋友应该容易理解,然后我把这篇文置顶咯。 :-D 主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: zhuzhzh 於 三月 13, 2006, 09:56:56 下午 把所有的修改后的文件打成包作为附件附在后面吧
主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: bibicall 於 三月 14, 2006, 12:31:40 上午 把所有的修改后的文件打成包作为附件附在后面吧 自己動手樂趣多主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: AlanZ 於 六月 14, 2006, 07:06:09 下午 恩 测试了下 footer中按照LZ的方法加入版权信息之后,在IE下显示完全是居中的,但是在FF中无法正常显示居中
主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: markwu 於 七月 03, 2006, 02:26:30 下午 把 footer 的 <div id="Bottom"> 改成 <div id="Bottom" stylle="text-align: center;"> 試試看。
Mark 主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: huaanfen 於 十二月 09, 2006, 04:35:33 下午 以前改过一些编 码,N 刚接触这个程序,不错,省了不少事,支持。 :-P
主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: erxiao 於 四月 02, 2007, 05:14:49 下午 收穫不小哦~!多謝多謝~!
主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: wow 於 十一月 16, 2007, 02:05:27 下午 感谢楼主的分享!~ ;-)
主題: Re: 关于字体大小和汇总页面的一些修改-用LifeType做自己的应用网站的第一步 作者: dzhdiv 於 二月 29, 2008, 01:45:15 下午 原來是這樣呀,謝謝哦
|