Zwykle gdy pobieramy jakąś skórkę do WordPressa jest ona na ogół już przystosowana do obsługi widżetów. Może się jednak zdarzyć, że tak nie będzie. Ten tutorial ma na cele pokazanie w jaki sposób przystosować ją do ich obsługi. Można go również wykorzystać przy robieniu własnego themu. Są to zaledwie dwie proste czynności polegające na skopiowaniu i wklejeniu tego co niżej napisałem. Będą nam potrzebne do tego dwa pliki z szablonu, mianowicie sidebar.php i functions.php.

Najpierw zajmiemy się plikiem sidebar.php. To co tutaj musimy zrobić to dodać dwie linie kodu na samym początku tuż za <div id=”sidebar”> i na końcu przed </div>.

Za <div id=”sidebar”> wklejamy <?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar() ) : ?> a przed </div> wklejamy <?php endif; ?>.

Już przygotowany plik sidebar.php możecie pobrać niżej.

Drugi plik, którym musimy się zająć to functions.php. Każda szanująca się skórka do WordPressa taki plik posiada, ale jeśli go nie macie to nie musicie sie niczym martwić. Stwórzcie nowy dokument tekstowy i zapiszcie go jako functions.php. Możecie też pobrać mój plik functions.php przystosowany do obsługi widżetów w sidbearze.

Jeśli utworzyliście plik sami to musicie w nim wkleić następujący kod:

<?php
if ( function_exists(‘register_sidebar’) )
register_sidebar(array(
‘before_widget’ => ‘…’,
‘after_widget’ => ‘…’,
‘before_title’ => ‘…’,
‘after_title’ => ‘…’,
));
?>

Zwróćcie uwagę na wykropkowane miejsca. Trzeba w nie wkleić to co znajduje się bezpośrednio przed widżetem i za nim, oraz to co znajduje się przed tytułem widżetu i za nim. Jeśli otworzycie plik sidebar.php, który udostępniłem wyżej do pobrania, to zobaczycie, że przed sidebarem znajduje się <ul class=”ul-box”>, a za nim </ul>. I to własnie należy wkleić w dwa pierwsze wykropkowane miejsca. Przed tytułem widżetu u mnie znajduje się <h3>, a za nim </h3>. Wszystko to po to by dodawane przez was widżety w panelu administracyjnym wordpressa były ostylowane zgodnie z waszą skórką i miały ładny wygląd. Gotowy już kod pasujący do mojego themu powinien zatem wyglądać następująco:

<?php
if ( function_exists(‘register_sidebar’) )
register_sidebar(array(
‘before_widget’ => ‘<ul class=”ul-box”>’,
‘after_widget’ => ‘</ul>’,
‘before_title’ => ‘<h3>’,
‘after_title’ => ‘</h3>’,
));
?>

To już wszystko. Musicie jednak pamiętać, że dodawnie nowego widżetu z panelu administracyjnego automatycznie usunie obecną zawartość sidebaru. Jeśli macie w nim jakieś zdjęcie, tekst o sobie czy cokolwiek innego co chcielbyście żeby się nie zmieniło to jest na to prosty sposób. Wystarczy, że z pierwszego kroku tego tutorialu w pliku sidebar.php kod <?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar() ) : ?> wkleicie za zawartością, którą chcecie zachować bez zmian. Wszystko bowiem co będzie między tym kodem zawarte, a jego zakończeniem <?php endif; ?> będzie traktowane jako dynamiczny sidebar, który możemy zmieniać dodająć nowe widżety, zatem wszystko co ma być widoczne po dodaniu nowego widżetu musi znaleźć się poza nim. Przykład tego znajdziecie w pliku sidebar-katygorie-bez-zmiany.php. W tym wypadku przy dodaniu nowego widżetu nie zostaną usunięte kategorie.