POLITECHNIKA RZESZOWSKA IM. IGNACEGO ŁUKASIEWICZA WYDZIAŁ BUDOWY MASZYN I LOTNICTWA ZAKŁAD INFORMATYKI BIZNES ELEKTRONICZNY Laboratorium 3.

Transkrypt

1 Strona 1 z 28 Planowanie nawigacji i tworzenie danych kontaktowych 1. Sekcje i kategorie przypisywanie artykułów 2. Tworzenie modułu dla menu 3. Zmiana pozycji modułu 4. Moduły: Ścieżka powrotu, Szukaj, Logowanie (rejestracja) 5. Zadania do wykonania Stan budowy serwisu: zdefiniowana struktura serwisu CafeLovers, utworzona mapa witryny CafeLovers, dodane grafiki dostarczone przez zleceniodawcę, utworzone artykuły: Powitanie, O firmie, Przepisy na kawę, Przepisy na kawę z alkoholem, Rodzaje kawy, Ziarna kawowe, Historia kawy, Gatunki kawy, Dawka śmiertelna kawy, Hiperłącza oraz Linki do plików wideo o kawie artykuły posiadają odpowiednią strukturę, są sformatowane i zawierają odpowiednie grafiki, stworzona kopia bezpieczeństwa serwisu. Czas pozostały do zakończenia projektu: 3 miesiące Ad 1. Sekcje i kategorie pozwalają na organizowanie artykułów. Każda sekcja zawiera jedną lub więcej kategorii, natomiast każda kategoria zawiera przypisane do niej artykuły. Oczywiście artykuły można przypisywać na witrynie bez stosowania sekcji i kategorii, ale warto stosować sekcje i kategorie z dwóch zasadniczych powodów: sposób prezentacji artykułów artykuły mogą być prezentowane w systemie Joomna pięć sposobów: wyświetlenie całego artykułu, przegląd artykułów w sekcji, lista kategorii artykułów w sekcji, przegląd artykułów w kategorii i lista artykułów w la! kategorii. Sposoby te wykorzystywane są podczas procesu tworzenia modułów menu, ułatwienie procesu porządkowania artykułów na zapleczu podział artykułów na sekcje i kategorie ułatwia zarządzanie artykułami. Analizując stworzoną mapę witryny projektant strony zdecydował o utworzeniu siedmiu sekcji: Szukaj, Rejestracja, Zaloguj/wyloguj, Kontakt, Warto wiedzieć, Pyszne przepisy, Więcej o kawie. Do każdej sekcji z wyjątkiem Warto wiedzieć i Pyszne przepisy zostanie utworzona jedna kategoria o nazwie Treść podstawowa. Do sekcji Warto wiedzieć zostaną utworzone (wstępnie) dwie kategorie:

2 Strona 2 z 28 Historia i Gatunki kawy, do sekcji Pyszne przepisy zostaną utworzone dwie kategorie: Kawy klasyczne i Kawy z alkoholem. W celu utworzenia ww. sekcji należy zalogować się na zaplecze i wybrać opcję Sekcje arty- kułów z menu Artykuły. System zaprezentuje okno edytora sekcji rysunek 1. Rysunek 1. Obsługa menedżera sekcji jest analogiczna jak menedżera artykułów, więc jego szczegółowy opis zostanie pominięty. Widoczne w oknie trzy sekcje przykładowe należy usunąć, gdyż nie będą one wykorzystywane. Wcześniej jednak należy wejść do menedżera kategorii i usunąć wszystkie przykładowe kategorie, gdyż póki są one przypisane do sekcji, którą chce się usu- nąć system nie pozwoli wykonać tej operacji menedżer kategorii znajduje się również w menu Artykuły. Jeżeli podczas usuwania kategorii wystąpi błąd, należy usunąć wszystkie artykuły przypisane do usuwanej kategorii uwaga: usunąć należy również artykuły znajdu- jące się w koszu. Ostatecznie po usunięciu zbędnych artykułów, kategorii i sekcji należy zde- finiować nowe sekcje poprzez kliknięcie przycisku Utwórz. System wyświetli okno przedstawione na rysunku 2. Rysunek 2.

3 Strona 3 z 28 Opis podstawowych pól menedżera sekcji przedstawiono w tabeli 1. Tabela 1. Opcja Opis Tytuł Określa tytuł tworzonej sekcji Tytuł zastępczy Należy wpisać ciąg znaków identyczny jak dla opcji Tytuł bez stosowania polskich znaków, stosując wyłącznie małe litery i zamieniając znaki spacji na znaki podkreślenia _ Opublikowane Opcja decyduje, czy dana sekcja ma się pojawić w tworzonym serwisie Poziom dostępu Opcja określa, jaka grupa użytkowników może mieć dostęp do danej sekcji i jej artykułów Grafika Umożliwia dodanie grafiki towarzyszącej sekcji, pliki graficzne sekcji znajstories dują się (domyślnie) w katalogu: cafelovers/images/stories Położenie grafik Określa położenie dodanej grafiki Pod opcjami znajduje się panel tekstowy identyczny jak w menedżerze scenariuszy. Panel ten umożliwia wpisanie informacji dotyczących sekcji. W celu ułatwienia pracy z grafikami domyślne katalogi z mediami i grafikami można zmienić w Konfiguracji w menu Witryna, zakładka System Media. Zmiana katalogów domyślnych na images/kawa znacząco przyspieszy i usprawni proces zarządzania mediami i grafikami. Szczególnie odczuwalne bę- dzie to podczas procesu reedycji artykułów, sekcji i kategorii. Po zakończeniu procesu edycji sekcji okno menedżera sekcji powinno wyglądać tak, jak przedstawiono to na rysunku 3. Rysunek 3. Analogiczne czynności należy wykonać dla kategorii, tworząc wymagane kategorie i przypisu- jąc je do odpowiednich sekcji. Okno menedżera kategorii po zakończeniu procesu edycji za- prezentowano na rysunku 4.

4 Strona 4 z 28 Ostatni krok to przypisanie poszczególnych artykułów do odpowiednich kategorii. W tym celu należy otworzyć menedżer artykułów i poddać każdy stworzony artykuł edycji przypisując go do odpowiedniej kategorii. Podczas przypisywania artykułów do stworzonych sekcji i kategorii okazało się, że artykuły o nazwach: Powitanie, Ziarno, Dawka i Rodzaje kanie zostały przypisane do żadnej sekcji i kategorii, gdyż nie zostały uwzględnione na mapie witryny. Problem ten trzeba natychmiast skorygować poprzez modyfikację mapy witryny i stworzenie odpowiednich sekcji i kategorii lub wykorzystanie istniejących. Projektant zdecydował o dodaniu trzech kategorii w sekcji Warto wiedzieć : Ciekawostki, Ziarno wy i Rodzaje kawy fragment zaktualizowanej mapy witryny przedstawiono na rysunku 5. Dla artykułu powitanie utworzono sekcję Strona główna i kategorię Treść podstawowa. Spis wszystkich artykułów z podaniem sekcji i kategorii do których zostały przypisane przedstawiono w tabeli 2. Tabela 2. Tytuł artykułu Dawka Filmiki Gatunki kawy Hiperłącza Historia O firmie Powitanie Przepisy Przepisy z alkoholem Rodzaje kawy Ziarno Rysunek 4. Sekcja Kategoria Plik źródłowy Warto wiedzieć Ciekawostki dawka.txt Więcej o kawie Treść podstawowa film.txt Warto wiedzieć Gatunki kawy gatunki kawy.txt Więcej o kawie Treść podstawowa hiperlacza.txt Warto wiedzieć Historia historia.txt Kontakt Treść podstawowa misja.txt Strona główna Treść podstawowa powitanie.txt Pyszne przepisy Kawy klasyczne przepisy.txt Pyszne przepisy Kawy z alkoholem przepisy_alkohol.txt Warto wiedzieć Rodzaje kawy rodzaje.txt Warto wiedzieć Ziarno ziarno.txt

5 Strona 5 z 28 Rysunek 5. Ad 2. Tworzenie modułu dla menu Chcąc rozpocząć pozycjonowanie treści na stronie należy pamiętać, że układ jest zdefiniowa- ny w szablonie. W każdym szablonie wyznaczane są trzy obszary: obszar na zawartość główną, obszary (zwane pozycjami) dla umieszczania modułów, obszary na inne ne elementy np. stopka, nagłówek. Na rysunku 6. przedstawiono schemat ideowy strony wykonanej w systemie Joomla! Wi- dać wyraźnie, że to moduły budują strukturę całej witryny. Oczywiście ich rozmieszczenie jest zależne od używanego szablonu i od projektanta sposób zmiany rozmieszczenia danego modułu zostanie przedstawiony na przykładzie menu głównego w rozdziale 3. Analizując dostarczony przez zleceniodawcę prototyp interfejsu można stwierdzić, że potrzebne będzie kilka modułu m.in. menu główne, logo i nazwa firmy w nagłówku strony, menu lokalne, mo- duł rejestracji, moduł newsletter, moduł sondy. W pierwszej kolejności zostanie stworzony moduł dla menu głównego widocznego po lewej stronie prototypu interfejsu. W celu modywybrać opcję Main Menu fikacji istniejącego menu głównego w systemie Joomla! należy * z menu Menu, alternatywnie można uruchomić opcję Projektant menu z menu Me- nu.

6 Strona 6 z 28 Uwaga: nie należy zmieniać nazwy ani usuwać menu głównego ( Main menu) oraz menu użytkownika ( User menu ) spowoduje to błąd w działaniu systemu Joomla. Wymienione dwa menu można tylko edytować. Pozostałe rodzaje menu można dowolnie edytować, do- dawać i usuwać. Ponieważ otwarte menu główne zawiera przykładowe pozycje, wszystkie pozycje poza pozycją oznaczoną symbolem domyślnie, należy usunąć. Pozycję oznaczoną symbolem gwiazdki (symbol elementu domyślnego) należy zmodyfikować poprzez kliknięcie nazwy pozycji menu. System wyświetli okno właściwości pozycji przedstawione na rysunku 7. Opis podstawowych pozycji przedstawiono w tabeli 3. Tabela 3. Rysunek 6. Pozycja Opis ID Numer automatyczny pozycji nadawany przez system Joomla Tytuł Tytuł pozycji w menu Alias Nazwa skrócona używana w wypadku używania adresów prostych Łącze Generowany adres URL do odpowiedniej pozycji menu Pokaż w menu Wybór menu w których pozycja ma zostać wyświetlona Nadrzędna pozycja Opcja umożliwia zbudowanie hierarchii pozycji w tworzonym menu Opublikowane Opcja określa, czy pozycja jest opublikowana (widoczna) Kolejność Określa kolejność pozycji w menu Poziom dostępu Określa jacy użytkownicy mogą mieć dostęp do danej opcji Otwórz w Określa sposób działania opcji Pozostałe opcje dostępne w zakładkach parametry podstawowe, rozszerzone, komponentu i systemu są opisane w pomocy, dostępnej poprzez najechanie kursorem myszy na żądaną opcję, więc ich opis zostanie w materiałach pominięty.

7 Strona 7 z 28 Rysunek 7. Po nadanie i zapisaniu parametrów dla pozycji Strona startowa należy stworzyć pierwszy odnośnik o nazwie Warto wiedzieć. W tym celu należy kliknąć przycisk Utwórz i z listy dostępnych typów wybrać Łącza wewnętrzne Artykuły Przegląd Artykuły w sekcji. Okno opcji i parametrów należy ustawić tak, jak przedstawiono to na rysunku 7.

8 Strona 8 z 28 Rysunek 8. Po odpowiednim ustawieniu opcji można uzyskać menu takie jak przedstawiono na rysunku 8. Rysunek 9. Dodając kolejne pozycje menu i odpowiednio wybierając ich typ i parametry można skonstruować całe menu, które odpowiada wymaganiom klienta (zgodnie z prototypem interfejsu). Ponieważ stworzone do tej pory menu nie działa tak, jak powinno (opcje podmenu są widoczne dopiero po kliknięciu opcji głównej) edycji należy poddać moduł, który tworzy menu główne i operacja ta zostanie przedstawiona w punkcie 3. Ad 3. W celu zmiany pozycji modułu i zmiany jego zachowania należy skorzystać z opcji Moduły w menu Rozszerzenia. Z listy modułów należy wybrać moduł, który chce się pozycjonować, klikając na jego nazwę. System wyświetli okno zarządzania tym modułem dla modułu menu głównego (Main Menu) ) system wyświetli okno takie, jak przedstawiono na rysunku 10. W celu zmiany pozycji modułu należy zmienić opcję Pozycja na odpowiadającą projektanzmiany tytułu tworzonego menu, z czego należy skorzystać. W celu wyłączenia opcji ukrywania artykułów dla nieaktywnej sekcji należy opcję Pod- rzędne zawsze ustawić na Tak. W sposób analogiczny można zmieniać ustawienia innych modułów w zależności od potrzeb klienta i decyzji projektanta. Gotowe menu główne dla serwisu CafeLovers przedstawiono na rysunku towi. Dodatkowo istnieje możliwość 11.

9 Strona 9 z 28 Rysunek 10. Rysunek 11. Ad 4. Moduł ścieżki powrotu to moduł usprawniający nawigację po tworzonym serwisie internetowym. Ponieważ tworzony serwis internetowy jest bazowany na przykładowym projekcie systemu Joomla!, moduł ścieżki powrotu jest już dodany do projektu. W celu jego usunięcia należy uruchomić opcję Moduły z menu Rozszerzenia, a następnie na liście modułów znaleźć i zaznaczyć moduł Breadcrumbs. Po jego usunięciu należy dodać nowy moduł za pomocą przycisku Nowy i z zaprezentowanej listy rysunek 12. wybrać Ścieżka powrotu. Po wybraniu odpowiedniego modułu należy kliknąć przycisk Dalej. Następnie system wyświetli znane już okno zmiany ustawień danego modułu. Zadaniem projektanta jest nazwanie modułu np. Ścieżka powrotu oraz ukrycie jego tytułu (opcja Pokaż tytuł na Nie ).

10 Strona 10 z 28 Dodatkowo pozycję modułu należy ustawić na: breadcrumb. W polach zatytułowanych Przypisanie menu projektant może zdefiniować przy korzystaniu z których menu ścieżka powrotu będzie wyświetlana. W tworzonym serwisie jest stworzone na razie tylko jedno menu główne, więc z listy należy wybrać wszystkie jego pozycje. Pozostałe pozycje należy odznaczyć. Po ustawieniu wszystkich opcji należy zapisać zmiany i sprawdzić, czy podczas przenoszenia się pomiędzy artykułami korzystając z menu głównego, moduł ścieżki powrotu będzie działał prawidłowo. Rysunek 12. Rysunek 13. Szukaj moduł wyświetla pole wyszukiwarki. Podobnie jak w wypadku modułu Ścieżka powrotu moduł jest już obecny w przykładowym serwisie internetowym. Należy go więc usunąć (tytuł modułu: Search ). Następnie należy dodać moduł opcją Nowy, z listy modułów należy wybrać moduł Szukaj rysunek 14. Po kliknięciu przycisku Dalej należy ustawić opcje w sposób następujący:

11 Strona 11 z 28 Tytuł : Przeszukaj kafeterię..., Pokaż tytuł : Tak Pozycja : top Przypisanie menu : Zaznaczone na liście:, zaznaczyć należy wszystkie pozycje menu głównego (mainmenu), Tekst w polu : Wpisz czego szukasz Przycisk szukaj : Tak Pozycja przycisku : Dolne Po ustawieniu opcji należy zapisać zmiany i przeładować stronę serwisu, aby sprawdzić, czy wyszukiwarka została dodana i czy działa poprawnie. Rysunek 14. Docelowo wyszukiwarka powinna zostać umieszczona na specjalnej stronie, tak jak zostało to przedstawione na prototypie interfejsu, co wymaga utworzenia nowego menu lub wyko- rzystania któregoś z przykładowych i dostępnych w systemie. Rejestracja moduł umożliwia użytkownikom rejestrowanie się w serwisie, dzięki czemu będą mogli oni logować się w serwisie i uzyskiwać dostęp do treści i materiałów dostępnych po zalogowaniu się. Porównując stworzony do tej pory serwis z prototypem interfejsu można dojść do wniosku, że przykładowy serwis, który przeradza się w serwis CafeLovers, zawiera przykładowo menu: Resources, Key Concepts oraz moduł logowania. Wymienionych elementów nie ma w prototypie interfejsu, więc należy je usunąć, w celu zrobienia miejsca na dodawane i wymagane funkcjonalności. Korzystając z projektanta menu, należy usunąć wymienione dwa menu ( Resources i Key Concepts ), korzystając z menedżera modułów należy usunąć moduł logowania ( Login form ). Dodatkowo można usunąć też moduły widoczne ponad artykułem Powitanie : Popular i Latest news oraz moduły widoczne po prawej stronie: Pools, Who s online, Advertisment. Po usunięciu wszystkich zbędnych elementów strona powinna wyglądać tak jak na rysunku 15., czyli przypominać z grubsza prototyp interfejsu. Oczywiście konieczne będzie jeszcze poprawienie struktury witryny np.

12 Strona 12 z 28 przeniesienie wyszukiwarki do strony Szukaj widocznej w menu górnym na prototypie interfejsu itp. Ponieważ struktura strony została już poprawiona można dodać moduł rejestracji użytkowników i umieścić go pod menu głównym. Wbudowany mechanizm rejestracji w Joomli! standardowo dostępny jest w module formularza logowania. Takie rozwiązanie nie jest stricte tym, czego życzył sobie klient, ale można spróbować je zaimplementować i poddać ocenie klienta. Jeśli zleceniodawcy rozwiązanie się nie spodoba, formularz logowania będzie można bez żadnego problemu usunąć i wykorzystać niestandardowy moduł rejestrowania np. Alpha Registration ( security/authentication/7727). Rysunek 15. Moduł logowania użytkownika należy dodać wykorzystując menedżer modułów. Z listy pre- zentowanych modułów należy wybrać moduł o nazwie Logowanie rysunek 16. i nadać mu odpowiedni tytuł np. logowanie.

13 Strona 13 z 28 Rysunek 16. Pozostałe opcje można zostawić z wartościami domyślnymi lub pozmieniać je według uzna- nia. Gotowe pole logowania przedstawiono na rysunku 17. Rysunek 17. System automatycznie wygenerował mechanizmy umożliwiające: zapamiętanie hasła (pole Zapamiętaj ), przypomnienie zapomnianego hasła i nazwy użytkownika (linki Nie pamię- tasz hasła? i Nie pamiętasz nazwy? ) poprzez wysłanie ich na adres , rejestrację użytkownika w serwisie ( Załóż swoje konto! ). Wybranie ostatniej przedstawionej opcji powoduje otwarcie strony z formularzem rejestracji, dzięki której użytkownik może założyć swoje konto w serwisie. Opcje sterujące procesem rejestracji można zdefiniować poprzez uruchomienie konfiguracji witryny (opcja Konfiguracja w menu Witryna ) zakładka System. Część odpowiedzialna za ustawienia rejestracji użytkowników została przedstawiona na rysunku 18. Rysunek 18.

14 Strona 14 z 28 Znaczenie poszczególnych opcji przedstawiono w tabeli 4. Tabela 4. Opcja Opis Rejestruj nowych włącza i wyłącza mechanizm rejestracji użytkowników, wyłączenie opcji skutkuje ukryciem linku Załóż swoje konto! Przypisz do grupy opcja określa do jakiej grupy będą przypisywani zarejestrowani użytwłączenie opcji powoduje automatyczne wysłanie maila pod adres kownicy Automatyczna aktywacja wskazany przez użytkownika z prośbą o aktywację konta Własne ustawie- zezwala zarejestrowanym użytkownikom zmianę podstawowych ustania wień konta Dzięki mechanizmowi rejestracji projektant serwisu może decydować, które treści mają być widoczne dla wszystkich, a które tylko dla zarejestrowanych użytkowników. Przykład strony powitalnej dla zarejestrowanego użytkownika może wyglądać tak jak na rysunku 19. Na stronie tej dodano dodatkowy moduł informujący o zalogowanych w serwisie użytkownikach oraz gościach przeglądających serwis. Moduł ten nosi nazwę Gościmy. Rysunek 19.

15 Strona 15 z 28 Ad 5. Zadania ania do samodzielnego wykonania a) rozbudować projekt serwisu CafeLovers poprzez: przypisanie wszystkich opracowanych artykułów do odpowiednich sekcji i kaścieżki powrotu, wy- szukiwania i logowania, tegorii, dodanie i pozycjonowanie modułów: menu głównego, b) analogiczne czynności wykonać dla własnego serwisu internetowego, c) stworzyć kopię bezpieczeństwa serwisu CafeLovers i własnego tworzonego serwisu po zaimplementowaniu wymienionych w punkcie a) funkcjonalności, d) obie kopie bezpieczeństwa zabrać na zajęcia w celu przedstawienia postępu w pra- cach projektowych.