Oczywiście powyższy mechanizm jest dość uciążliwy. Jeśli dojdzie jakaś nowa strona i będziemy ją chcieli umieścić między już istniejącymi to będzie trzeba zmienić pole Order dla kilku stron, chyba że przewidzieliśmy to wcześniej i zrobiliśmy większe odstępy. Jest jednak prostszy sposób. Wystarczy doinstalować plugin do ustawiania kolejności stron np. pageMash. Za pomocą tego pluginu możemy metodą przeciągnij upuść ustawiać zarówno kolejność jak i zagłębienie poszczególnych stron i podstron.

W najnowszej wersji WordPress 3.0, która będzie miała już niedługo premierę będzie zaimplementowany mechanizm tworzenia menu, który znacznie ułatwi ustawianie kolejności i nazw elementów znajdujących się w menu.

Dlatego właśnie opiszę dziś plugin do WP, który zadba o to, by w wyznaczonych przez nas odstępach czasu zrobić backup za nas. Plugin można ściągnąć tutaj:

http://wordpress.org/extend/plugins/dbc-backup/

Jest on banalnie prosty w obsłudze. Po instalacji i aktywacji w menu WP pojawi się nam nowe menu pt: DB Cron Backup. Po wejściu w to menu zobaczymy ekran z kilkoma opcjami:

Opcji jest niewiele i konfiguracja nie powinna sprawić Ci dużego problemu. Export Directory to katalog, w którym plugin ma zapisywać backupy. Niżej możemy wybrać czy mają one być kompresowane, a jeśli tak to jaką metodą. Później ustalamy co jaki czas skrypt backupujący ma się uruchamiać oraz to co ma się dziać ze starszymi wersjami backupów.

Po zapisaniu skrypt odwali za nas całą czarną robotę i już nie musimy martwić się o nasze dane. Myślę, że konfiguracja jest tak prosta, że nie sprawi Ci najmniejszej trudności. W razie czego możesz zawsze zadać pytanie w komentarzu.

Czym zatem jest ta tajemnicza pętla? Jest to podstawowy składnik każdego szablonu i służy do wyświetlania wszystkich wpisów, stron archiwów itp. Jeśli WordPress natknie się na pętle podczas przetwarzania szablonu i wyświetlania strony to w zależności od tego na jakiej stronie znajduje się użytkownik wyświetli mu albo listę ostatnich wpisów, albo pojedynczy wpis bądź stronę statyczną itp.

Pętla powinna znajdować się w pliku index.php. Jeśli nie pamiętasz z jakich plików składa się szablon WP to wróć do poprzednich lekcji tworzenia szablonów. WordPress Loop to kilka linijek kodu php i ma taką postać:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
[tutaj wyświetlanie wpisów]
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>

Wszystko co znajduje się w miejscu [tutaj wyświetlanie wpisów] jest już zawartością pętli i tylko od nas zależy jak to wykorzystamy. Możemy w tym miejscu odwoływać się do wielu zmiennych takich jak nazwa wpisu, data utworzenia, autor itp. wyświetlać i formatować te dane zgodnie z naszym uznaniem. Przykładowa działająca pętla może wyglądać tak:

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2
<small><?php the_time('F jS, Y'); ?></small>
<?php endwhile; else: ?><p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>

Jak widać między tagami h2 wyświeliliśmy nazwę posta, która linkuje do jego zawartości, a poniżej datę utworzenia wpisu. I to wszystko co na tym etapie powinieneś wiedzieć o pętli WP. Wiesz już jak działa i z wiedzą, którą dziś otrzymałeś będziesz umiał ją zastosować.  Jeśli chcesz poznać pozostałe zmienne jakie można tu wyświelić to polecam przeglądnąć pliki defaultowych szablonów WP. W następnym odcinku kursu przejdziemy już do konkretów i przerobimy darmowy szablon html tak, aby działał pod WP.

Pytania i komentarze jak zwykle mile widziane.

1. Page Link Manager – plugin ten instaluje proste menu, które pozwoli Ci wybrać, które strony mają być pokazywane, a które ukryte
2. My Page Order – WP normalnie układa strony w kolejności dodawania lub w zależności od tego jakich parametrów przy wyświetlaniu użył autor templatki. Dzięki temu pluginowi mamy pełną kontrolę nad kolejnością stron.
3. Widget Logic – ten plugin pozwala wyświetlać różne zestawy widgetów, na różnych stronach. Możesz mieć inny zestaw widgetów na stronie głównej, a inny np. na stronie produktu
4. Yoast Breadcrumbs – prosty plugin do wyświetlania tzw. “okruszków chleba” czyli linków, które pokazują użytkownikowi w jakim miejscu znajduje się na stronie i pozwalają łatwo nawigować po drodze, która przeszedł, aby znaleźć się w danym miejscu.
5. Search Everything – standardowo wyszukiwarka WP szuka tylko po wpisach, dzięki tej wtyczce możesz zmusić wyszukiwarką do przeszukiwania także stron.
6. Analytics360 – statystyki Google Analytics – ten plugin wyróżnia się od innych tego typu tym, że daje dostęp do statystyk z poziomu panelu admina.
7. WP-CMS Post Control – zwiększa kontrolę nad opcjami edycji wpisów. Pozwala w pełni skonfigurować to do czego mają dostęp autorzy wpisów, dzięki czemu edycja wygląda bardziej jak w zwykłym CMSie.
8. Widgets Reloaded – plguin, który uaktualnia listę standardowych widgetów i dodaje im wiele nowych funkcjonalności – sam zobacz!
9. Ozh’ Admin Drop Down Menu – ten plugin zmienia sposób wyświetlania menu w panelu admina z listy po lewej na menu typu drop down na górze panelu dzięki czemu mamy łatwiejszy dostęp do poszczegółnych opcji.

Możesz oczywiście uzupełnić tą listę według własnych potrzeb, albo usunąć z niej zbędne wtyczki.

Edycja plików szablonu

Otwórz plik, w którym chcesz użyć wtyczki do stronnicowania. Przeważnie będzie to plik index.php lub/i plik archives.php i search.php, które odpowiadają za wyświetlanie listy wpisów. Znajdź w tych plikach taki oto kod:

<div>
	<div><?php next_posts_link('Previous entries') ?></div>
	<div><?php previous_posts_link('Next entries') ?></div>
</div>

i zatąp go takim kodem:

<?php
include('wp-pagenavi.php');
if(function_exists('wp_pagenavi')) { wp_pagenavi(); }
?>

W taki oto sposób zamieniliśmy zwykłe stronnicowanie na nowe w postaci numerów stron. Kiedy odświeżysz stronę to nic się nie stanie ponieważ nasz plugin nie jest jeszcze dostosowany do działania w szablonie. Aby wszystko działało jak należy musisz otworzyć plik wp-pagenavi.php i znaleźć w nim taką linię kodu:

function wp_pagenavi($before = '', $after = '') {
        global $wpdb, $wp_query;

Zastąp go takim kodem:

function wp_pagenavi($before = '', $after = '') {
	global $wpdb, $wp_query;
        pagenavi_init(); //Calling the pagenavi_init() function

Po odświeżeniu strony już wszystko powinno działać jak należy. Wystarczy jeszcze dodać plik css do naszego szablonu, aby móc kontrolować wygląd listy stron. W nagłówku pod odwołaniem do głównego szablonu css dodaj taką linię:

<link rel="stylesheet" href="<?php echo TEMPLATEPATH.'/wp-pagenavi.css';?>" type="text/css" media="screen" />

Możesz już formatować wygląd listy stronnicowania poprzez szablon pagenavi.css.

Szablon każdej strony składa się z kilku podstawowych elementów takich jak nagłówek, “ciało dokumentu”, pasek boczny, stopka itp. Oczywiście każda strona jest inna i ten schemat nie zawsze się sprawdza. Mimo to w Wordpresie ten podział został ujęty w podobny sposób i każdy element strony zawiera się w osobnym pliku. I tak mamy pliki:

1) header.php – nagłówek

2) sidebar.php – pasek boczny

3) footer.php – stopka

Plik index.php zawiera natomiast  z reguły cała resztę czyli ciało dokumentu i kod odpowiedzialny za wyświetlanie postów, archiwum, stron statycznych itp. Plik ten pobiera także wszystkie inne elementy strony za pomocą kilku linii php. Za chwilę opiszę jak się to robi. Wróćmy zatem do naszego poprzedniego przykładu i podzielmy nasz przykładowy szablon strony na poszczególne pliki. To jak dokładnie będzie wyglądał ten podział zależy w dużej mierze od Ciebie i Twoich potrzeb – mimo to można przyjąć ogólną regułę, że podział przebiega w granicach wyznaczonych przez poszczególne elementy blokowe szablonu czyli element header (który jest naszym nagłówkiem) przenosimy do pliku header.php itp.

Przykładowy kod do, którego dodałem poszczególne sekcje wygląda tak:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Przykładowy szablon</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="<?php bloginfo(’stylesheet_url’); ?>" type="text/css" />
</head>
<body>
<div id="header">Nasz nagłówek</div>
<div id="content">Nasz główny content</div>
<div id="sidebar">Pasek boczny</div>
<div id="footer">Stopka</div>
</body>
</html>

Oczywiście możesz dowolnie ostylować taką stronę. Chodzi tutaj o pokazanie samej struktury szablonu. Moglibyśmy poniższy kod zapisać po prostu do pliku index.php i będzie on działał jako szablon. Mimo to, dla późniejszej wygody i po prostu porządku podzielimy cały kod na fragmenty.

Tak będzie wyglądał nasz plik header.php:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Przykładowy szablon</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="<?php bloginfo(’stylesheet_url’); ?>" type="text/css" />
</head>
<body>
<div id="header">Nasz nagłówek</div>

Jak widzisz wkleiłem tu całość od początku dokumentu do końca nagłówka, w którym później możemy umieścić logo serwisu itp. Plik sidebar.php będzie wyglądał tak:

<div id="sidebar">Pasek boczny</div>

natomiast plik footer.php jak łatwo się domyślić będzie zawierał w sobie dalszą część strony do końca dokumentu:

<div id="footer">Stopka</div>
</body>
</html>

Mamy już stronę podzieloną na sekcję, które teraz znajdują się w osobnych plikach. Możesz je wgrać na serwer. Ostatnia czynność jaką musimy wykonać, aby wszystko działało to w pliku index.php podmienić usunięty kod na pojedyncze linie php, które pobiorą te fragmenty z osobnych plików, które właśnie utworzyliśmy.

Kod index.php będzie wyglądał zatem tak:

<?php get_header(); ?>
<div id="content">Nasz główny content</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

I to wszystko. Jak widzisz łatwo zapamiętać poszczególne kody php służące do pobierania pozostałych plików szablonu. W dalszej kolejności będziemy edytować jeszcze plik index.php, tak aby wyświetlał poszczególne wpisy. Odbywa się to przy wykorzystaniu tzw. wordpress loop (pętli wordpress). W kolejnych wpisach opiszę dokładnie jak zbudowana jest taka pętla i jakie dokładnie spełnia funkcje. Pozostałe fragmenty oczywiście także wyposażymy w dodatkowe funkcjonalności np. pasek boczny będzie mógł wyświetlać widgety czyli specjalne moduły spełniające wyspecjalizowane funkcję takie jak galeria, lista komentarzy itp.

Ostatnia rzecz jaką dziś jeszcze zrobimy to dodanie do plików nagłówka i stopki specjalnych kodów, które pobiorą dane wysyłane przez WP, które muszą się znaleźć w tych miejscach. W taki sposób działają różne pluginy, które muszą dodać swój kod do naszego szablonu. Zatem plik header.php w ostatecznej wersji będzie wyglądał tak:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Przykładowy szablon</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="<?php bloginfo(’stylesheet_url’); ?>" type="text/css" />
<?php wp_head(); ?>
</head>
<body>
<div id="header">Nasz nagłówek</div>

Dodałem linijkę <?php wp_head(); ?> W tym miejscu wordpress będzie wstawiał swój kod. Na razie nie musimy dokładnie wiedzieć w czym rzecz – ważne, że bez tego niektóre pluginy nie będą działały oraz to, że kod ten musi znajdować się w sekcji head naszej strony.

Analogicznie plik footer.php będzie miał taką postać:

<div id="footer">Stopka</div>
<?php wp_footer(); ?>
</body>
</html>

Dodatkowa linia powinna znajdować się przed tagiem body i ma podobne znaczenie co ta w pliku header.php. Po wgraniu na serwer szablon powinien działać tak samo jakby znajdował się w jednym pliku. Mimo to, że nie widać różnicy w działaniu to poczyniliśmy duży krok naprzód w projekcie naszej templatki wordpress. Komentarze jak zwykle mile widziane.

czytaj dalszy ciąg kursu

1. Tworzymy kilka instalacji WordPressa w jednej bazie danych dla poszczególnych języków. Różnią się one tylko i wyłącznie prefiksem. Np. język defaultowy ma prefiks wp_, a np. dodatkowy język powiedzmy niemiecki wpde_. Pliki nie są w żaden sposób duplikowane.

Bazę można sobie skopiować po utworzeniu defaultowej wersji i ustawieniu wszystkiego i zmienić tylko prefiks.

2. Dalej będziemy potrzebowali dodatkowej subdomeny dla drugiego języka w postaci np. de.nazwastrony.pl – musi ona być skierowana na ten sam katalog co domena główna. Teraz dodajemy do pliku config.php taki kod, a w zasadzie zamieniamy linijkę:

$table_prefix  = 'wp_';

na:

$subdomain = substr($_SERVER['HTTP_HOST'], 0, strpos($_SERVER['HTTP_HOST'], '.'));
if ($subdomain == 'de')
{
$table_prefix = 'wpde_';
}
else
{
$table_prefix = 'wp_';
}

Powyższy kod robi jedną prostą operację. Wykrywa czy wejście na stronę nastąpiło z subdomeny – jeśli tak to zmienia prefiks z wp_ na wpde_ dzięki czemu na stronie zacznie się pojawiać treść z bazy w innym języku.

3. Wystarczy jeszcze tylko w kodzie templatki dodać flagi podlinkowane odpowiednio do adresu z subdomeną i bez subdomeny i wszystko działa.

4. Aha, w konfiguracji WP należy jeszcze zmienić w tej dodatkowej wersji językowej adres bloga na adres z prefiksem.

Dzięki takiej operacji mamy  osobny panel dla każdej wersji językowej w zależności z której domeny wejdziemy do wp-admin.  To rozwiązanie ma swoje wady i zalety. Wadą na pewno jest konieczność tworzenia drugiej bazy. Zaleta jest taka, że mamy osobną edycję do każdego języka i nic nam się nie miesza. Możemy także w każdej wersji językowej zmodyfikować szablon, co może przydać się np. do zmiany odnośnika “read more” itp. Dodatkowa wersja językowa może się różnić także kategoriami, stronami itp. – w zależności od tego czy mamy tłumaczenie do danej strony czy nie możemy ją np. całkiem wyłączyć lub zmienić na inną.

Sposób ten zastosowałem na stronie mojej klientki, gdyż żaden plugin stworzony do tego celu nie chciał działać jak należy. Mam nadzieję, że komuś się to przyda. Komentarze jak zwykle mile widziane.

Wystarczy wyedytować plik wp-login.php znajdujący się w katalogu głównym bloga i znaleźć linię 190, w której znajduje się taki kod:

if (empty($key))

Należy zamienić go na:

if(empty($key) || is_array($key))

Po tym zabiegu możemy spać spokojnie. Sposób naprawy znalazłem na stronie: http://www.wprecipes.com/prevent-password-reset-hacking-on-your-wordpress-blog

Dla osób nieobeznanych z edycją plików php podaje link do poprawionego pliku, wystarczy stary plik podmienić na ten nowy.

Darmowe szablony wordpress:

- http://wordpress.org/extend/themes/

- http://topwpthemes.com/

- http://wordpressthemesbase.com/

- http://www.nattywp.com/index.php

- http://www.wpthemespot.com/

Szablony premium (płatne):

- http://themeforest.net/

- http://www.premiumwp.com/

- http://premiumthemes.net/

- http://www.woothemes.com/

- http://www.elegantthemes.com/

- http://www.nattywp.com/

Jak widzisz mając umiejętność tworzenia szablonów w WP można całkiem nieźle na tym zarobić. Jeśli jeszcze nie potrafisz tworzyć własnych templatek to z pewnością zainteresuje Cię seria wpisów na blogu, która porusza to zagadnienie.  Naukę możesz rozpocząć tutaj.

Jeśli chciałbyś dodać tutaj jakąś stronę – swoją lub tak, którą uważasz za ciekawą to zostaw komentarz.

Zaczniemy od tego, że wszystkie szablony w WP znajdują się w katalogu wp-content/themes i są pogrupowane w podkatalogi. Zaraz po instalacji w katalogu tym znajdują się dwa szablony: classic i default. Możesz podglądnąć ich pliki, żeby zobaczyć jak są skonstruowane.

Każdy szablon składa się z kilku plików jednak do działania szablonu niezbędne są tylko dwa: index.php oraz style.css. Od nich zatem zaczniemy budowę nowego szablonu.

Utwórz w edytorze, z którego korzystasz plik index.php i wklej do niego taki kod:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Przykładowy szablon</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />
</head>
<body>
  Witaj Świecie!
</body>
</html>

Jak widać jest to zwykły szablon strony xhtml. Jedyna różnica polega na tym, że zamiast zwykłego odwołania do pliku css mamy tu linijke kodu php <?php bloginfo(‘stylesheet_url’); ?>, który jest odpowiedzialny za załadowanie standardowego pliku css dla szablonu – pliku style.css. Utwórz teraz plik style.css i umieść w jego treści taki kod:

/*
 Theme Name: Nowy szablon
 */

Jak widzisz plik css musi zawierać tylko jedną linijkę, która definiuje jego nazwę. To wystarczy żeby wyświetlił się na liście szablonów w panelu zarządzania.

Utwórzy nowy folder w katalogu wp-themes/content np. o nazwie szablon i wgraj do niego plik index.php oraz style.css. Wejdź do panelu zarządzania blogiem i do menu Apperance oraz Themes. Szablon już powinien być widoczny na liście i można przełączyć wyświetlanie strony na niego. To wszystko. Proste, prawda? Oczywiście nie jest to jeszcze w pełni funkcjonalny szablon i do tego, aby działał jak należy jeszcze długa droga.

Zróbmy jeszcze jeden krok naprzód i zmodyfikujmy plik index.php tak, aby na pasku przeglądarki wyświetlał prawidłowy tytuł bloga:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title><?php bloginfo('name'); ?></title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" />
</head>
<body>
  Witaj Świecie!
</body>
</html>

Zamiast tytułu wpisanego na sztywno dodałem kod php w postaci: <?php bloginfo(‘name’); ?> Kod zgodnie z tym co widać pobierze informacje o blogu, a konkretnie jego nazwę i wyświetli jako tytuł. W taki sam sposób dodajemy wyświetlanie listy stron, kategorii itd. Myślę, że taki zasób wiedzy na początek zupełnie wystarczy, aby nie przeładować Twojej pamięci. Będę sukcesywnie zaznajamiał Cię z kolejnymi tajnikami tworzenia szablonów w kolejnych wpisach.

czytaj dalszy ciąg kursu>>