Jedną z rzeczy, której brakuje mi w WordPress to możliwość budowania stron z bloków, które można umieszczać w zdefiniowanych regionach i oczywiście edytować ich zawartość (podobnie jak to ma miejsce w Drupalu).
Ostatnio pracowałam nad serwisem, w którym strona główna składała się z trzech bloków treści i kluczową sprawą była możliwość ich edycji przez klienta. Teoretycznie taką funkcjonalność można „zasymulować” z pomocą widgetów oraz sprytnie zdefiniowanych sidebarów, ale na szczęście szybko okazało się że nie ma takiej potrzeby Rzut oka do repozytorium WordPress i znalazłam kilka obiecujących wtyczek. Ostatecznie jednak wypróbowałam dwie,Multiple content blocks i Page.ly MultiEdit i właśnie tą drugą chciałam tutaj przedstawić.
Krok 1. Instalujemy wtyczkę.
Zaczynamy od początku, czyli od instalacji i aktywacji wtyczki w panelu administracyjnym. Wtyczka nie posiada rozbudowanego panelu opcji. W opcji Ustawienia->Multi-Edit mamy jedynie możliwość włączenia obsługi shortocode-ów w zdefiniowanych regionach. Domyślnie opcja ta jest wyłączona.
Krok 2. Tworzymy szablon strony
Wykonaj kopię pliku page.php i zmień jego nazwę na dowolna inną. Na potrzeby tego artykułu stworzymy szablon strony Kontakt z dwoma blokami treści – Left i Right.
<?php /* Template Name: Kontakt MultiEdit: Left,Right */ ?>
Z punktu widzenia wtyczki page.ly MultiEdit najważniejsza jest druga linijka, gdyż tutaj deklarujemy bloki, z których będziemy korzystać. Nazewnictwo jest dowolne, aczkolwiek nie testowałam, jak wtyczka reaguje na polskie znaki diakrytyczne. Jest to o tyle ważne, że są to równocześnie nazwy regionów wyświetlane w panelu administracyjnym.
Następnie musimy wskazać miejsca w kodzie szablonu, w których powinny zostać wstawione bloki za pomocą poniższego kodu:
<?php multieditDisplay('Left'); ?>
Należy pamiętać, żeby funkcję multiedit() wstawić w środku pętli głównej. W naszym przykładzie mogło by to wyglądać tak:
<?php if (have_posts()) : while (have_posts()) : the_post(); ?> <div <?php post_class() ?> id="post-<?php the_ID(); ?>"> <div class="entry"> <?php the_post(); ?> <div class="left-content"> <?php multieditDisplay('Left'); ?> </div> <div class="right-content"> <?php multieditDisplay('Right'); ?> </div> </div> </div> <?php endwhile; endif; ?>
Struktura i nazewnictwo klas css jest zupełnie dowolne. Ważne, aby nazwa bloku podana jako argument funkcji multieditDisplay()
była zgodna z tą zdefiniowaną w nagłówku.
I jeszcze rzut oka na ostateczny layout:
Krok 3. Tworzymy nową stronę w panelu administracyjnym.
Teraz wystarczy tylko wejść do panelu administracyjnego i utworzyć nową stronę, a następnie wybrać dla niej szablon, który przed chwilą stworzyliśmy. Po zapisaniu kopii roboczej i odświeżeniu strony, naszym oczom ukaże się zmodyfikowany edytor z zakładkami odpowiadającymi naszym regionom.
Zakładka Main Content zawiera główną treść strony (wyświetlaną za w pętli głównej za pomocą funkcji the_post();
).
To w zasadzie koniec. Pozostaje nam już tylko uzupełnić treść w poszczególnych zakładkach i zapisać zmiany. W ten sposób stworzyliśmy stronę ze zdefiniowanymi blokami, których treść można swobodnie edytować.