[Klausimas ,Pamoka] Php Fusion tema.

Na va radau aš kaip koduoti Php Fusion dizainą tik nežinau ar čia viskas ir-ar V7-am tinka :) . Tai jei viskas ok tai man mažiau jūsų pagalbos reikės ir pradėsiu koduoti :) .Šaltinis

Supažindinsiu su detalia PHP-Fusion Theme sudėtimi ir sukursime theme.

Susikūriame tuščia aplanką ir pavadiname kaip tik norite, dabar atsidarome šį aplanką ir sukuriame failą pavadinimu "styles.css", atsidarome Notepad (arba kitą editorių koki turite).

1,1 dalis - Nuorodos

Dedame į savajį styles.css tai:

a {

color : #000;

text-decoration : none;

}

a:hover {

color : #000;

text-decoration : underline;

}

Color dalis:

Dabar jums reikia spalvų (RGB Kodais), jų rasite čia html-color-codes.com, kad galėtume pakeisti "color" sau tinkama spalva.

text-decoration dalis:

teksto dekoracijos gali būti:

· none

· underline

· overline

· line-through

1,2 Dalis - Šoninės nuorodos

(Tai jūsų saito šoninės panelės)

a.side {

color : #000;

text-decoration : none;

}

a:hover.side {

color : #000;

text-decoration : underline;

}

1,3 Dalis - Viršutinės nuorodos

(Randasi subheaderyje, tai nuorodos po jūsų baneriu)

a.white {

color : #000;

text-decoration : none;

}

a:hover.white {

color : #000;

text-decoration : underline;

}

2,1 Dalis - Body (bendras saito vaizdas)

(Pagrindinė dalis, kurioje bendra saito išvaizda,teksto dydis ir pagrindinis fonas)

body {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 11px;

}

2,2 Dalis - Horizonatios Linijos

(Atrodo kaip paprastas tagas <hr>)

hr {

height : 1px;

border : 1px solid #eee;

}

hr.side-hr {

height : 1px;

border : 1px solid #eee;

}

2,3 Dalis - Lentelės,alt tekstas ir t.t.

(Reguliuoja tekstų spalvas,forume, vartotojo informacijoje - Vieta, Kada registravosi ir t.t.)

td {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 11px;

}

.tbl-border {

color : #555;

background-color : #e1e1e1;

}

.tbl {

font-size : 11px;

color : #000;

background-color : #fff;

padding : 4px;

}

.tbl1 {

font-size : 11px;

color : #000;

background-color : #fff;

padding : 4px;

}

.tbl2 {

font-size : 11px;

color : #000;

background-color : #fff;

padding : 4px;

}

pre {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 11px;

}

.alt {

color : #005599;

}

3,1 Dalis - Headeriai

Nuorodų sektorius:

.white-header {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 10px;

color : #000;

border-bottom : 1px solid #ccc;

padding : 5px;

}

Banerio dalis:

.full-header {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 10px;

color : #000;

background-color : #fff;

border-bottom : 1px solid #ccc;

padding : 5px;

}

3,2 Dalis - Footeris

(Šioje dalyje užrašai kūrėjų (Powered by PHP-Fusion)

.footer {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 10px;

color : #000;

background-color : #fff;

border-top : 1px solid #ccc;

padding : 5px;

}

3,3 Dalis - Mygtukai, teksto fonas (textbox)

.button {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 10px;

color : #000;

background-color: #fff;

height : 20px;

border : 1px solid #ccc;

margin-top : 2px;

}

.textbox {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 10px;

color : #000;

background-color : #fff;

border : 1px solid #ccc;

}

form {

margin : 0px;

}

4,1 Dalis - Panelių išvaizda

(panelių fonai, bet ne užrašų)

.main-body {

font-size : 11px;

color : #000;

background-color : #fff;

padding : 4px 4px 5px 4px;

}

.side-body {

font-size : 10px;

color : #000;

background-color : #fff;

padding : 4px;

}

4,2 Dalis - Panelių pavadinimų užrašai (panel titles)

.capmain {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 11px;

font-weight : bold;

color : #000;

background-color: #fff;

border-bottom : 1px solid #ccc;

padding : 2px 4px 4px 4px;

}

.scapmain {

font-family : Verdana, Arial, Helvetica, sans-serif;

font-size : 10px;

font-weight : bold;

color : #000;

background-color: #fff;

border-bottom : 1px solid #ccc;

padding : 4px;

}

4,3 Dalis - Kampai ir fonai

(Tai visi jūsų kampai theme's)

.main-bg {

color : #000;

background-color : #fff;

padding : 5px;

}

.outer-border {

border : 1px solid #ccc;

}

.border {

border : 1px solid #ccc;

}

.side-border-left {

border-right : 1px solid #ccc;

background-color : #fff;

padding : 5px;

}

.side-border-right {

border-left : 1px solid #ccc;

background-color : #fff;

padding : 5px;

}

4,4 Dalis - Naujienos ir Balsavimai

Naujienų apačia Footer (pvz.: Naujieną parašė: Nikas)

.news-footer {

font-size : 10px;

color : #000;

background-color : #fff;

border-top : 1px solid #ccc;

padding : 3px 4px 4px 4px;

}

O čia balsavimo bloko spalva

.poll {

height : 12px;

border : 1px solid #000;

}

5,1 Dalis - Forumai, mini-čatas, komentarai

(Forumo quote, kategorijų vardai, mini-čato pranešimai ir komentarai)

.forum-caption {

font-size : 11px;

font-weight : bold;

color : #000;

background-color: #fff;

padding : 2px 4px 4px 4px;

}

/* Quote langas */

.quote {

font-size : 11px;

color : #555;

background-color : #f8f8f8;

padding : 4px;

margin : 0px 20px 0px 20px;

border : 1px solid #bbb;

}

.comment-name {

font-weight : bold;

color : #005599;

}

/* Mini-čato pranešimo autorius */

.shoutboxname {

font-weight : bold;

color : #005599;

background-color : #fff;

}

/* Mini-čato tekstas */

.shoutbox {

color : #777;

background-color : #fff;

}

/* Mini-čato data */

.shoutboxdate {

font-size : 10px;

color : #888;

background-color : #fff;

}

6,1 Dalis - Maži tekstai, etiketės

(Tai mažiausi tekstai ir šoninių panelių etiketės (labels))

.small {

font-size : 10px;

font-weight : normal;

}

/* mažiausias tekstas */

.small2 {

font-size : 10px;

font-weight : normal;

color : #555;

}

/* mažas tekstas panelėse */

.side-small {

font-size : 10px;

font-weight : normal;

color : #555;

background-color : #fff;

}

/* nav paneles teksto skyrius */

.side-label {

color : #000;

background-color : #fff;

padding : 2px 2px 3px 2px;

}

6,2 - Fotogalerija

.gallery {

padding : 16px 0px 8px 0px;

}

.gallery img {

border : 1px solid #ccc;

}

img.activegallery {

border : 1px solid green;

}

Viskas styles.css baigtas.

Dabar theme.php sudėtis.

Sukuriame naują failą pavadintą theme.php ir jį atsidarome su savo naudojamu editoriumi pvz. Notepad.

1,1 Dalis

Pradėsime įterpdami tai:

<?php

čia jus rašysite visą tūrini užbaigdami ?> kurio niekur daugiau neprireiks, tik baigiant theme.

?>

1,2 Dalis

(Šis kodas apibrėž keletą pagrindinių nustatymų)

if (!defined("IN_FUSION")) { header("Location: ../../index.php"); exit; }

require_once INCLUDES."theme_functions_include.php";

/ nustatymai

$body_text = "#000000";

$body_bg = "#ffffff";

$theme_width = "100%";

$theme_width_l = "175";

$theme_width_r = "175";

Paaiškinimas:

$body_text - tai pagrindinė spalva teksto jūsų saite

$body_bg - tai spalva fono jūsų theme

$theme_width - tai dydžiai jūsų theme

1,3 Dalis - Headeris

function render_header($header_content) {

global $theme_width;

/* tai pats viršus jūsų saito */

echo "<table align='center' cellspacing='0' cellpadding='0' width='$theme_width' class='outer-border'>

<tr><td>";

Čia randasi jūsų baneris

echo "<table cellpadding='0' cellspacing='0' width='100%'>

<tr>

<td class='full-header'>

<table cellpadding='0' cellspacing='0' width='100%'>

<tr>

<td>$header_content</td>

</tr>

</table>

</td>

</tr>

</table>\n";

Tai nuorodos, bei laikrodis

echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>

<td class='white-header'><strong>".showsublinks("·", "white")."</strong></td>

<td align='right' class='white-header'>".showsubdate()."</td>

</tr>

</table>\n";

Ir pagaliau pradedame daryti puslapi

echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n";

}

Footeris

(nuorodos apačioje, pvz. Powered by PHP-Fusion)

function render_footer($license=false) {

global $theme_width,$settings;

echo "</tr>\n</table>\n

<table cellpadding='0' cellspacing='0' width='100%'>

<tr>

<td align='center' colspan='3' class='footer'>";

echo stripslashes($settings['footer'])."</td></tr><tr>";

if(!$license){

/* Čia php-fusion teisės */

echo "<td align='left' class='footer' width='30%'>\n

Powered by <a href='http://www.php-fusion.co.uk' class='white'>

PHP-Fusion</a> v".$settings['version']."</td>";

}

/* čia jūsų theme pavadinimas, bei skaitliukas */

echo "<td align='center' class='footer' width='40%'>

<!-- įterpkite čia savo theme pavadinimą -->

</td>

<td align='right' class='footer' width='30%'>".showcounter()."</td></tr>

</table>

</td>

</tr>

</table>\n";

}

Naujienos

čia naujienų tūrinys ir pačios naujienos...

function render_news($subject, $news, $info) {

echo "<table cellpadding='0' cellspacing='0' width='100%' class='border'>

<tr>

<td class='capmain'>$subject</td>

</tr>

<tr>

<td class='main-body'>$news</td>

</tr>

<tr>

<td align='center' class='news-footer'>\n";

echo openform("N",$info['news_id']).newsposter($info,"<br>").newsopts($info,"·").closeform("N",$info['news_id']);

echo "</td>

</tr>

</table>\n";

}

Kitos dalys: straipsnių, ir kai kurių kitų panelių

function render_article($subject, $article, $info) {

echo "<table width='100%' cellpadding='0' cellspacing='0' class='border'>

<tr>

<td class='capmain'>$subject</td>

</tr>

<tr>

<td class='main-body'>

".($info['article_breaks'] == "y" ? nl2br($article) : $article)."

</td>

</tr>

<tr>

<td align='center' class='news-footer'>\n";

echo openform("A",$info['article_id']).articleposter($info,"<br>").articleopts($info,"·").closeform("A",$info['article_id']);

echo "</td>

</tr>

</table>\n";

}

Opentable - centrinės panelės/kaip atrodys puslapis

function opentable($title) {

echo "<table cellpadding='0' cellspacing='0' width='100%' class='border'>

<tr>

<td class='capmain'>$title</td>

</tr>

<tr>

<td class='main-body'>\n";

}

function closetable() {

echo "</td>

</tr>

</table>\n";

}

Openside - tai yra pačios jūsų šoninės panelės

function openside($title) {

echo "<table cellpadding='0' cellspacing='0' width='100%' class='border'>

<tr>

<td class='scapmain'>$title</td>

</tr>

<tr>

<td class='side-body'>\n";

}

function closeside() {

echo "</td>

</tr>

</table>\n";

tablebreak();

}

Opensidex - tai jūsų šoninės panelės tik skirtumas kad jos turinčios funkciją atsidaryti ir užsidaryti pelės paspaudimu.

function opensidex($title,$state="on") {

$boxname = str_replace(" ", "", $title);

echo "<table cellpadding='0' cellspacing='0' width='100%' class='border'>

<tr>

<td class='scapmain'>$title</td>

<td class='scapmain' align='right'>".panelbutton($state,$boxname)."</td>

</tr>

<tr>

<td colspan='2' class='side-body'>

<div id='box_$boxname'".($state=="off"?" style='display:none'":"").">\n";

}

function closesidex() {

echo "</div>

</td>

</tr>

</table>\n";

tablebreak();

}

Tablebreak

function tablebreak() {

echo "<table cellpadding='0' cellspacing='0' width='100%'>\n<tr>\n<td height='5'></td>\n</tr>\n</table>\n";

}

ir čia užbaigiame theme

?>

Forumo paveiksliukai

reikalinga sukurti naują bylą "Forum" ir sukelti jūsų sukurtus paveiksliukus:

aim.gif (aim - skype id)

icq.gif (ICQ )

msn.gif (MSN Messenger)

yahoo.gif (Yahoo! Instant Messenger)

web.gif (Tinklapis)

email.gif (Emailas)

ip.gif (IP addresas – administratoriams bei moderatoriams matomas)

pm.gif (Privati žinutė)

Bylos, aplankai, lipnios temos.

folder.gif (neatsakytos temos) -

folderhot.gif (temos su daug atsakymų) -

folderlock.gif (užrakinta) -

foldernew.gif (temos su naujais pranešimais) -

stickythread.gif (lipni tema) -

newthread.gif (nauja tema) -

reply.gif (rašyti atsakymą) -

Themes Paveiksliukai

Kuriame naują bylą "images" ir sukeliame šiuos paveiksliukus:

Rodyklėlės, strėlės ir panelės

bullet.gif (normali rodyklėlė) -

bulletb.gif (atvirkščia rodyklėlė) -

down.gif (žemyn rodyklė)

right.gif (į dešnę rodyklė)

left.gif (į kairę rodyklė)

up.gif (į viršų rodyklė)

panel_on.gif (an open side panel) –

panel_off.gif (a closed side panel) -

Likusieji:

edit.gif - redaguoti

printer.gif - spausdintuvas

pollbar.gif (balsavimo blokas)

Reikalingas tuščias paveiksliukas pavadinimu - “blank.gif”

jei norite galite įsikelti ikonelę su užrašu PHP-Fusion ir nuoroda į php-fusion.co.uk pavadinimu fusion.gif

Grafinė dalis baigta.

Šis straipsnis labiau jūsų įdomumui, nes theme yra sukurta begalės ir lengviausia jas atsisiūsti, jei ir nerandate sau reikiamos, dabar yra ir kas kuria pagal užsakymus.

Tema per daug detalizuota ir nemanau kad verta su php fusion prasidėt. O antra css kodą galėjai įterpti kaip kodo fragmentą, o ne padrikai išdėstyti.

Kam išvis čia dėjai? Kad pats būtum rašęs, dar suprasčiau, o dabar... Kažkoks keistas tu man, visos tavo temos keistos...

Ypač iš kur paimta pamoka aiškiai parašyta kad blogai padaryta, nes niekam neveikia.

Kam išvis čia dėjai? Kad pats būtum rašęs, dar suprasčiau, o dabar... Kažkoks keistas tu man, visos tavo temos keistos...

Pritariu... Minčių dėstymas kaip boto, kuris karts nuo karto parašo šiame forume siūlydamas pigias kinietiškas prekes...

Kam išvis čia dėjai? Kad pats būtum rašęs, dar suprasčiau, o dabar... Kažkoks keistas tu man, visos tavo temos keistos...

Tai jam tik 10 metų

Pritariu... Minčių dėstymas kaip boto, kuris karts nuo karto parašo šiame forume siūlydamas pigias kinietiškas prekes...

Va, va, kaip tik apie tai ir pagalvojau, kad kai kinietis varo. ;D