Re: 如何制作phpbb风格
首先製作风格必须有范本当基础元件,你可以找出你喜欢的风格版本来当基础版本。只要拷贝选定的原风格目录夹,另取一个名称来当风格新名子。
特别要注意:如果说你自己原先使用的风格已经有安装一些MOD,那麽你以这个修改的来製作新的风格,虽然能省去你重複安装MOD的好处,但是不能够打包给他人使用囉。
我们先以 subSilver 官方预设风格来当范本,拷贝一份并取好名称,假设取名为ABC,之后同放置于 templates\当中,再来必须找出所有档桉中有任何subSilver关键字的档桉,你可以使用档桉总管或者UltraEdit-32软体搜寻,搜寻templates\ABC与templates\ABC\admin二个目录夹。
ABC目录夹可以找出16个包含关键字的档桉,ABC\admin可以找出4个包含关键字的档桉。
--------------------------------------------------------------------------------
在 ...\subSilver\faq_body.tpl' :
第40行 <td class="spaceRow" height="1"><img src="templates/subSilver/images/spacer.gif" alt="" width="1" height="1" /></td>
--------------------------------------------------------------------------------
在 ...\subSilver\index.htm' :
第3行 <title>subSilver created by subBlue Design</title> ***这裡可以把subBlue字改成你的名字***
--------------------------------------------------------------------------------
在 ...\subSilver\index_body.tpl' :
第58行 <td class="row1" align="center" valign="middle" rowspan="2"><img src="templates/subSilver/images/whosonline.gif" alt="{L_WHO_IS_ONLINE}" /></td>
第100行 <td width="20" align="center"><img src="templates/subSilver/images/folder_new_big.gif" alt="{L_NEW_POSTS}"/></td>
第103行 <td width="20" align="center"><img src="templates/subSilver/images/folder_big.gif" alt="{L_NO_NEW_POSTS}" /></td>
第106行 <td width="20" align="center"><img src="templates/subSilver/images/folder_locked_big.gif" alt="{L_FORUM_LOCKED}" /></td>
--------------------------------------------------------------------------------
在 ...\subSilver\modcp_split.tpl' :
第49行 <td valign="middle"><img src="templates/subSilver/images/icon_minipost.gif" alt="{L_POST}"><span class="postdetails">{L_POSTED}:
第62行 <td colspan="3" height="1" class="row3"><img src="templates/subSilver/images/spacer.gif" width="1" height="1" alt="."></td>
--------------------------------------------------------------------------------
在 ...\subSilver\overall_header.tpl' :
第9行 <!-- link rel="stylesheet" href="templates/subSilver/{T_HEAD_STYLESHEET}" type="text/css" -->
第13行 The original subSilver Theme for phpBB version 2+
第58行 background-image: url(templates/subSilver/images/{T_TH_CLASS3});
第66行 background-image: url(templates/subSilver/images/{T_TH_CLASS2});
第70行 background-image: url(templates/subSilver/images/{T_TH_CLASS1});
第209行 @import url("templates/subSilver/formIE.css");
第231行 <td><a href="{U_INDEX}"><img src="templates/subSilver/images/logo_phpBB.gif" border="0" alt="{L_INDEX}" vspace="1" /></a></td>
第235行 <td align="center" valign="top" nowrap="nowrap"><span class="mainmenu"> <a href="{U_FAQ}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_faq.gif" width="12" height="13" border="0" alt="{L_FAQ}" hspace="3" />{L_FAQ}</a> <a href="{U_SEARCH}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_search.gif" width="12" height="13" border="0" alt="{L_SEARCH}" hspace="3" />{L_SEARCH}</a> <a href="{U_MEMBERLIST}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_members.gif" width="12" height="13" border="0" alt="{L_MEMBERLIST}" hspace="3" />{L_MEMBERLIST}</a> <a href="{U_GROUP_CP}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_groups.gif" width="12" height="13" border="0" alt="{L_USERGROUPS}" hspace="3" />{L_USERGROUPS}</a>
第237行 <a href="{U_REGISTER}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_register.gif" width="12" height="13" border="0" alt="{L_REGISTER}" hspace="3" />{L_REGISTER}</a>
第242行 <td height="25" align="center" valign="top" nowrap="nowrap"><span class="mainmenu"> <a href="{U_PROFILE}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_profile.gif" width="12" height="13" border="0" alt="{L_PROFILE}" hspace="3" />{L_PROFILE}</a> <a href="{U_PRIVATEMSGS}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_message.gif" width="12" height="13" border="0" alt="{PRIVATE_MESSAGE_INFO}" hspace="3" />{PRIVATE_MESSAGE_INFO}</a> <a href="{U_LOGIN_LOGOUT}" class="mainmenu"><img src="templates/subSilver/images/icon_mini_login.gif" width="12" height="13" border="0" alt="{L_LOGIN_LOGOUT}" hspace="3" />{L_LOGIN_LOGOUT}</a> </span></td>
--------------------------------------------------------------------------------
在 ...\subSilver\posting_preview.tpl' :
第7行 <td class="row1"><img src="templates/subSilver/images/icon_minipost.gif" alt="{L_POST}" /><span class="postdetails">{L_POSTED}: {POST_DATE} {L_POST_SUBJECT}: {POST_SUBJECT}</span></td>
第19行 <td class="spaceRow" height="1"><img src="templates/subSilver/images/spacer.gif" width="1" height="1" /></td>
--------------------------------------------------------------------------------
在 ...\subSilver\posting_topic_review.tpl' :
第31行 <td colspan="2" height="1" class="spaceRow"><img src="templates/subSilver/images/spacer.gif" alt="" width="1" height="1" /></td>
--------------------------------------------------------------------------------
在 ...\subSilver\privmsgs_body.tpl' :
第41行 <td bgcolor="{T_TD_COLOR2}"><img src="templates/subSilver/images/spacer.gif" width="{INBOX_LIMIT_IMG_WIDTH}" height="8" alt="{INBOX_LIMIT_PERCENT}" /></td>
--------------------------------------------------------------------------------
在 ...\subSilver\search_results_posts.tpl' :
...\subSilver\search_results_posts.tpl(21行 <td class="catHead" colspan="2" height="28"><span class="topictitle"><img src="templates/subSilver/images/folder.gif" align="absmiddle" /> {L_TOPIC}: <a href="{searchresults.U_TOPIC}" class="topictitle">{searchresults.TOPIC_TITLE}</a></span></td>
--------------------------------------------------------------------------------
在 ...\subSilver\simple_header.tpl' :
第15行 <!-- link rel="stylesheet" href="templates/subSilver/{T_HEAD_STYLESHEET}" type="text/css" -->
第20行 The original subSilver Theme for phpBB version 2+
第69行 background-image: url(templates/subSilver/images/{T_TH_CLASS3});
第77行 background-image: url(templates/subSilver/images/{T_TH_CLASS2});
第81行 background-image: url(templates/subSilver/images/{T_TH_CLASS1});
第231行 @import url("templates/subSilver/formIE.css");
--------------------------------------------------------------------------------
在 ...\subSilver\subSilver.cfg' :
第3行 // ** Configuration file for subSilver template **
第9行 // ** subSilver dev. forum: http://www.subSky.com/phpBB2/ **
第11行 // $Id: subSilver.cfg,v 1.11.2.1 2005/10/08 19:41:31 grahamje Exp $
--------------------------------------------------------------------------------
在 ...\subSilver\subSilver.css' :
第2行 The original subSilver Theme for phpBB version 2+
--------------------------------------------------------------------------------
在 ...\subSilver\theme_info.cfg' :
第4行 // phpBB 2.x auto-generated theme config file for subSilver
第8行 $subSilver[0]['template_name'] = "subSilver";
第9行 $subSilver[0]['style_name'] = "subSilver";
第10行 $subSilver[0]['head_stylesheet'] = "subSilver.css";
第11行 $subSilver[0]['body_background'] = "";
第12行 $subSilver[0]['body_bgcolor'] = "E5E5E5";
第13行 $subSilver[0]['body_text'] = "000000";
第14行 $subSilver[0]['body_link'] = "006699";
第15行 $subSilver[0]['body_vlink'] = "5493B4";
第16行 $subSilver[0]['body_alink'] = "";
第17行 $subSilver[0]['body_hlink'] = "DD6900";
第18行 $subSilver[0]['tr_color1'] = "EFEFEF";
第19行 $subSilver[0]['tr_color2'] = "DEE3E7";
第20行 $subSilver[0]['tr_color3'] = "D1D7DC";
第21行 $subSilver[0]['tr_class1'] = "";
第22行 $subSilver[0]['tr_class2'] = "";
第23行 $subSilver[0]['tr_class3'] = "";
第24行 $subSilver[0]['th_color1'] = "98AAB1";
第25行 $subSilver[0]['th_color2'] = "006699";
第26行 $subSilver[0]['th_color3'] = "FFFFFF";
第27行 $subSilver[0]['th_class1'] = "cellpic1.gif";
第28行 $subSilver[0]['th_class2'] = "cellpic3.gif";
第29行 $subSilver[0]['th_class3'] = "cellpic2.jpg";
第30行 $subSilver[0]['td_color1'] = "FAFAFA";
第31行 $subSilver[0]['td_color2'] = "FFFFFF";
第32行 $subSilver[0]['td_color3'] = "";
第33行 $subSilver[0]['td_class1'] = "row1";
第34行 $subSilver[0]['td_class2'] = "row2";
第35行 $subSilver[0]['td_class3'] = "";
第36行 $subSilver[0]['fontface1'] = "Verdana, Arial, Helvetica, sans-serif";
第37行 $subSilver[0]['fontface2'] = "Trebuchet MS";
第38行 $subSilver[0]['fontface3'] = "Courier, \'Courier New\', sans-serif";
第39行 $subSilver[0]['fontsize1'] = "10";
第40行 $subSilver[0]['fontsize2'] = "11";
第41行 $subSilver[0]['fontsize3'] = "12";
第42行 $subSilver[0]['fontcolor1'] = "444444";
第43行 $subSilver[0]['fontcolor2'] = "006600";
第44行 $subSilver[0]['fontcolor3'] = "FFA34F";
第45行 $subSilver[0]['span_class1'] = "";
第46行 $subSilver[0]['span_class2'] = "";
第47行 $subSilver[0]['span_class3'] = "";
第48行 $subSilver[0]['img_size_poll'] = "0";
第49行 $subSilver[0]['img_size_privmsg'] = "0";
--------------------------------------------------------------------------------
在 ...\subSilver\viewonline_body.tpl' :
第25行 <td colspan="3" height="1" class="row3"><img src="templates/subSilver/images/spacer.gif" width="1" height="1" alt="."></td>
--------------------------------------------------------------------------------
在 ...\subSilver\viewtopic_body.tpl' :
第59行 <td class="spaceRow" colspan="2" height="1"><img src="templates/subSilver/images/spacer.gif" alt="" width="1" height="1" /></td>
--------------------------------------------------------------------------------
在 ...\subSilver\viewtopic_poll_result.tpl' :
第17行 <td><img src="templates/subSilver/images/vote_lcap.gif" width="4" alt="" height="12" /></td>
第19行 <td><img src="templates/subSilver/images/vote_rcap.gif" width="4" alt="" height="12" /></td>
--------------------------------------------------------------------------------
--------------------------------------------------------------------------------
在 ...\admin\forum_admin_body.tpl' :
第33行 <td colspan="7" height="1" class="spaceRow"><img src="../templates/subSilver/images/spacer.gif" alt="" width="1" height="1" /></td>
--------------------------------------------------------------------------------
在 ...\admin\index_body.tpl' :
第73行 <td colspan="5" height="1" class="row3"><img src="../templates/subSilver/images/spacer.gif" width="1" height="1" alt="."></td>
--------------------------------------------------------------------------------
在 ...\admin\index_navigate.tpl' :
第4行 <td align="center" ><a href="{U_FORUM_INDEX}" target="_parent"><img src="../templates/subSilver/images/logo_phpBB_med.gif" border="0" /></a></td>
--------------------------------------------------------------------------------
在 ...\admin\page_header.tpl' :
第6行 <!-- link rel="stylesheet" href="../templates/subSilver/{T_HEAD_STYLESHEET}" type="text/css" -->
第11行 The original subSilver Theme for phpBB version 2+
第62行 background-image: url(../templates/subSilver/images/{T_TH_CLASS3});
第70行 background-image: url(../templates/subSilver/images/{T_TH_CLASS2});
第74行 background-image: url(../templates/subSilver/images/{T_TH_CLASS1});
第219行 @import url("../templates/subSilver/formIE.css");
--------------------------------------------------------------------------------
上面所找出的档桉,把档桉中有关 subSilver 字全部取代为ABC(假设名字),特别注意 subSilver.cfg 与 subSilver.css 这二支档桉的档名也要改成ABC.cfg与ABC.css 喔。
到这边必须先考虑一件事情,你的风格要採行内建的css或者是引入式的css,这关乎你安装风格日后css的异动模式,内建css的模式将是以后台风格管理来修改css,再藉由输出写入资料库才会发生作用,而你一开始所创的ABC.cfg就是第一次安装风格时候会自动输入到资料库的css参数。採用这模式的话,不用去理会ABC.css这隻档桉。而css档桉引入模式则是任何css修改都要去修改ABC.css,关于这部分我再另外写一篇更详细说明文件。
如果你一开始找的范本风格是採css引入式,则你也要跟着他採行这方式,要不你就要自己想办法改回内建式囉。
接着你就可以先安装试看看,到后台风格管理中的建立即可看到新设立的风格名称囉!
安装好之后,你就能开始着手修改美工图,背景啦,图示啦等等。
当然版型修改就要去找出哪隻控制的tpl档桉囉。 濠电姷鏁搁崑鐐哄垂閸洖绠伴柟闂寸蹈閸ヮ剚鐒肩€广儱鎳忓Σ顒勬倵楠炲灝鍔氭い锔诲灣缁牓宕掗悙鏉戔偓鐢告煥濠靛棝顎楀ù婊勭箞閺岋綁骞掗幋鐐蹭淮闂佸搫琚崝宀勫煡婢舵劖鎯炴い鎰╁焺娴硷拷闂傚倸鍊烽懗鑸电仚缂備胶绮崝娆撳箖瑜旈獮妯盒ч崶锝呬壕闁稿瞼鍎愰弫鍐煥閺囨浜剧紓浣插亾闁糕剝绋掗悡銉╂煟閺囩偛鈧湱鈧熬鎷�闂傚倸鍊烽悞锔锯偓绗涘懐鐭欓柟杈剧畱鐎氬銇勯幒鎴濃偓濠氭偝婵犳碍鐓欓梺顓ㄧ畱閺嬫捇鏌涚€n偅灏甸柟鍙夋尦瀹曠喖顢橀悩鍨闂傚倷绶氬ḿ褍煤閵堝&鍥偨缁嬭法鐣哄銈嗘磵閸嬫挻銇勯姀鈩冪妞ゃ垺顨婂畷鎺戔堪鎼粹懣銉︾節閻㈤潧浠滈柣掳鍔庨崚鎺楁偐鐠囪尙顦у┑鐐村灦濮樸劎绮婚弮鍫熺厪闊洤顑呴埀顒佹礋閹潡顢氶埀顒勫蓟濞戙垹鐒洪柛鎰亾閻eジ姊洪崨濞氭垵螞閸愵喖钃熼柕濞垮劗濡插牊淇婇婊呭笡闁圭兘浜堕弻锝嗘償閵忥紕娈ら梺绋款儐閹告悂顢氶妷鈺佺妞ゆ劦鍋呴崓闈涱渻閵堝棗绗掓い锔垮嵆閸┿垽宕楅懖鈺冾啎闂佺懓顕崑鐐典焊閵娾晜鐓曢悗锝庡亝鐏忕數绱掓潏銊﹀磳鐎规洘锕㈤崺鈩冩媴鏉炵増顢樻繝鐢靛Л閹峰啫顓奸崪浣瑰枠濠电偛鐡ㄧ划宥夊箖閸岀偛鏋侀柟鍓х帛閺呮悂鏌ㄩ悤鍌涘