Nawigacja
Konwersja skórek do PHP-Fusion v7 cz.1
Napisane przez jantom
dnia 21 lutego 2009 21:51 ·
4 komentarze ·
14927 czytań ·
· 
· 
Streszczenie:
Artyku? w ca?o?ci po?wi?cony systemowi skórek, jaki jest wykorzystywany w PHP-Fusion v7. Znajdziesz w nim wszystkie informacje dotycz?ce tworzenia, modyfikowania oraz konwersji starszych skórek do najnowszej wersji PHP-Fusion. W tej cz??ci dowiesz si? o idei, jaka przy?wieca?a autorom systemu szablonów oraz jakie zmiany zosta?y wprowadzone w pliku theme.php, w którym zapisany jest szkielet ka?dej skórki dla PHP-Fusion.Idea skórek v7
Je?li porównamy sposób w jaki dzia?aj? skórki v6 i v7, stwierdzimy ró?nice w pewnych aspektach. Autorzy PHP-Fusion 7 postanowili da? wi?cej mo?liwo?ci twórcom skórek, a jednocze?nie zachowa? system tak podobny jak to tylko mo?liwe do wcze?niejszych wersji. Dzi?ki temu ich u?ytkownicy mog? ?atwo przej?? na now? wersj?. W rezultacie podstawowa idea systemu skórek opartych na funkcjach zosta?a zachowana, ale dodane zosta?y niektóre korzy?ci skórek opartych na szablonach.
Zmiany w skórkach v7
Plik theme.php
Najistotniejsze zmiany zasz?y w pliku theme.php. Funkcje render_header() i render_footer() zosta?y po??czone w jedn? render_page(). Daje to projektantom skórek wi?ksz? kontrol? nad trzema kolumnami zawarto?ci strony. W PHP-Fusion 6 nie mo?na by?o wp?ywa? na kolejno?? i struktur? tabeli g?ównej i jej trzech komórek. W PHP-Fusion 7 taka mo?liwo?? jest. Zosta?y równie? po??czone funkcje openside() i opensidex(), powód by? do?? oczywisty – obie funkcje mia?y wi?kszo?? wyników identycznych, a ró?ni?y si? tylko w zakresie przycisku zwijania/rozwijania. Aby umo?liwi? u?ytkownikom bardziej zaawansowane zarz?dzanie banerami (bez u?ycia modów), zmienna prosta $header_content, przechowuj?ca baner strony, zosta?a zast?piona funkcj? showbanners(), której wynikiem s? parametry banera pobrane z ustawie? g?ównych. Udost?pniony zosta? równie? nowy panel administracyjny banerów. Istniej?ca w wersji 6 funkcja showsublinks() zwraca teraz list? nieuporz?dkowan? zamiast zwyk?ych hiper??czy. W render_news() i render_article() zosta?y usuni?te funkcje openform() i closeform(). Opcje administracyjne dla newsaa b?d? artyku?u zwraca teraz funkcja itemoptions(). Wyrzucono tak?e funkcj? tablebreak(), a margines mi?dzy panelami jest teraz ustawiany z poziomu css.
Nowe mo?liwo?ci
Oprócz wspomnianych zmian, pojawi? si? szereg nowych mo?liwo?ci, które mo?na wykorzysta? w skórkach v7. Uniwersalne klasa do ?atwej integracji zmieniarki styli, np. wielko?ci czcionki czy zmiany kolorów mo?e by? u?yta do dodatkowego doprawienia skórek. Przy pomocy funkcji get_head_tags mo?na tak?e doda? znaczniki do sekcji head strony, a wi?c dodawa? w?asny JavaScript lub arkusze stylów bez modyfikacji g?ównych plików. Projektanci skórek nie s? ju? ograniczeni do u?ywania domy?lnej nazwy i formatów obrazów oraz ich lokalizacji, gdy? te ustawienia mog? by? zmienione za pomoc? odpowiednich funkcji.
Plik styles.css
Zarówno zmienione, jak i nowe cechy PHP-Fusion 7 wymagaj? kilku nowych klas, np.: identyfikator #navigation jest u?ywany w nowym panelu nawigacyjnym (w wersji css), klasa .news-category jest u?ywana w stosunku do obrazu kategorii newsów, klasa .pagenav jest u?ywany do stronicowania (paginacji). Najcz??ciej konieczna jest ingerencja w wi?cej ni? jeden z w/w elementów. Np. #navigation li dotyczy elementów listy (poszczególnych hiper??czy) w panelu nawigacyjnym, a #navigation pozwala okre?la? jej ogólny wygl?d.
Aktualizacja skórki PHP-Fusion 6 do PHP-Fusion 7
Aby skórka utworzone dla PHP-Fusion 6 sta?a si? zgodna z PHP-Fusion 7, nale?y dokona? pewnych zmian w odpowiednich plikach. Przedstawimy to na przyk?adzie skórki Prime autorstwa Digitanium. Jednak?e ka?dy, kto ma troch? do?wiadczenia ze skórkami PHP-Fusion 6 mo?e po prostu porówna? obie wersje skórki (v6 i v7) i stwierdzi? samodzielnie jakie zmiany s? konieczne. Poni?szy opis jest skierowany do osób których do?wiadczenie w zakresie skórek PHP-Fusion jest niewielkie lub ?adne, a mimo to s? zdecydowane we w?asnym zakresie zaktualizowa? swoj? ulubion? skórk?.
Aktualizacja theme.php
Zaczynamy
Po pierwsze, dodajmy poni?szy wiersz kodu na pocz?tku pliku theme.php:
if (!defined("IN_FUSION")) { die("Access Denied"); }Poprawi to bezpiecze?stwo przez zablokowanie mo?liwo?ci indywidualnego uruchomienia pliku theme.php . Je?li podobny kod ju? istnieje, nale?y go zast?pi? powy?szym, który jest bezpieczniejszy. W dalszej kolejno?ci nale?y usun?? niepotrzebne zmienne z pocz?tku theme.php, gdy? nie s? one u?ywane w v7 (mo?liwe jest ich stosowanie, ale sugerujemy korzystanie bezpo?rednio z mo?liwo?ci CSS, zgodnie z ide? nowej wersji systemu). W skórce Prime usuwamy zmienne:
$body_text = "#444444"; $body_bg = "#ffffff"; $theme_width = "100%"; $theme_width_l = "170"; $theme_width_r = "170";
Jedyna definicja, jak? nale?y wykona? w PHP-Fusion 7 to punktor. W naszym przyk?adzie nie u?yjemy obrazu, ale punktora html (kulki). Dodajemy zatem wiersz:
define("THEME_BULLET", "<span class='bullet'>·</span>");
Aby u?y? obrazka, nale?y wprowadzi? w odpowiednim miejscu znacznik img (zamiast ·). Klasa bullet u?atwi w dalszej kolejno?ci ustawienie wygl?du elementów nawigacyjnych. Teraz nale?y upewni? si?, ?e kod zawiera poni?szy wiersz (lub jego odpowiednik):
require_once INCLUDES."theme_functions_include.php";
Do??czy to szereg funkcji pomocniczych, niezb?dnych w dalszych pracach. Niektóre nowsze skórki dla PHP-Fusion 6 zawieraj? go, ale skórka Prime niestety nie, wi?c trzeba go doda?. Pocz?tek pliku theme.php dla skórki Prime powinien teraz wygl?da? tak:
<?php if (!defined("IN_FUSION")) { die("Access Denied"); } // theme settings define("THEME_BULLET", "<span class='bullet'>·</span>"); require_once INCLUDES."theme_functions_include.php";
Mo?emy tak?e usun?? funkcj? tablebreak(), poniewa? nie jest ona u?ywana w PHP-Fusion 7 (odleg?o?? mi?dzy panelami jest okre?lana za pomoc? CSS).
Funkcje render_header() i render_footer()
Jak wspomniano wcze?niej, render_header() i render_footer()
zosta?y po??czone w jedn? funkcj? render_page(). Prostym sposobem jest
zmiana nazwy funkcji render_header() na render_page() oraz
zmiana jej argumentów. render_page() wymaga tylko argumentu $license
funkcji render_footer(), gdy? argument $header_content funkcji
render_header() jest odziedziczony i w zwi?zku z tym zb?dny na li?cie
parametrów funkcji. Zmiany w skrócie wygl?daj? tak:
Przed:
function render_header($header_content) {
Po:
function render_page($license=false) {Teraz nale?y skopiowa? tre?? funkcji render_footer() i wklei? na ko?cu nowej funkcji render_page() (oprócz deklaracji zmiennych globalnych, które ju? wyst?puj? w render_page() ). W przypadku skórki Prime wygl?da to nast?puj?co:
Przed:
function render_page($license=false) {
global $settings;
[...]
echo "
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>\n";
}
function render_footer($license=false) {
global $theme_width,$settings,$locale;
echo "
</tr>
</table>\n";
tablebreak();
echo "
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td class='footer'><br>".stripslashes($settings['footer'])."</td>
</tr>
<tr>
<td align='center' class='footer'>\n";
if ($license == false) {
echo "Powered by <a href='http://www.php-fusion.co.uk' target='_blank'>PHP-Fusion</a> v".$settings['version']." © 2003-2005<br><br>\n";
}
echo $settings['counter']." ".($settings['counter'] == 1 ? $locale['140']."<br><br>\n" : $locale['141']."<br><br>\n")."
</td>
</tr>
</table>
</td>
</tr>
</table>\n";
}
Po:
function render_page($license=false) {
global $settings;
[...]
echo "
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>\n";
//Next step goes here
echo "
</tr>
</table>\n";
tablebreak();
echo "
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td class='footer'><br>".stripslashes($settings['footer'])."</td>
</tr>
<tr>
<td align='center' class='footer'>\n";
if ($license == false) {
echo "Powered by <a href='http://www.php-fusion.co.uk' target='_blank'>PHP-Fusion</a> v".$settings['version']." © 2003-2005<br><br>\n";
}
echo $settings['counter']." ".($settings['counter'] == 1 ? $locale['140']."<br><br>\n" : $locale['141']."<br><br>\n")."
</td>
</tr>
</table>
</td>
</tr>
</table>\n";
}
Teraz mo?na skasowa? pozosta?o?ci po oryginalnej funkcji render_footer().
Przejd?my do punktu wskazanego komentarzem //Next step goes here w powy?szym fragmencie kodu. W PHP-Fusion 6 kod html kolumn by? zdefiniowany poza theme.php – w plikach side-border-right.php i side-border-left.php. W PHP-Fusion 7 mo?na to robi? samodzielnie i tak w?a?nie uczynimy, we wspomnianym miejscu. We wszystkich skórkach v6 w tym punkcie u?yte by?y komórki tabeli, poniewa? nie by?o mo?liwo?ci wyboru pomi?dzy tabelami (table) i blokami (div). Natomiast w PHP-Fusion 7 mo?na w tym miejscu u?y? bloków (div). Mimo to nasz? przeróbk? wykonamy z u?yciem starej, sprawdzonej tabeli. Oto komórki, których potrzebujemy:
<td class='side-border-left'></td> <td class='main-bg'></td> <td class='side-border-right'></td>
Wype?nimy je sta?ymi przechowuj?cymi panele. Nazwy sta?ych powinny by? samokomentuj?ce (mnemoniczne):
<td class='side-border-left'>".LEFT."</td> <td class='main-bg'>".U_CENTER.CONTENT.L_CENTER."</td> <td class='side-border-right'></td>".RIGHT."
Aby wszystko dzia?a?o poprawnie nale?y kod nieco rozbudowa? i w przypadku skórki Prime otrzymamy:
if (LEFT) { echo "<td class='side-border-left' valign='top'>".LEFT."</td>"; } echo "<td class='main-bg' valign='top'>".U_CENTER.CONTENT.L_CENTER."</td>"; if (RIGHT) { echo "<td class='side-border-right' valign='top'>".RIGHT."</td>"; }
Dlaczego tak? Instrukcje if s? konieczne, aby boczne kolumny by?y wy?wietlane tylko wtedy, gdy zawieraj? panele. Aby zawarto?? tabeli zaczyna?a si? od góry (a nie by?a wyrównana domy?lnie do ?rodka) przypisano valign=’top’. W dalszej kolejno?ci zast?pujemy $header_content wywo?aniem showbanners(), która to funkcja jest w PHP-Fusion 7 u?ywana do obs?ugi bannerów strony. Dla skórki Prime wygl?da to tak:
Przed
<td>$header_content</td>
Po
<td>".showbanners()."</td>
Teraz troch? oczy?cimy kod wykorzystuj?c funkcje pomocnicze, które zosta?y do??czone na pocz?tku pliku. Mo?esz pomin?? ten punkt i przej?? do kolejnego, je?li Twoja skórka ju? korzysta z showsublinks(). Starsze skórki PHP-Fusion 6 (np. Prime) maj? d?ugi, skomplikowany kod dla wy?wietlania hiper??czy w nawigacji poziomej. W skórce Prime jest on nast?puj?cy:
<td class='white-header'>"; $result = dbquery("SELECT * FROM ".DB_PREFIX."site_links WHERE link_position>='2' ORDER BY link_order"); if (dbrows($result) != 0) { $i = 0; while($data = dbarray($result)) { if (checkgroup($data['link_visibility'])) { if ($data['link_url']!="---") { if ($i != 0) { echo " ·\n"; } else { echo "\n"; } $link_target = ($data['link_window'] == "1" ? " target='_blank'" : ""); if (strstr($data['link_url'], "http://") || strstr($data['link_url'], "https://")) { echo " <a href='".$data['link_url']."'".$link_target." class='white'>".$data['link_name']."</a>"; } else { echo " <a href='".BASEDIR.$data['link_url']."'".$link_target." class='white'>".$data['link_name']."</a>"; } } $i++; } } } echo ($i == 0 ? " " : "")." </td>
Powy?szy kod zast?pimy znacznie krótszym:
<td class='white-header'>".showsublinks(" ".THEME_BULLET." ", "white")."</td>
Pierwszym argumentem funkcji showsublinks() jest zdefiniowany wcze?niej punktor, a drugi to klasa css stosowana do poszczególnych pozycji listy (hiper??czy). Niektóre skórki v6 wy?wietlaj? dat? stosuj?c konstrukcj?:
ucwords(showdate($settings['subheaderdate'], time()))
co mo?na i warto skróci? w PHP-Fusion 7 do:
showsubdate()
Notka autorska PHP-Fusion tak?e mo?e by? wy?wietlona w znacznie prostszy sposób:
Przed:
echo "Powered by <a href='http://www.php-fusion.co.uk' target='_blank'>PHP-Fusion</a> v".$settings['version']." © 2003-2005<br><br>\n";
Po:
echo showcopyright();
Analogicznie wy?wietlanie licznika odwiedzin tak?e mo?na zast?pi? odpowiedni? funkcj?:
Przed:
echo $settings['counter']." ".($settings['counter'] == 1 ? $locale['140']."<br><br>\n" : $locale['141']."<br><br>\n")."
Po:
echo showcounter().”
Pozosta?o jeszcze usuni?cie ewentualnych wyst?pie? funkcji tablebreak(), która (jak ju? wspomniano) zosta?a usuni?ta w PHP-Fusion 7. Marginesy poprawimy pó?niej, u?ywaj?c css. Funkcja render_page() skórki Prime po wszystkich poprawkach, oczyszczeniu i po??czeniu niektórych polece? echo wygl?da nast?puj?co:
function render_page($license=false) {
global $settings;
echo "<table align='center' cellspacing='0' cellpadding='0'>
<tr>
<td>
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td class='full-header'>
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td>".showbanners()."</td>
</tr>
</table>
</td>
</tr>
</table>
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td class='white-header'>".showsublinks(" ".THEME_BULLET." ", "white")."</td>
<td align='right' class='white-header'>".showsubdate()."</td>
</tr>
</table>
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>";
if (LEFT) { echo "<td class='side-border-left' valign='top'>".LEFT."</td>"; }
echo "<td class='main-bg' valign='top'>".U_CENTER.CONTENT.L_CENTER."</td>";
if (RIGHT) { echo "<td class='side-border-right' valign='top'>".RIGHT."</td>"; }
echo "
</tr>
</table>
<table cellpadding='0' cellspacing='0' width='100%'>
<tr>
<td class='footer'><br>".stripslashes($settings['footer'])."</td>
</tr>
<tr>
<td align='center' class='footer'>\n";
if ($license == false) {
echo showcopyright();
}
echo showcounter()."
</td>
</tr>
</table>
</td>
</tr>
</table>\n";
}
Funkcja render_news()
Funkcja render_news() jest ?atwa do aktualizacji. W nowszych skórkach PHP-Fusion 6 wyst?puje kod:
".openform("N",$info['news_id']).newsposter($info,"·").newsopts($info,"·").closeform("N",$info['news_id'])."Wystarczy tylko usun?? openform() i zamiast closeform() wpisa? itemoptions() :
".newsposter($info,"·").newsopts($info,"·").itemoptions("N",$info['news_id'])."W skórkach, które nie wykorzystuj? nowych funkcji (np. Prime), nale?y zast?pi? ca?y kod now? wersj?, jak poni?ej:
Przed:
<td align='right' class='news-footer'> <img src='".THEME."images/bullet.gif' alt='·'> ".$locale['040']."<a href='profile.php?lookup=".$info['user_id']."'>".$info['user_name']."</a> ".$locale['041'].showdate("longdate", $info['news_date'])." · ".($info['news_ext'] == "y" ? "<a href='news.php?readmore=".$info['news_id']."'>".$locale['042']."</a> ·\n" : ""); if ($info['news_allow_comments']) echo "<a href='news.php?readmore=".$info['news_id']."'>".$info['news_comments'].$locale['043']."</a> ·\n"; echo $info['news_reads'].$locale['044']." <a href='print.php?type=N&item_id=".$info['news_id']."'><img src='".THEME."images/printer.gif' alt='".$locale['045']."' style='vertical-align:middle;border:0px;'></a> </td>
Po:
<td align='right' class='news-footer'>”. newsposter($info, THEME_BULLET).newsopts($info, THEME_BULLET).itemoptions("N",$info['news_id']).” </td>Nie zapomnij o usuni?ciu wywo?a? funkcji tablebreak() je?li wyst?puj?.
Funkcja render_article()
Funkcj? aktualizujemy na identycznych zasadach jak render_news(). Wystarczy zast?pi? "news" przez "article" oraz "N" przez "A":
<td align='right' class='news-footer'>”. articleposter($info, THEME_BULLET).articleopts($info, THEME_BULLET).itemoptions("A",$info['article_id']).” </td>Tu równie? nale?y usun?? wywo?ania funkcji tablebreak() .
Funkcje openside() and opensidex()
Jak ju? wiadomo, funkcje te równie? zosta?y po??czone. Akurat w tym
przypadku jest to troch? skomplikowane, gdy? autor ka?dej skórki robi? je po
swojemu. Dlatego niez?ym sposobem jest porównanie funkcji opensidex()/openside()
w ju? przekonwertowanych skórkach. Oczywi?cie opiszemy teraz kolejne kroki,
które pozwol? to zrealizowa?. Na pocz?tek nale?y usun?? funkcje openside()
i closeside(), a funkcji closesidex() zmieni? nazw? na closeside()
i zmieni? nag?ówek funkcji opensidex() na now? openside():
Przed:
function opensidex($title,$open="on") {
Po:
function openside($title, $collapse = false, $state = "on") {Nast?pnie wykonaj poni?sze kroki: Usu? poni?szy wiersz kodu:
if($open=="on"){$box_img="off";}else{$box_img="on";}Dodaj poni?sze wiersze na samym pocz?tku nowej funkcji openside():
global $panel_collapse; $panel_collapse = $collapse; $boxname = str_replace(" ", "", $title);Dodaj poni?szy wiersz na samym pocz?tku nowej funkcji closeside():
global $panel_collapse;
Zast?p star? wersj? przycisku zwijania now?, opart? na funkcji (niektóre
skórki mog? ju? korzysta? z nowej wersji) i umie?? j? w instrukcji if, co
spowoduje, ?e przycisk b?dzie widoczny tylko w panelach, które mo?na zwija?:
Przed:
<td class='scapmain' align='right'><img src='".THEME."images/panel_$box_img.gif' name='b_$title' alt='' onclick=\"javascript:flipBox('$title')\"></td>
Po:
".($collapse ? "<td class='scapmain' align='right'>".panelbutton($state, $boxname)."</td>" : "")."Zast?p tak?e poprzednie znaczniki blokowe (div) now? funkcj? odpowiedzialn? za ukrywanie zawarto?ci:
<td colspan='2' class='side-body'> <div id='box_$title'"; if($open=="off"){ echo "style='display:none'"; } echo ">\n"; } function closeside() { global $panel_collapse; echo " </div> </td> </tr> </table>\n";
Po:
<td colspan='2' class='side-body'>";
if ($collapse == true) { echo panelstate($state, $boxname); }
}
function closeside() {
global $panel_collapse;
if ($panel_collapse == true) { echo "</div>\n"; }
echo "
</td>
</tr>
</table>\n";
Pierwszy test
Mo?emy ju? spróbowa? w??czy? nasz? aktualizowan? skórk?. Strona powinna si? wy?wietli?, chocia? na pewno nie wszystkie element wygl?daj? tak, jak powinny. Je?li nie wy?wietla si? zupe?nie lub zwraca b??dy, nale?y jeszcze raz sprawdzi? wszystkie poprzednie kroki tego przewodnika i ogóln? poprawno?? kodu. Je?li nie jeste? w stanie zlokalizowa? b??du, szukaj pomocy na stronach PHP-Fusion Themes (http://themes.php-fusion.co.uk) lub na stronach polskiego supportu (http://www.php-fusion.pl).
Zapraszamy do lektury drugiej cz??ci artyku?u
Orygina? tego artyku?u pochodzi z PHP-Fusion Wiki.
Autor: Matonor
T?umaczenie: lomcskw
Korekta i sk?ad: jantom
Komentarze
Dodaj komentarz
Oceny
Zaloguj się lub zarejestruj, żeby móc zagłosować.
| Świetne! |  |
75% | [3 głosy] |
| Bardzo dobre | |
25% | [1 głos] |
| Dobre | |
0% | [0 głosów] |
| Średnie | |
0% | [0 głosów] |
| Słabe | |
0% | [0 głosów] |