CSS, Blog

Tworzymy stronę z blogiem cz. 2

Tworzymy stronę z blogiem cz. 2 Przyglądamy się Movable Type i wyjaśnijmy, w jaki sposób jego modułowa struktura ułatwia dokonywanie przekrojowych zmian na blogach.

Karl Hodge

1 2 3 »

Co budujemy? Przejrzymy podstawowe ustawienia CSS pozwalające zarządzać głównym layoutem każdego bloga i nauczymy się, gdzie i jak edytować odpowiednie pliki. Postępując zgodnie ze wskazówkami, będziemy edytować kod wykorzystywany przez Movable Type do publikacji struktury naszej strony.

Twórcy Movable Type stworzyli w pełni opensource'ową wersję projektu. To oznacza, że następne wersje oprogramowania będą pozbawione ograniczeń "do osobistego użytku", które obecnie widnieją w licencji.

Obecnie obydwie wersje projektu są wirtualnie identyczne. W wersji opensource'owej mamy nocne wydania, natomiast kod edycji zezwalającej na osobisty użytek jest bardziej stabilny. W drugiej części poradnika, mówiącej o tym, jak budować strony z Movable Type, będę odwoływać się właśnie do niego. W poprzednim odcinku pisałem o tym, jak zainstalować Movable Type. Poruszyłem też kwestię systemu stylów - mechanizmu stosowanego do zmiany schematu kolorów i formatowania bloga. Tym razem zagłębię się w nowe funkcje Movable Type 4: modułowe szablony. Dzięki ich edycji możemy wprowadzać zmiany w strukturze strony na poziomie kodu, dodawać i usuwać funkcje, dokonywać sporych zmian w layoucie oraz zwiększać stopień dostosowania całości do naszych potrzeb.

PORADA EKSPERTA:

Template Hammer. Jeśli używaliśmy poprzedniej wersji Movable Type, możemy czuć się odrobinę zagubieni. Wcześniejsze wersje korzystały z pojedynczych płaskich szablonów, podobnych do tych w Bloggerze, które umożliwiały budowanie layoutów stron w ulubionym edytorze. Nowy system modułowy charakteryzuje się kilkoma zaletami, umożliwiając tworzenie kodów wielokrotnego użytku, które można zastosować we wszystkich naszych blogach. Jeśli preferujemy tworzenie layoutu w starym stylu, skorzystajmy z Template Hammer, wtyczki, która konwertuje nasze szablony do pliku z płaskim HTML-em (http://plugins.movabletype. or...).
Podcasting. Choć podcasting nie jest już ostatnim krzykiem mody, jednak nadal to skuteczny sposób dotarcia naszych informacji do innych użytkowników. Movable Type ma wbudowane bezpośrednie wsparcie podcastingu na poziomie kodu. Będziemy jedynie potrzebować wtyczki obsługującej podcasting http://www.majordojo.com/proje... wraz z szablonem RSS, dostępnym na http://www.movabletype.org/doc.... Wtyczki można użyć jako odnośnika do jakiegokolwiek pliku audio w internecie - wystarczy podać prowadzący do niego adres URL.

KROK 1: powrót do stylu

Style Movable Type kontrolują cały wygląd naszej strony z blogiem. Oparto je na CSS-ach, toteż w prosty sposób umożliwiają zmianę schematu kolorów oraz formatowania (opisano to w poprzednim odcinku). Teraz wracamy do Movable Type i wybieramy Design → Styles.

KROK 2: wariacje stylów

Klikamy odnośnik Default Styles, by zobaczyć listę zainstalowanych stylów. Wybieramy którykolwiek z nich i przyglądamy się znajdującemu się po prawej stronie panelowi Selected Design. Mamy tu rozwijane menu, dzięki któremu możemy wybrać wariant layoutu.

KROK 3: umiejscowienie bocznego paska

Opisy takie jak 3 Columns -Wide, Thin, Thin dają mało informacji o elastyczności oferty. Przykładowo, layout Default 2 Column umożliwia zamianę pasków bocznych z prawego na lewy. Thin,Wide, Thin to klasyczny layout CMS-a z nawigacją po którejś ze stron.

KROK 4: forma, treść i struktura

Owe layouty także są kontrolowane za pomocą CSS-a - globalnego pliku o nazwie base_theme.css. To część systemu modułowych szablonów Movable Type 4.1. Jeśli chcemy zmienić strukturę strony, musimy bezpośrednio edytować główne szablony.

KROK 5: globalny CMS

Po raz drugi przechodzimy do menu Design i wybieramy Templates. Ujrzymy listę szablonów, które zarządzają strukturą i treścią naszej strony z blogiem, jak też jego archiwum. Globalny arkusz stylu base_theme.css znajduje się u dołu listy. Klikamy prowadzący do niego odnośnik, dzięki czemu rozpoczniemy edycję.