Umbraco CMS - Tworzenie strony zawartości

Autor: Wojciech Poniatowski

Opublikowano: 2011-09-07

W poprzednich artykułach z cyklu o Umbraco CMS poznaliśmy elementy panelu administratora Umbraco. W tym artykule utworzymy strony zawartości naszej witryny i dowiesz się z niego:

• jak i gdzie tworzyć nową zawartość,
• dlaczego typ dokumentu jest ważny,
• jak efektywnie edytować zawartość,
• jak pozycjonować stronę w menu witryny.

Wstęp

Treść to podstawowa zawartość stron internetowych. Umbraco CMS dostarcza funkcjonalność umożliwiającą dodawanie treści, jej edycję, publikację, a także tłumaczenie treści na różne języki. Zarządzanie treścią w Umbraco jest bardzo proste. Dzięki zaawansowanemu edytorowi treści tworzenie nowej zawartości jest jeszcze prostsze.

Wybór szablonu i skórki

W artykule będziemy używać gotowego starter kita „Simple” (rys. 1). Można go wybrać podczas pierwszego uruchomienia Umbraco (po instalacji) lub zaintalować jako pakiet. O instalowaniu pakietów możesz przeczytać w artykule „Instalowanie pakietów”.

Rys.1. Starter kit „Simple”.

Podczas pierwszego uruchomienia możemy wybrać skórkę dla naszej witryny, np. „Designit Green” (rys. 2):

Rys.2. Skórka „Designit Green”.

Po zainstalowaniu możesz przejść do panelu administratora. Można tego dokonać np. w WebMatrix, przechodząc do widoku „Files”, a następnie z listy plików wybrać /umbraco/Default.aspx i klikając prawym klawiszem myszy wybrać z menu kontekstowego „Launch in browser” (rys. 3). Możesz też uruchomić witrynę i w pasku adresu wpisać: http://[adres_twojej_witryny]/umbraco

Rys.3. WebMatrix – uruchamianie panelu administratora.

Typy dokumentów

Zanim utworzysz pierwszą stronę z treścią, należy się upewnić, czy zostały zdefiniowane typy dokumentów. Przejdź do sekcji „Settings” (rys. 4).

Rys.4. Panel administratora – typy dokumentów.

W drzewie dostępnych ustawień rozwiń „Document type”. Jeśli zainstalowałeś starter kit „Simple”, to powinieneś tu znaleźć dwa typy dokumentów – „Homepage” oraz „Textpage”. Typ dokumentu definiuje, jakiego rodzaju treści można tworzyć i co zawierają (z jakich elementów się składają). Wybierz „Homepage”, aby przejść do edycji szczegółów wybranego typu. Pierwsza zakładka „Info” (rys. 5) określa podstawowe informacje o typie dokumentu, m.in. jego nazwę, opis czy domyślne ikony i szablony typu.

Rys.5. Podstawowe informacje typu dokumentu.

Kolejna zakładka to „Structure”. Tutaj określa się, czy strona danego typu może posiadać podstrony, a jeśli tak, to jakie typy dokumentów są dozwolone. Rysunek 6 przedstawia, że dla typu „Homepage” można tworzyć podstrony typu „Textpage”:

Rys.6. Struktura typu dokumentu.

Zakładka „Generic properties” pozwala na tworzenie elementów, z jakich będzie się składała treść. W przykładzie pokazanym na rysunku 7 widać, że „Homepage” składa się z dwóch zakładek – „Site” oraz „Content”. Zakładka „Content” zawiera dwa pola – „Name” oraz „Description”, a zakładka „Content” zawiera jedno pole „Body text”, gdzie można wprowadzać główną treść strony w kontrolce „Richtext editor”.

Rys.7. Elementy budowy typu dokumentu.

Aby dodać kolejny element, wystarczy wybrać „Click here to add a new property”. Wprowadź następujące wartości:

• Name – nazwa elementu,
• Alias – alias nowego elementu,
• Type – typ, kontrolka, za pomocą której będzie można wprowadzać wartości,
• Tab – na której zakładce ma się wyświetlać nowy element,
• Mandatody – czy wypełnienie elementu jest wymagane,
• Validation – dodatkowa walidacja (jeśli jest potrzebna),
• Description – dodatkowy opis pola.

Aby zatwierdzić nowy element, naciśnij Zapisz. Rysunek 8 przedstawia dodawanie nowego elementu –  slogan reklamowy strony:

Rys.8. Tworzenie nowego elementu.

Ostatnia zakładka „Tabs” pozwala na tworzenie nowych zakładek, zmianę nazwy, kasowanie oraz ustawianie kolejności wyświetlania się zakładek (rys. 9):

Rys.9. Zakładki.

Tworzenie nowej strony zawartości

Po zdefiniowaniu co najmniej jednego typu dokumentu można tworzyć nowe strony zawartości. Przejdź do sekcji „Content” i kliknij „Create”. Możesz też kliknąć prawym klawiszem myszy na elemencie „Content”, a z menu kontekstowego wybrać „Create” (rys. 10).

Rys.10. Tworzenie nowej strony.

Na ekranie pojawi się dialog, w którym należy podać nazwę strony oraz określić typ dokumentu (rys. 11), a następnie zatwierdzić całość, klikając przycisk „Create”:

Rys.11. Nowa strona: nazwa i typ.

Teraz możesz wprowadzić zawartość strony. W zależności od wybranego typu dokumentu zobaczysz różny układ zakładek. Rysunek 12 przedstawia zakładki dla typu „Homepage”, który składa się z „Site”, „Content” oraz „Properties”. Typ „Homepage” definiuje, że na zakładce „Site” znajdują się pola „Name” oraz „Description”.

Rys.12. Nowa strona: zakładka "Site".

W zakładce „Content” znajduje się kontrolka „Richtext editor”, w której można wprowadzić główną treść. Richtext editor pozwala na formatowanie treści i dodawanie zdjęć, zupełnie jak w Microsoft Word (rys. 13). Wszystkie opcje edycji i formatowania treści znajdują się na górnej belce.

Rys.13. Nowa strona: zakładka "Content".

Ostatnia zakładka, „Properties”, zawiera dodatkowe informacje o stronie. Znajdziesz tam m.in. datę utworzenia, modyfikacji oraz nazwę użytkownika, który utworzył daną stronę.

Po wprowadzeniu treści nowej strony możesz:

• zapisać ją – strona zostanie zapisana w bazie danych witryny, ale nie zostanie opublikowana, więc użytkownicy przeglądający witrynę jej nie zobaczą,
• zapisać i opublikować – strona zostanie zapisana oraz opublikowana dla użytkowników przeglądających witrynę,
• podejrzeć – ta opcja pozwala zobaczyć, jak się prezentuje nowa strona wraz z treścią.

Po opublikowaniu nowej strony nasi użytkownicy zobaczą efekt końcowy przedstawiony na rysunku 14:

Rys.14. Publikacja nowej strony zawartości.

W analogiczny sposób można utworzyć podstronę typu „Textpage”, zawierającą informację o autorze strony. Panel administratora wyraźnie wskazuje, które strony są opublikowane, a które jeszcze nie. Strony nieopublikowane są oznaczone gwiazdką (np. strona Autor na rysunku 15):

Rys.15. Strony publiczne i niepubliczne.

Po opublikowaniu podstrony „Autor”, zestaw startowy starter kit „Simple” wraz ze skórką „Designit Green” wyświetli automatycznie nową w menu nawigacyjnym witryny (rys. 16).

Rys.16. Nowa strona: Autor.

Pozycjonowanie strony w menu witryny

Kiedy dodajemy nową podstronę, jest ona domyślnie ustawiana na końcu. Aby zmienić kolejność stron, należy przejść do sekcji „Content”, a następnie prawym klawiszem myszy na stronie nadrzędniej w stosunku do stron, których kolejność chcemy zmienić, i wybrać opcję „Sort”. W przykładzie na rysunku 17 znajduje się przykład sortowania stron „Autor”, „Mapa” oraz „Sprzęt”.

Rys.17. Sortowanie.

Po wybraniu opcji sortowania otworzy się okno dialogowe, gdzie za pomocą metody „Drag & Drop” można przekładać strony, zmieniając ich kolejność (rys. 18).

Rys.18. Zmienianie kolejności stron.

Podsumowanie

W tym artykule poznaliśmy dokładniej, czym są typy dokumenów, w jaki sposób tworzyć nowe strony z zawartością oraz jak zmieniać kolejność wyświetlania stron w menu nawigacyjnym witryny.

W kolejnym artykule omówię, jak lokalizować naszą witrynę.

 

 

---