Tworzenie niestandardowego nagłówka i stopki strony aplikacji
Nagłówek i stopka to niezbędne elementy strony WWW, ale także obszar, gdzie powinny znaleźć się podstawowe informacje.
Nagłówek strony zwykle zawiera logo, menu oraz informacje o zalogowanym użytkowniku. Stopka to dolny blok strony internetowej, która może zawierać łącza do stron lub zasobów zewnętrznych, odniesienia i informacje o prawach autorskich, środowisku, wersji, informacje kontaktowe oraz informacje o subskrypcji i inne.
Zarówno nagłówek jak i stopka projektowane są w oknie designera, który jest analogiczny jak dla formularza z wyłączeniem możliwości dodawania akcji. Zestaw kontrolek oraz właściwości możliwe do zmiany, także został ograniczony i dostosowany do typu elementu jaki modyfikujesz czyli nagłówek lub stopka.
Jeżeli nie dodasz własnego nagłówka lub stopki na stronie www będzie wyświetlany domyślny nagłówek i stopka, które są zdefiniowane w platformie.
Nagłówek strony
- Aby stworzyć własny nagłówek wybierz opcję w oknie głównym wybierz Nowy, lub Plik>Nowy lub ikonę Nowy element.
- Wybierz Nagłówek strony.
Podczas tworzenia nagłówka strony masz do dyspozycji tylko te komponenty, które mogą być przydatne podczas projektowania. Są to analogiczne kontrolki jak te, które dostępne są podczas tworzenia formularza:
- Etykieta - Komponent służy do wyświetlania tekstu, patrz: Etykieta
- Obrazek - Użytkownik może dodać do formularza obrazek/logo, patrz: Obrazek
- Kontrolka html - Kontrolka umożliwia wyświetlenie wprowadzonych znaczników html, patrz: Kontrolka html
- Kontener - Kontener to podstawowy komponent, służący do grupowania wybranych elementów, patrz: Kontener
- Kontener (flow) - Pozwala na dodawanie elementów „obok siebie”, patrz: Kontener (flow)
Komponenty dostępne tylko dla nagłówka strony:
- Menu aplikacji - komponent umożliwia wyświetlenie w danym miejscu menu aplikacji, które jest ustawione jako domyślne dla systemu.
- Info o użytkowniku i wyloguj - komponent prezentuje dane zalogowanego użytkownika wraz z opcją wylogowania z systemu.
W poniższym przykładzie do zdefiniowania nagłówka zastosowano najpierw wyświetlenie menu aplikacji, następnie kontrolkę Etykieta do wprowadzenia nazwy aplikacji, kolejno Obraz do wyświetlenia loga oraz informacje o użytkowniku.
Stopka strony
- Aby stworzyć własną stopkę wybierz opcję w oknie głównym wybierz Nowy, lub Plik>Nowy lub ikonę Nowy element.
- Wybierz Stopka strony.
Podczas tworzenia nagłówka strony masz do dyspozycji tylko te komponenty, które mogą być przydatne podczas projektowania. Są to analogiczne kontrolki jak te, które dostępne są podczas tworzenia formularza:
- Etykieta - Komponent służy do wyświetlania tekstu, patrz: Etykieta
- Obrazek - Użytkownik może dodać do formularza obrazek/logo, patrz: Obrazek
- Kontrolka html - Kontrolka umożliwia wyświetlenie wprowadzonych znaczników html, patrz: Kontrolka html
- Kontener - Kontener to podstawowy komponent, służący do grupowania wybranych elementów, patrz: Kontener
- Kontener (flow) - Pozwala na dodawanie elementów „obok siebie”, patrz: Kontener (flow)
Zarówno w przypadku nagłówka jak i stopki dobrą praktyką jest umieszczanie elementów w zwykłym kontenerze lub w kontenerze flow, który pozwala na wyświetlenie obiektów obok siebie. Poprzez dodatkowe style można ustawić odpowiednie marginesy odstępy itp.
W poniższym przykładzie do zdefiniowania stopki zastosowano etykietę do wpisania nazwy aplikacji, następnie Obraz do zastosowania ikony i etykietę do wprowadzenia adresu email do kontaktu. W prawym rogu Kontrolka html, przenosi na stronę www.
Zarówno dla stopki jak i nagłówka udostępnione zostało dodatkowe drzewo danych, które poprzez wyrażenie umożliwia wyświetlenie takich informacji jak login użytkownika, rolę oraz informacje o środowisku.
- Dodaj etykietę i wybierz sposób określenia jako wyrażenie.
- Przejdź do definiowania wyrażenia i z drzewka Web wybierz informację, którą chcesz wyświetlić.
Użycie nagłówka i stopki w aplikacji
- Aby użyć własnego nagłówka i stopki w aplikacji web, przejdź na serwer wersji i kliknij prawym na utworzony nagłówek/stopkę.
- Z menu kontekstowego wybierz opcję Użyj w aplikacji web.
- Od tej pory na każdej stronie w aplikacji będą wyświetlane nagłówek i stopka, które zdefiniowałeś.
- Jeżeli chcesz powrócić do ustawień domyślnych, przejdź na serwer wersji i kliknij prawym na utworzony nagłówek/stopkę.
- Z menu kontekstowego wybierz opcję Nie używaj w aplikacji web.
Dobre praktyki
- Możesz w dowolnej kolejności ustawiać dostępne komponenty do tworzenia nagłówka i stopki.
- Aby elementy były wyświetlane obok siebie wykorzystaj kontener flow.
- Możesz użyć kontener w kontenerze w zależności od tego jaki efekt chcesz uzyskać.
- Kontrolka Obraz umożliwia dodanie obrazu/ikony. Na panelu Właściwości możesz wprowadzić adres url, wówczas obrazek działa jak link z możliwością nawigacji pod wskazany adres.