1. #1
    Bram's Avatar
    Registered
    01/08/02
    Location
    Gent
    Posts
    9,675
    iTrader
    3 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/361

    Q: phpbb customizing

    Hawdie hey, kzen begonne om eens te proberen een phpbb forumke te skinnen, kwas mij aant vervelen en tis eens iets anders, tot nu toe zittek hier:

    http://www.bramme.vekien.co.uk/forum/

    Nu hemmek al gevonde dak voor de header te verandere "overall_header.tpl" moe verandere, dus da gingek nu aan beginne (photoshop headerke mee een ander soortement navigatie).
    Tot nu toe hadded de css altijd aangepast via da online formulier da op het administration paneel zit (iets gemakkelijker voor trial and error, dan steeds opnieuw doc te moeten uploaden), maar nu haddek da css document gedownload om nog wa andere dingen te gaan instellen, alleen vinnek daar gelijk m'n kleurkes nergens in terug... zitten die ergens anders opgeslagen toch???
    If I had a nickel for every time someone told me that my idea for melting down coins to make a giant robotic parrot was a bad idea, I would have one kicka$$ giant robotic parrot.
    no votes  

  2. #2
    [ImpacT]'s Avatar
    Registered
    18/07/02
    Location
    Riemst
    Posts
    766
    iTrader
    2 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Hmm raar dat je dit niet vindt, maar wel overall_header.

    Anywayzz, de CSS vind je ook in deze map

    \templates\joutemplate\joutemplate.css
    Company: Webtrix
    Tek9.net : Technical Advisor - website
    no votes  

  3. #3
    Bram's Avatar
    Registered
    01/08/02
    Location
    Gent
    Posts
    9,675
    iTrader
    3 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/361
    Quote Originally Posted by [ImpacT]
    This quote is hidden because you are ignoring this member. Show
    Hmm raar dat je dit niet vindt, maar wel overall_header.

    Anywayzz, de CSS vind je ook in deze map

    \templates\joutemplate\joutemplate.css
    jaja, da haddek wel gevonde. sorry, khadet vergete te vermelden: khad dus de CSS gedownload ma alsek die bekeek dan stonden m'n zelf aangepaste kleurkes daar gelijk nie in. Da waren precies nog alle standaard kleurkes van subSilver...
    Of hemmek gewoon verkeerd gekeken? kzal mss eerst beter nog k checken...

    edit: nope, khemmet opnief gecheckt: http://www.bramme.vekien.co.uk/forum...mme/bramme.css

    Daar staan de standaard kleure van subSilver enkel in... Wa zou der nu gebeure moestek dees edite en opnief uploaden???

    Edit2: ok, khem nu gevonde da de kleuren in den online editor staan in het bestand theme_info.cfg... daar sta wel degelijk een verwijzing naar bramme.css, toch probere editen???
    Last edited by Bram; 07-02-2006 at 23:00.
    If I had a nickel for every time someone told me that my idea for melting down coins to make a giant robotic parrot was a bad idea, I would have one kicka$$ giant robotic parrot.
    no votes  

  4. #4
    [ImpacT]'s Avatar
    Registered
    18/07/02
    Location
    Riemst
    Posts
    766
    iTrader
    2 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Gho,

    Ik heb in mijn forum gewoon in de basis CSS gewoon nieuwe dingen bijgemaakt en veel zitten te veranderen. Je niveau van CSS moet soms wel wat hoog zijn om alles te vinden, maar na veel zoeken lukt het wel.

    http://forum.findagameserver.com

    Je moet dit maar eens bekijken, dit is ook een phpBB forum, maar 'k heb het helemaal in de vorm van m'n website gegoten.

    Je kan ongeloofelijk veel prullen in de bestanden, zodat de layout zo uitkomt zoals jij het wil, t'is gewoon even wennen aan heel de structuur.
    Company: Webtrix
    Tek9.net : Technical Advisor - website
    no votes  

  5. #5
    Bram's Avatar
    Registered
    01/08/02
    Location
    Gent
    Posts
    9,675
    iTrader
    3 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/361
    dees is momenteel de code van m'n header:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html dir="{S_CONTENT_DIRECTION}">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset={S_CONTENT_ENCODING}">
    <meta http-equiv="Content-Style-Type" content="text/css">
    {META}
    {NAV_LINKS}
    <title>{SITENAME} :: {PAGE_TITLE}</title>
    <!-- link rel="stylesheet" href="templates/bramme/{T_HEAD_STYLESHEET}" type="text/css" -->
    <style type="text/css">
    <!--
    /*
      NOTE: These CSS definitions are stored within the main page body so that you can use the phpBB2
      theme administration centre. When you have finalised your style you could cut the final CSS code
      and place it in an external file, deleting this section to save bandwidth.
    */
    img {border: 0px;}
    /* General page style. The scroll bar colours only visible in IE5.5+ */
    body { 
    	background-color: {T_BODY_BGCOLOR};
    	scrollbar-face-color: {T_TR_COLOR2};
    	scrollbar-highlight-color: {T_TD_COLOR2};
    	scrollbar-shadow-color: {T_TR_COLOR2};
    	scrollbar-3dlight-color: {T_TR_COLOR3};
    	scrollbar-arrow-color:  {T_BODY_LINK};
    	scrollbar-track-color: {T_TR_COLOR1};
    	scrollbar-darkshadow-color: {T_TH_COLOR1};
    }
    
    /* General font families for common tags */
    font,th,td,p { font-family: {T_FONTFACE1} }
    a:link,a:active,a:visited { color : {T_BODY_LINK}; }
    a:hover		{ text-decoration: underline; color : {T_BODY_HLINK}; }
    hr	{ height: 0px; border: solid {T_TR_COLOR3} 0px; border-top-width: 1px;}
    
    /* This is the border line & background colour round the entire page */
    .bodyline	{ background-color: {T_TD_COLOR2}; border: 1px {T_TH_COLOR1} solid; }
    
    /* This is the outline round the main forum tables */
    .forumline	{ background-color: {T_TD_COLOR2}; border: 2px {T_TH_COLOR2} solid; }
    
    /* Main table cell colours and backgrounds */
    td.row1	{ background-color: {T_TR_COLOR1}; }
    td.row2	{ background-color: {T_TR_COLOR2}; }
    td.row3	{ background-color: {T_TR_COLOR3}; }
    
    /*
      This is for the table cell above the Topics, Post & Last posts on the index.php page
      By default this is the fading out gradiated silver background.
      However, you could replace this with a bitmap specific for each forum
    */
    td.rowpic {
    		background-color: {T_TD_COLOR2};
    		background-image: url(templates/bramme/images/{T_TH_CLASS3});
    		background-repeat: repeat-y;
    }
    
    /* Header cells - the blue and silver gradient backgrounds */
    th	{
    	color: {T_FONTCOLOR3}; font-size: {T_FONTSIZE2}px; font-weight : bold; 
    	background-color: {T_BODY_LINK}; height: 25px;
    	background-image: url(templates/bramme/images/{T_TH_CLASS2});
    }
    
    td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
    			background-image: url(templates/bramme/images/{T_TH_CLASS1});
    			background-color:{T_TR_COLOR3}; border: {T_TH_COLOR3}; border-style: solid; height: 28px;
    }
    
    /*
      Setting additional nice inner borders for the main table cells.
      The names indicate which sides the border will be on.
      Don't worry if you don't understand this, just ignore it :-)
    */
    td.cat,td.catHead,td.catBottom {
    	height: 29px;
    	border-width: 0px 0px 0px 0px;
    }
    th.thHead,th.thSides,th.thTop,th.thLeft,th.thRight,th.thBottom,th.thCornerL,th.thCornerR {
    	font-weight: bold; border: {T_TD_COLOR2}; border-style: solid; height: 28px;
    }
    td.row3Right,td.spaceRow {
    	background-color: {T_TR_COLOR3}; border: {T_TH_COLOR3}; border-style: solid;
    }
    
    th.thHead,td.catHead { font-size: {T_FONTSIZE3}px; border-width: 1px 1px 0px 1px; }
    th.thSides,td.catSides,td.spaceRow	 { border-width: 0px 1px 0px 1px; }
    th.thRight,td.catRight,td.row3Right	 { border-width: 0px 1px 0px 0px; }
    th.thLeft,td.catLeft	  { border-width: 0px 0px 0px 1px; }
    th.thBottom,td.catBottom  { border-width: 0px 1px 1px 1px; }
    th.thTop	 { border-width: 1px 0px 0px 0px; }
    th.thCornerL { border-width: 1px 0px 0px 1px; }
    th.thCornerR { border-width: 1px 1px 0px 0px; }
    
    /* The largest text used in the index page title and toptic title etc. */
    .maintitle	{
    	font-weight: bold; font-size: 22px; font-family: "{T_FONTFACE2}",{T_FONTFACE1};
    	text-decoration: none; line-height : 120%; color : {T_BODY_TEXT};
    }
    
    /* General text */
    .gen { font-size : {T_FONTSIZE3}px; }
    .genmed { font-size : {T_FONTSIZE2}px; }
    .gensmall { font-size : {T_FONTSIZE1}px; }
    .gen,.genmed,.gensmall { color : {T_BODY_TEXT}; }
    a.gen,a.genmed,a.gensmall { color: {T_BODY_LINK}; text-decoration: none; }
    a.gen:hover,a.genmed:hover,a.gensmall:hover	{ color: {T_BODY_HLINK}; text-decoration: underline; }
    
    /* The register, login, search etc links at the top of the page */
    .mainmenu		{ font-size : {T_FONTSIZE2}px; color : {T_BODY_TEXT} }
    a.mainmenu		{ text-decoration: none; color : {T_BODY_LINK};  }
    a.mainmenu:hover{ text-decoration: underline; color : {T_BODY_HLINK}; }
    
    /* Forum category titles */
    .cattitle		{ font-weight: bold; font-size: {T_FONTSIZE3}px ; letter-spacing: 1px; color : {T_BODY_LINK}}
    a.cattitle		{ text-decoration: none; color : {T_BODY_LINK}; }
    a.cattitle:hover{ text-decoration: underline; }
    
    /* Forum title: Text and link to the forums used in: index.php */
    .forumlink		{ font-weight: bold; font-size: {T_FONTSIZE3}px; color : {T_BODY_LINK}; }
    a.forumlink 	{ text-decoration: none; color : {T_BODY_LINK}; }
    a.forumlink:hover{ text-decoration: underline; color : {T_BODY_HLINK}; }
    
    /* Used for the navigation text, (Page 1,2,3 etc) and the navigation bar when in a forum */
    .nav			{ font-weight: bold; font-size: {T_FONTSIZE2}px; color : {T_BODY_TEXT};}
    a.nav			{ text-decoration: none; color : {T_BODY_LINK}; }
    a.nav:hover		{ text-decoration: underline; }
    
    /* titles for the topics: could specify viewed link colour too */
    .topictitle,h1,h2	{ font-weight: bold; font-size: {T_FONTSIZE2}px; color : {T_BODY_TEXT}; }
    a.topictitle:link   { text-decoration: none; color : {T_BODY_LINK}; }
    a.topictitle:visited { text-decoration: none; color : {T_BODY_VLINK}; }
    a.topictitle:hover	{ text-decoration: underline; color : {T_BODY_HLINK}; }
    
    /* Name of poster in viewmsg.php and viewtopic.php and other places */
    .name			{ font-size : {T_FONTSIZE2}px; color : {T_BODY_TEXT};}
    
    /* Location, number of posts, post date etc */
    .postdetails		{ font-size : {T_FONTSIZE1}px; color : {T_BODY_TEXT}; }
    
    /* The content of the posts (body of text) */
    .postbody { font-size : {T_FONTSIZE3}px; line-height: 18px}
    a.postlink:link	{ text-decoration: none; color : {T_BODY_LINK} }
    a.postlink:visited { text-decoration: none; color : {T_BODY_VLINK}; }
    a.postlink:hover { text-decoration: underline; color : {T_BODY_HLINK}}
    
    /* Quote & Code blocks */
    .code { 
    	font-family: {T_FONTFACE3}; font-size: {T_FONTSIZE2}px; color: {T_FONTCOLOR2};
    	background-color: {T_TD_COLOR1}; border: {T_TR_COLOR3}; border-style: solid;
    	border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
    }
    
    .quote {
    	font-family: {T_FONTFACE1}; font-size: {T_FONTSIZE2}px; color: {T_FONTCOLOR1}; line-height: 125%;
    	background-color: {T_TD_COLOR1}; border: {T_TR_COLOR3}; border-style: solid;
    	border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
    }
    
    /* Copyright and bottom info */
    .copyright		{ font-size: {T_FONTSIZE1}px; font-family: {T_FONTFACE1}; color: {T_FONTCOLOR1}; letter-spacing: -1px;}
    a.copyright		{ color: {T_FONTCOLOR1}; text-decoration: none;}
    a.copyright:hover { color: {T_BODY_TEXT}; text-decoration: underline;}
    
    /* Form elements */
    input,textarea, select {
    	color : {T_BODY_TEXT};
    	font: normal {T_FONTSIZE2}px {T_FONTFACE1};
    	border-color : {T_BODY_TEXT};
    }
    
    /* The text input fields background colour */
    input.post, textarea.post, select {
    	background-color : {T_TD_COLOR2};
    }
    
    input { text-indent : 2px; }
    
    /* The buttons used for bbCode styling in message post */
    input.button {
    	background-color : {T_TR_COLOR1};
    	color : {T_BODY_TEXT};
    	font-size: {T_FONTSIZE2}px; font-family: {T_FONTFACE1};
    }
    
    /* The main submit button option */
    input.mainoption {
    	background-color : {T_TD_COLOR1};
    	font-weight : bold;
    }
    
    /* None-bold submit button */
    input.liteoption {
    	background-color : {T_TD_COLOR1};
    	font-weight : normal;
    }
    
    /* This is the line in the posting page which shows the rollover
      help line. This is actually a text box, but if set to be the same
      colour as the background no one will know ;)
    */
    .helpline { background-color: {T_TR_COLOR2}; border-style: none; }
    
    /* Import the fancy styles for IE only (NS4.x doesn't use the @import function) */
    @import url("templates/bramme/formIE.css"); 
    -->
    </style>
    <!-- BEGIN switch_enable_pm_popup -->
    <script language="Javascript" type="text/javascript">
    <!--
    	if ( {PRIVATE_MESSAGE_NEW_FLAG} )
    	{
    		window.open('{U_PRIVATEMSGS_POPUP}', '_phpbbprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');;
    	}
    //-->
    </script>
    <!-- END switch_enable_pm_popup -->
    </head>
    <body bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
    
    <a name="top"></a>
    
    <table width="100%" cellspacing="0" cellpadding="10" border="0" align="center"> 
    	<tr> 
    		<td class="bodyline"><table width="750" height="200" border="0" cellpadding="0" cellspacing="0">
    	<tr>
    		<td colspan="17">
    			<img src="images/header_01.gif" width="750" height="181" alt=""></td>
    	</tr>
    	<tr>
    		<td rowspan="2">
    			<img src="images/header_02.gif" width="130" height="19" alt=""></td>
    		<td>
    			<a href="{U_REGISTER}" alt="{L_REGISTER}"><img src="images/register.gif" width="49" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_04.gif" width="27" height="19" alt=""></td>
    		<td>
    			<a href="{U_FAQ}" alt="{L_FAQ}"><img src="images/faq.gif" width="33" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_06.gif" width="19" height="19" alt=""></td>
    		<td>
    			<a href="{U_SEARCH}" alt="{L_SEARCH}"><img src="images/search.gif" width="43" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_08.gif" width="19" height="19" alt=""></td>
    		<td>
    			<a href="{U_MEMBERLIST}" alt="{L_MEMBERLIST}"><img src="images/members.gif" width="55" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_10.gif" width="20" height="19" alt=""></td>
    		<td>
    			<a href="{U_USERGROUPS}" alt="{L_USERGROUPS}"><img src="images/usergroups.gif" width="65" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_12.gif" width="20" height="19" alt=""></td>
    		<td>
    			<a href="{U_PRIVATEMSGS}" alt="{L_PRIVATE_MESSAGE_INFO}"><img src="images/header_13.gif" width="19" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_14.gif" width="23" height="19" alt=""></td>
    		<td>
    			<a href="{U_PROFILE}" alt="{L_PROFILE}"><img src="images/profile.gif" width="39" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_16.gif" width="16" height="19" alt=""></td>
    		<td>
    			<a href="{U_LOGIN_LOGOUT}" alt="{L_LOGIN_LOGOUT}"><img src="images/logout.gif" width="42" height="18" alt=""></a></td>
    		<td rowspan="2">
    			<img src="images/header_18.gif" width="131" height="19" alt=""></td>
    	</tr>
    	<tr>
    		<td>
    			<img src="images/header_19.gif" width="49" height="1" alt=""></td>
    		<td>
    			<img src="images/header_20.gif" width="33" height="1" alt=""></td>
    		<td>
    			<img src="images/header_21.gif" width="43" height="1" alt=""></td>
    		<td>
    			<img src="images/header_22.gif" width="55" height="1" alt=""></td>
    		<td>
    			<img src="images/header_23.gif" width="65" height="1" alt=""></td>
    		<td>
    			<img src="images/header_24.gif" width="19" height="1" alt=""></td>
    		<td>
    			<img src="images/header_25.gif" width="39" height="1" alt=""></td>
    		<td>
    			<img src="images/header_26.gif" width="42" height="1" alt=""></td>
    	</tr>
    </table></td>
    			</tr>
    		</table>
    
    		<br />
    We hemmek gedaan: de standaard tabel mee de links van phpbb vervangen door een table van imageready mee daarin m'n links.

    De images in de juiste folder geupload, ma nu toont em bepaalde images nie ==> wtf???

    Ander probleem: nie langer gecentreerd + algemene structuur om zeep...
    If I had a nickel for every time someone told me that my idea for melting down coins to make a giant robotic parrot was a bad idea, I would have one kicka$$ giant robotic parrot.
    no votes  

  6. #6
    [ImpacT]'s Avatar
    Registered
    18/07/02
    Location
    Riemst
    Posts
    766
    iTrader
    2 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    We hemmek gedaan: de standaard tabel mee de links van phpbb vervangen door een table van imageready mee daarin m'n links.
    We zijn hier geen debug sectie, maar "imageready" sorry, maar dat heeft geen nut, 'k zou dan eerst fatsoenlijk HTML & CSS gaan leren eer je gaat prullen met de code enzow.

    Als je images niet te zien zijn, ga even na wat hun source is en dan weet je ook direct waar je die image mist en waar je hem moet uploaden.
    Company: Webtrix
    Tek9.net : Technical Advisor - website
    no votes  

  7. #7
    Bram's Avatar
    Registered
    01/08/02
    Location
    Gent
    Posts
    9,675
    iTrader
    3 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/361
    Quote Originally Posted by [ImpacT]
    This quote is hidden because you are ignoring this member. Show
    We zijn hier geen debug sectie, maar "imageready" sorry, maar dat heeft geen nut, 'k zou dan eerst fatsoenlijk HTML & CSS gaan leren eer je gaat prullen met de code enzow.

    Als je images niet te zien zijn, ga even na wat hun source is en dan weet je ook direct waar je die image mist en waar je hem moet uploaden.
    waarom zouk m'n tabel in godsnaam moete gaan herschrijve??? dedie die van imageready komt doet toch perfect zijn ding??? Maar soit ja, als het te lastig is om eens ff te helpen debuggen, ook al is het maar html, dan laat ik het wel zo...
    If I had a nickel for every time someone told me that my idea for melting down coins to make a giant robotic parrot was a bad idea, I would have one kicka$$ giant robotic parrot.
    no votes  

  8. #8
    [ImpacT]'s Avatar
    Registered
    18/07/02
    Location
    Riemst
    Posts
    766
    iTrader
    2 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Quote Originally Posted by SveltestSword
    This quote is hidden because you are ignoring this member. Show
    waarom zouk m'n tabel in godsnaam moete gaan herschrijve??? dedie die van imageready komt doet toch perfect zijn ding??? Maar soit ja, als het te lastig is om eens ff te helpen debuggen, ook al is het maar html, dan laat ik het wel zo...
    Kalm aan eh... als ge niet naar goeie raad wilt luisteren is't uw probleem. Heel uw code ff gaan debuggen, sorry ... again, we zijn geen debug station hier.
    Company: Webtrix
    Tek9.net : Technical Advisor - website
    no votes  

  9. #9
    Bram's Avatar
    Registered
    01/08/02
    Location
    Gent
    Posts
    9,675
    iTrader
    3 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/361
    Quote Originally Posted by [ImpacT]
    This quote is hidden because you are ignoring this member. Show
    Kalm aan eh... als ge niet naar goeie raad wilt luisteren is't uw probleem. Heel uw code ff gaan debuggen, sorry ... again, we zijn geen debug station hier.
    mijn excuses, twas nie m'n bedoeling om aggressief ofzo over te komen... Kvon het alleen spijtig da het zowas van "ugh nee merci da is nu ff te lastig" omdak het wel al heb zien gebeure da mensen hele blokken php zetten en die dan wel ontbugged worden...

    Anyhow, tis me zelf gelukt, de links marcheren zelfs
    (ergens een </table> teveel gezet)

    nu alleen nog vinden om de fixed width van de forums zelf wa te verkleinen... alhoewel, da ziennek nog wel...

    Zou der een mogelijkheid zijn om de forums zelf op 100% te laten staan, ma dan bv de width van de faq? en al de rest iets lager te zetten? want nie ziet het er af en toe nogal maf uit...

    Nu alleen nog de knoppen vervangen...
    If I had a nickel for every time someone told me that my idea for melting down coins to make a giant robotic parrot was a bad idea, I would have one kicka$$ giant robotic parrot.
    no votes  

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Log in

Log in