wzmaths 2007-2-27 23:08
模仿他人论坛风格,为自已论坛所用 上篇:配色表制作
[quote][color=blue][size=3]topzj浙江的很多会员都有自已喜爱的风格,但90%的会员都是看了别人发的帖子,参考了别人给的配色表,下载了别人提供的风格包,然后安装到自已的论坛上,当然,我也是这样,这样方便呀,呵呵,不过你知道吗,那些发帖的朋友是如何制作出漂亮的风格呢,我想很多会员从来不去思考,我觉得这样是不行的,我们要学习,只有学习才能进步,比如官方论坛刚推出新的蝴蝶风格,不到半小时,就有人模仿出一模一样的风格,给出了配色表和风格包,特别是配色表在官方论坛的后台,只有管理员才能看到,但大家有没有想到,为什么能模仿出一模一样的配色呢,当然,我们是不可能进官方后台查看配色表的,其实有很多方法,我现在想到了这种方法,不知其它人有没有更好更快的方法,欢迎大家一起讨论。
其实方法很简单,只要三张图和一个取色软件就行了,下面我具体说明一下:
第一下面是论坛后台的配色表,很多会员只是根据别人给的颜色代码模仿填入,不理解其中的含义,我开始也是这样,什么都不懂,觉得那些发风格帖的朋友真强,颜色代码这么精通,呵呵,其实很简单,我只要用三张图片就能清楚的理解配色表中每一项对应的是论坛哪些位置!
(这三张表不是我做的,引用别人的!)[/size][/color][/quote]
[color=#0000ff][/color][table=98%][tr][td=2,1]编辑界面方案 - 蝴蝶迎春[url=http://ggsjzg.art.topzj.com/admincp.php?action=styles&edit=18630#][img]http://ggsjzg.art.topzj.com/images/admincp/menu_reduce.gif[/img][/url] [/td][/tr][tr][td=1,1,55%][b]界面方案名称:[/b]
识别界面风格的标志,请勿使用空格或特殊符号[/td][td][color=#ff00ff][/color][/td][/tr][tr][td=1,1,55%][b]匹配模板:[/b]
与本套界面风格相匹配的模板名称[/td][td][/td][/tr][tr][td=1,1,55%][b]论坛 logo {BOARDIMG},{BOARDLOGO}:[/b]
如使用 Flash 动画,请用逗号隔开 URL,宽群透叨龋纭發ogo.swf,80,40”[/td][td][/td][/tr][tr][td=1,1,55%][b]界面图片目录 {IMGDIR}:[/b][/td][td]
[/td][/tr][tr][td=1,1,55%][b]Smilies 图片目录 {SMDIR}:[/b][/td][td]images/smilies[/td][/tr][/table][table=98%][tr][td=2,1]文字及颜色设置[url=http://ggsjzg.art.topzj.com/admincp.php?action=styles&edit=18630#][img]http://ggsjzg.art.topzj.com/images/admincp/menu_reduce.gif[/img][/url] [/td][/tr][tr][td=1,1,55%][b]禁用粗体字显示 {NOBOLD}:[/b]
选择“是”前台将不显示任何粗体字内容[/td][td]否 [/td][/tr][tr][td=1,1,55%][b]正常字体设置 {FONT}:[/b]
多个候选字体间请用半角逗号 "," 分割[/td][td]Tahoma, Verdana[/td][/tr][tr][td=1,1,55%][b]正常字号设置 {FONTSIZE}:[/b]
可使用字号、pt、px(推荐) 等单位[/td][td]12px[/td][/tr][tr][td=1,1,55%][b]帖子内容字号设置 {MSGFONTSIZE}:[/b]
可使用字号、pt、px(推荐) 等单位[/td][td]12px[/td][/tr][tr][td=1,1,55%][b]小号字体设置 {SMFONT}:[/b]
多个候选字体间请用半角逗号 "," 分割[/td][td]Arial, Tahoma[/td][/tr][tr][td=1,1,55%][b]小号字号设置 {SMFONTSIZE}:[/b]
可使用字号、pt、px(推荐) 等单位[/td][td]11px[/td][/tr][tr][td=1,1,55%][b]内表格中超级链接文字颜色 {LINK}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]内表头文字颜色 {HEADERTEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]栏目文字颜色 {CATTEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]内表格中文字颜色 {TABLETEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]外表格中 (表格除外) 文字颜色 {TEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]浅色文字颜色 {LIGHTTEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][/table][table=98%][tr][td=2,1]表格与背景颜色设置[url=http://ggsjzg.art.topzj.com/admincp.php?action=styles&edit=18630#][img]http://ggsjzg.art.topzj.com/images/admincp/menu_reduce.gif[/img][/url] [/td][/tr][tr][td=1,1,55%][b]外表格宽度 {MAINTABLEWIDTH}:[/b]
页面外套表格的宽度,可设置为像素或百分比[/td][td]98%[/td][/tr][tr][td=1,1,55%][b]外表格背景颜色 {MAINTABLECOLOR},{MAINTABLEBGCODE}:[/b]
输入 16 进制颜色或图片链接[/td][td]#FFFFFF[/td][/tr][tr][td=1,1,55%][b]主表格宽度 {TABLEWIDTH}:[/b]
可设置为像素或百分比[/td][td]100%[/td][/tr][tr][td=1,1,55%][b]主表格边缘空隙 {TABLESPACE}:[/b][/td][td]4[/td][/tr][tr][td=1,1,55%][b]主表格边框宽度 {BORDERWIDTH}:[/b][/td][td]1[/td][/tr][tr][td=1,1,55%][b]主表格外边框颜色 {BORDERCOLOR}:[/b]
输入 16 进制颜色[/td][td]#DFBB97[/td][/tr][tr][td=1,1,55%][b]主表格内边框宽度 {INNERBORDERWIDTH}:[/b][/td][td]1[/td][/tr][tr][td=1,1,55%][b]主表格内边框颜色 {INNERBORDERCOLOR}:[/b]
输入 16 进制颜色[/td][td]#FFEFE2[/td][/tr][tr][td=1,1,55%][b]页面背景 {BGCOLOR},{BGCODE}:[/b]
输入 16 进制颜色或图片链接[/td][td]#FFFFFF[/td][/tr][tr][td=1,1,55%][b]内表头背景颜色 {HEADERCOLOR},{HEADERBGCODE}:[/b]
输入 16 进制颜色或图片链接[/td][td]bg.jpg[/td][/tr][tr][td=1,1,55%][b]栏目背景颜色 {CATCOLOR},{CATBGCODE}:[/b]
输入 16 进制颜色或图片链接[/td][td]#EFEFE2[/td][/tr][tr][td=1,1,55%][b]栏目边框色 {CATBORDER}:[/b]
输入 16 进制颜色[/td][td]#DFBB97[/td][/tr][tr][td=1,1,55%][b]内表格背景配色 1 {ALTBG1}:[/b]
建议设置为相对内表格背景配色 2 略深的颜色[/td][td]#FBFAF4[/td][/tr][tr][td=1,1,55%][b]内表格背景配色 2 {ALTBG2}:[/b]
建议设置为相对内表格背景配色 1 略浅的颜色[/td][td]#FFFFFF[/td][/tr][tr][td=1,1,55%][b]内表格边框色 {BGBORDER}:[/b]
输入 16 进制颜色[/td][td]#EFEFE2[/td][/tr][/table][table=98%][tr][td=2,1]其它颜色设置[url=http://ggsjzg.art.topzj.com/admincp.php?action=styles&edit=18630#][img]http://ggsjzg.art.topzj.com/images/admincp/menu_reduce.gif[/img][/url] [/td][/tr][tr][td=1,1,55%][b]论坛上下栏背景色 {MAINBORDER}:[/b]
输入 16 进制颜色[/td][td]#DFBB97[/td][/tr][tr][td=1,1,55%][b]输入框边框颜色 {INPUTBORDER}:[/b]
输入 16 进制颜色[/td][td]#7AC4EA[/td][/tr][tr][td=1,1,55%][b]导航栏文字颜色 {NAVTEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]下拉菜单背景色 {MENUBG}:[/b]
输入 16 进制颜色[/td][td]#F0F0E4[/td][/tr][tr][td=1,1,55%][b]下拉菜单文字颜色 {MENUTEXT}:[/b]
输入 16 进制颜色[/td][td]#70563D[/td][/tr][tr][td=1,1,55%][b]下拉菜单高亮文字颜色 {MENUHLTEXT}:[/b]
输入 16 进制颜色[/td][td]#674D2B[/td][/tr][tr][td=1,1,55%][b]下拉菜单高亮背景颜色 {MENUHLBG}:[/b]
输入 16 进制颜色[/td][td]#F0F0E4[/td][/tr][tr][td=1,1,55%][b]顶部菜单栏背景 {HEADERMENU},{HEADERMENUBGCODE}:[/b]
输入 16 进制颜色或图片链接[/td][td]#F0F0E3[/td][/tr][tr][td=1,1,55%][b]顶部菜单栏文字颜色 {HEADERMENUTEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]贴内楼号栏、广告栏背景色 {POSTNOTICEBG}:[/b]
输入 16 进制颜色[/td][td]#FDFFF2[/td][/tr][tr][td=1,1,55%][b]贴内信息框表头背景颜色 {MSGHEADER}:[/b]
输入 16 进制颜色[/td][td]#F3F8D7[/td][/tr][tr][td=1,1,55%][b]贴内信息框表头文字颜色 {MSGHEADERTEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]贴内信息框背景颜色 {MSGTEXT}:[/b]
输入 16 进制颜色[/td][td]#FDFFF2[/td][/tr][tr][td=1,1,55%][b]曰历下拉框过去曰期文字颜色 {CALENDAREXPIRE}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]曰历下拉框默认文字颜色 {CALENDARTEXT}:[/b]
输入 16 进制颜色[/td][td]#3C2713[/td][/tr][tr][td=1,1,55%][b]曰历下拉框高亮文字颜色 {CALENDARCHECKED}:[/b]
输入 16 进制颜色[/td][td]#FF0000[/td][/tr][tr][td=1,1,55%][b]曰历下拉框今曰文字颜色 {CALENDARTODAY}:[/b]
输入 16 进制颜色[/td][td]#00BB00[/td][/tr][/table][size=5][color=magenta][/color][/size]
第一张图:文字及颜色设置
[attach]59294[/attach]
第二张图:表格与背景颜色设置
[attach]59295[/attach]
第三张图:其它颜色设置
[attach]59293[/attach]
[size=4][color=#0000ff][b]编辑界面方案 - 及配色 超详说明
[/b][/color][/size][size=3]栏目边框色 {CATBORDER}: 输入 16 进制颜色 [color=blue]版块上的一条线(每个分类版下面的一条线)[/color][/size]
内表格中超级链接文字颜色 {LINK}:[color=blue]显示“查看新帖 | 文集 | 精华区 | 标记已读”以及 “最后发表” 时间和会员名[/color]
内表头文字颜色 {HEADERTEXT}:[color=blue]显示“分类版块的文字 以及 bay: 退出 | 短消息 | 会员 | 搜索 | 我的 | 控制面板 | 统计 | 系统设置 | 帮助 跟版块后的 (14) 帖子数[/color]
栏目文字颜色 {CATTEXT}: [color=blue]显示“ 主题 帖数 最后发表 版主 字样的 颜色[/color]
内表格中文字颜色 {TABLETEXT}: [color=blue]主要显示“ 板块类的说明文字及主题个贴数数字颜色[/color]
外表格中 (表格除外) 文字颜色 {TEXT}: [color=blue]显示“ 各个板块的名称 文字的 颜色 如:『休闲领地』[/color]
浅色文字颜色 {LIGHTTEXT}:[color=blue]主要显示“版块内主题发帖的时间和主题帖子的查看数[/color]
主表格外边框颜色 {BORDERCOLOR}:[color=blue]显示“每个分类[含该类的所以版块]的一个框架的颜色[/color]
主表格内边框颜色 {INNERBORDERCOLOR}:效果不明?????
页面背景 {BGCOLOR},{BGCODE}:[color=blue]输入 16 进制颜色或图片链接 只能空间换风格才能加上图片背景 [/color]
内表头背景颜色 {HEADERCOLOR},{HEADERBGCODE}:[color=blue]显示“分类版块字样的背景颜色[/color]
栏目背景颜色 {CATCOLOR},{CATBGCODE}:[color=blue]显示“主题 帖数 最后发表 版主 等字样的背景颜色[/color]
栏目边框色 {CATBORDER}:[color=blue]显示“主题 帖数 最后发表 版主 等字样下的一条线[/color]
内表格背景配色 1 {ALTBG1}:[color=blue]主要显示各分类版块内的版块鼠标移动后看到的背景色[/color]
内表格背景配色 2 {ALTBG2}:[color=blue]结合上面的 这个是鼠标未移动的背景色 不明白的话 两个用白色[/color]
内表格边框色 {BGBORDER}:[color=blue]分类版块内,版块与版块之间的边框色[/color]
论坛上下栏背景色 {MAINBORDER}:[color=blue]就是最上面和最下面的颜色 建议结合页面背景色[/color]
下拉菜单背景色 {MENUBG}:[color=blue]说的已经够很明确了吧[/color]
输入框背景色 {INPUTBORDER}:[color=blue]可以输入的边框色[/color]
顶部菜单栏背景 {HEADERMENU},{HEADERMENUBGCODE}:[color=blue]显示为 用户名字: 退出 | 短消息 | 会员 | 搜索 | 我的 | 控制面板 | 统计 | 系统设置 | 帮助 字样的的背景色[/color]
[quote][color=blue][/color]
[size=3][color=blue]看懂了吗,上面是我以前看到的一个帖子,他说得很详细,我都看懂了,你也一定看得懂吧,呵呵,虽然有点多,但要慢慢看,不要急,学习一点,不要偷懒!看懂上面之后,你可以自已取色了,用上这个软件[/color]
[attach]59292[/attach]
只要你用这个取色软件点击你要模仿论坛相应的位置,就能把这个位置的颜色取出来,并不要学习颜色代码,呵呵,是不是很容易呀[/size][/quote][quote][color=red][size=3]以后你只要看着这三张图并理解了配色表中每一项的含义,再加上这个取色软件,你就可以模仿所有论坛的配色了,你再也不要去求人帮你制作了,当你看到有些独立论坛一些漂亮风格,想用到自已的免费论坛上,只要用这个方法,你就能很容易得到对方论坛的风格配色表了,说到这里,说一下我以前的小故事,我以前看到有一个独立论坛的风格很喜欢,于是就注册会员,然后短信PM对方的管理员,请求他把后台的配色表发给我,呵呵,那个管理员理都不理我,还挖苦我,呵呵,当然有些论坛的管理员还是不错的,但我还要加他QQ,然后等他传给我,也很麻烦,麻烦人家也很不好意思,呵呵,现在好了,用这种方法,所向无敌,这里还有个版权问题,我想没关系的吧,呵呵![/size][/color][/quote]
[quote][color=Blue][size=3]PS:有人会问,光有配色有什么用,没风格包呀,呵呵,其实有了配色就已经能把别人的风格用到你的论坛了,你只要选择对方论坛里一个图标,如官方论坛的[img]http://www.topzj.com/style/new2007/newtopic.gif[/img],然后鼠标右键,再选属性,就能出现这个图片的地址,如[url=http://www.topzj.com/style/new2007/newtopic.gif]http://www.topzj.com/style/new2007/newtopic.gif[/url],其中[url=http://www.topzj.com/style/new2007]http://www.topzj.com/style/new2007[/url]就是这个风格包的图片目录,你只要把它填入配色表中的界面图片目录就行了,哈哈,是不是,别人论坛的风格就到你的论坛上了呀,这样连空间也不需要的哦![/size][/color][/quote]
[quote][color=Red][size=5]当然如果你一定想要得到对方论坛的风格包,也是有方法的,具体我会出第二帖,请大家继续关注
[color=Blue]模仿他人论坛风格,为自已论坛所用 下篇:风格包获取! [/color][/size][/color][/quote]
[[i] 本帖最后由 wzmaths 于 2007-2-27 23:57 编辑 [/i]]
wzmaths 2007-2-28 14:10
[quote]原帖由 [i]84238201[/i] 于 2007-2-28 12:56 发表
好东西~ 但是本人觉得会不会麻烦了点 [/quote]
做风格肯定是个辛苦的活,你有没有更快的方法呀
summerheart 2007-3-2 09:54
谢谢楼主啊.....:) :) :)
songzhihong 2007-3-2 18:54
绝对好的教程,图片简单易懂。谢谢了。
同样郁郁 2007-3-3 03:49
楼主的方法虽然可行,但没考虑到另外一个问题/
如果别人不用这个风格或者删了这个风格,那么你的图片都没了,:L 由自己上传到自己论坛,然后得到地址,这样的话,你就永远可以用这个风格了。:lol
wzmaths 2007-3-3 10:51
这个知道呀,所以我还要出 模仿他人论坛风格,为自已论坛所用 下篇:风格包获取:lol
新疆家维 2007-3-3 11:54
的确是绝对好的教程,图文并茂,简单易懂。太好了,急盼下一篇。