ForumCała strona

Nawigacja

Aktualnie online

Gości online: 3

Użytkowników online: 0

Łącznie użytkowników: 25,381
Najnowszy użytkownik: wisiuw1966

Logowanie

Nazwa użytkownika

Hasło



Zarejestruj się

Odzyskaj hasło

Shoutbox

Musisz zalogować się, aby móc dodać wiadomość.

JazOOn
24.11.2023 23:38:35
wypraszam sobie. ja dopiero po 40stce. no dobra i po setce tez :-)

hoopak
17.11.2023 16:26:38
Zlot emerytów normalnie Grin

JazOOn
30.10.2023 21:28:53
Pół roku dłuższy staż tu masz :-)

MajsterBieda
29.10.2023 18:37:09
Fakt, ja też miło wspominam. Za rok stuknie mi 20 lat jak tu jestem... Kawał życia Frown

JazOOn
29.10.2023 16:24:05
@Majster - w sumie trochę szkoda... Miło wspominam...

Pobierz nową wersję
Pobierz podręcznik
Zobacz inne oficjalne Supporty
Statystyki supportu
PHP-Fuson PL na Facebooku

RSS

Polecamy hosting SferaHost.pl

Nawigacja

Konwersja skórek do PHP-Fusion v7 cz.1

Napisane przez jantom dnia 21 lutego 2009 21:51 · 4 komentarze · 14444 czytań · Drukuj · Facebook · Wykop

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ę.

Opis należy czytać ze zrozumieniem. W niektórych przypadkach należy coś zastąpić, w innych coś dodać, a jeszcze innym razem coś zmienić (zgodnie z podanym przykładem). Należy zrozumieć opisane zmiany i wtedy odpowiednio zmieniać swój kod. Skórki PHP-Fusion są zbyt różnorodne, aby możliwe było opracowanie precyzyjnego opisu “krok po kroku” dla każdego możliwego przypadku. Podane przykłady ułatwiają zrozumienie wymaganych poprawek i modyfikacji, ale nie należy nimi bezmyślnie zastępować kodu w aktualizowanej skórce.

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'>&middot;</span>");

Aby użyć obrazka, należy wprowadzić w odpowiednim miejscu znacznik img (zamiast &middot). 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'>&middot;</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 " &middot;\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 ? "&nbsp;" : "")."
                </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']." &copy; 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,"&middot;").newsopts($info,"&middot;").closeform("N",$info['news_id'])."
Wystarczy tylko usunąć openform() i zamiast closeform() wpisać itemoptions() :
".newsposter($info,"&middot;").newsopts($info,"&middot;").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='&middot;'>
    ".$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&amp;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

#1 | lukasz1980 dnia 23 lutego 2009 21:01
Taki tutek juz od dawna na extreme-fusion ale fajnie że tutaj również jest Wink
#2 | Pieka dnia 23 lutego 2009 21:11
Ten jest nasz wlasny, o czym informuje opis widoczny pod kazdym artykulem.
#3 | lukasz1980 dnia 25 lutego 2009 15:21
Ja nie twierdzę że nie, ale tylko mówię Wink
#4 | lupozo dnia 27 lutego 2009 16:51
Przyda się na pewno Smile

Dodaj komentarz

Zaloguj się, aby móc dodać komentarz.

Oceny

Tylko zarejestrowani użytkownicy mogą oceniać zawartość strony
Zaloguj się lub zarejestruj, żeby móc zagłosować.

Świetne! Świetne! 75% [3 głosy]
Bardzo dobre Bardzo dobre 25% [1 głos]
Dobre Dobre 0% [0 głosów]
Średnie Średnie 0% [0 głosów]
Słabe Słabe 0% [0 głosów]
Created by Arox Copyright (C) 2004
Copyright (C) 2004 - 2018 Ekipa PHP-Fusion.pl