F.A.Q. - style i grafika - Nowy wygląd BBCode quote i code
Polaczek - 07-02-2011, 00:54
Temat postu: Nowy wygląd BBCode quote i code
Nowy wygląd BBCode quote i code  
v. 1.0, @polaczek, 2011-02-07
Demonstracja
Wykonanie:
1. Do pliku CSS dodajemy (np. na końcu):
| Kod: | div.codewrapper, div.quotewrapper {
background:#e2e2e2;
border:1px solid #d1d1d1;
margin:5px 7px;
padding:3px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
border-radius:4px;
color:#1a1a1a
}
div.codewrapper:hover, div.quotewrapper:hover {
border-color:#c5c5c5;
-moz-box-shadow:2px 2px 5px #b1b1b1;
-webkit-box-shadow:2px 2px 5px #b1b1b1;
box-shadow:2px 2px 5px #b1b1b1
}
div.codewrapper p.head, div.quotewrapper p.head {
margin:0px 0px 5px 0px;
padding:2px 5px;
font:bold 16px helvetica;
border-bottom:1px solid #d1d1d1
}
div.codewrapper p.bbc_code {
font:12px courier;
color:#008800;
margin:2px 10px;
background:#eaeaea
}
div.quotewrapper p.bbc_quote {
font:14px helvetica;
text-align:justify;
color:#1a1a1a;
margin:2px 10px;
background:#eaeaea
} |
2. W pliku bbcode.tpl (znajduje się w templates/nazwastylu) szukamy:
| Kod: | <!-- BEGIN quote_username_open --></span>
<table width="90%" cellspacing="1" cellpadding="3" border="0" align="center">
<tr>
<td><span class="genmed"><b>{USERNAME} {L_WROTE}:</b></span></td>
</tr>
<tr>
<td class="quote"><!-- END quote_username_open -->
<!-- BEGIN quote_open -->
<table width="90%" cellspacing="1" cellpadding="3" border="0" align="center">
<tr>
<td><span class="genmed"><b>{L_QUOTE}:</b></span></td>
</tr>
<tr>
<td class="quote"><!-- END quote_open -->
<!-- BEGIN quote_close --></td>
</tr>
</table>
<span class="postbody"><!-- END quote_close -->
<!-- BEGIN code_open -->
<table width="90%" cellspacing="1" cellpadding="3" border="0" align="center">
<tr>
<td><span class="genmed"><b>{L_CODE}:</b></span></td>
</tr>
<tr>
<td class="code"><!-- END code_open -->
<!-- BEGIN code_close --></td>
</tr>
</table>
<!-- END code_close --> |
3. Zamieniamy na:
| Kod: | <!-- BEGIN quote_username_open --></span>
<div class="quotewrapper">
<p class="head">{USERNAME} {L_WROTE}</p>
<p class="bbc_quote">
<!-- END quote_username_open -->
<!-- BEGIN quote_open --></span>
<div class="quotewrapper">
<p class="head">{L_QUOTE}</p>
<p class="bbc_quote">
<!-- END quote_open -->
<!-- BEGIN quote_close -->
</p>
</div>
<span class="postbody"><!-- END quote_close -->
<!-- BEGIN code_open -->
<div class="codewrapper">
<p class="head">{L_CODE}</p>
<p class="bbc_code">
<!-- END code_open -->
<!-- BEGIN code_close -->
</p>
</div>
<!-- END code_close --> |
4. Zapisujemy wszystkie pliki i cieszymy się nowym wyglądem BBCode quote i code. 
W tym temacie można także dodawać swoje własne wyglądy BBCode'ów.
|
|
|
