Jak skonfigurować menu stopki w Publii CMS i dodać informacje do stopki

W systemie zarządzania treścią Publii, panel menu znajduje się w głównym menu po lewej stronie aplikacji. Obecnie w liście menu znajduje się jedno menu. Aby dodać nowe menu, kliknij przycisk „Dodaj nowe menu” w prawym górnym rogu panelu menu. Po kliknięciu wyświetli się okno dialogowe, w którym należy nadać nazwę nowemu menu, jak pokazano na Rysunku 11-36. Nazwij je „Stopka”.

Po kliknięciu przycisku „Utwórz nowe menu”, otworzy się menu o nazwie „Stopka”. Na początku menu to nie zawiera żadnych przypisanych elementów. Aby dodać elementy do menu, kliknij przycisk „Dodaj element menu”. Następnie dodaj następujące pozycje menu:

• Element menu 1: Etykieta: Strona główna, Typ: Link do strony głównej

• Element menu 2: Etykieta: Warunki użytkowania, Typ: Link do strony, Strona: Warunki użytkowania

• Element menu 3: Etykieta: Polityka cookies, Typ: Link zewnętrzny, URL zewnętrzny: #

• Element menu 4: Etykieta: Kontakt, Typ: Link zewnętrzny, URL zewnętrzny: #

Po zakończeniu konfiguracji menu stopka powinno wyglądać jak na Rysunku 11-37.

Aby przypisać menu do odpowiedniej lokalizacji, kliknij link „Nieprzypisane” poniżej etykiety „Przypisane menu” dla menu Stopka, jak pokazano na Rysunku 11-38. Następnie włącz lokalizację menu stopki, przesuwając przełącznik na prawo, jak pokazano na Rysunku 11-39. Przełącznik zmieni kolor na niebieski, co oznacza, że jest aktywowany. Na końcu kliknij niebieski przycisk „Zapisz zmiany”, aby zapisać ustawienia. Po podglądzie strony menu stopki będzie wyglądać jak na Rysunku 11-40.

Po skonfigurowaniu menu stopki, przejdź do menu „Główne” i usuń element menu „Warunki użytkowania”, ponieważ teraz znajduje się on w stopce, jak pokazano na Rysunku 11-41.

SpaceB Technologies | 2345 Any St., Any Town USA | (456)-555-5555
Projekt strony wykonany wewnętrznie | Zasilane przez Publii
Prawa autorskie 2024 – Wszelkie prawa zastrzeżone

Po wprowadzeniu tych danych, sformatuj je tak, jak pokazano na Rysunku 11-42, używając tzw. miękkich przerw linii, które uzyskuje się, naciskając klawisz SHIFT i ENTER jednocześnie. Dzięki temu tekst będzie bardziej zwarty, bez nadmiernych odstępów między liniami. Zapisz zmiany i sprawdź, jak wygląda nowa stopka na stronie.

Ważne informacje dodatkowe

W kontekście tworzenia i konfigurowania stopki na stronie internetowej, warto pamiętać o kilku aspektach, które mogą mieć wpływ na funkcjonalność i estetykę. Przede wszystkim, podczas dodawania linków do menu stopki, należy zadbać, aby były one dobrze zorganizowane i logicznie powiązane z zawartością strony. Stopka powinna pełnić rolę pomocniczą i informacyjną, oferując łatwy dostęp do ważnych stron lub sekcji, takich jak polityki prywatności, regulaminy, dane kontaktowe czy informacje o firmie.

Dodatkowo, dobrze jest regularnie aktualizować informacje w stopce, szczególnie w przypadku zmiany danych kontaktowych, polityki cookies lub praw autorskich. Stopka jest jednym z najbardziej widocznych elementów na stronie, dlatego jej zawartość musi być precyzyjna i aktualna. Warto także pomyśleć o jej responsywności, aby dobrze wyglądała na urządzeniach mobilnych, ponieważ coraz więcej użytkowników korzysta ze stron internetowych na smartfonach i tabletach.

Dodatkowe informacje o firmie, jak np. adres, numer telefonu, czy inne dane kontaktowe, powinny być zgodne z przepisami prawnymi dotyczącymi działalności gospodarczej w danym kraju, co zapewni pełną zgodność z obowiązującymi normami i przepisami.

Jak dodać stronę FAQ do swojej witryny i stylizować ją przy pomocy CSS?

Aby dodać stronę FAQ, musimy przejść przez kilka prostych kroków, korzystając z edytora WYSIWYG, którego używamy w tym podręczniku. Przypomnijmy sobie najpierw procedurę tworzenia strony w edytorze WYSIWYG, którą omawialiśmy w rozdziale 6. Oto kolejne kroki:

Pierwszym zadaniem jest utworzenie nowej strony za pomocą edytora WYSIWYG. Po jej utworzeniu, nadajemy jej tytuł – w moim przypadku nazwałem ją „FAQ”. Następnie klikamy w treść strony, a w pasku narzędzi wybieramy ikonę "Źródło HTML" (z oznaczeniem "<> HTML"). Otwieramy plik „faq.html.txt” w edytorze tekstu, takim jak Notepad. Kopiujemy całą zawartość tego pliku, a następnie wklejamy ją do edytora WYSIWYG.

Po zakończeniu wklejania kodu, klikamy przycisk „Zastosuj zmiany”, który znajduje się w prawym górnym rogu edytora kodu. Na koniec zapisujemy i zamykamy edytor WYSIWYG. Strona FAQ powinna wyglądać podobnie do przykładu, który prezentowany jest na rysunku 15-3 w książce.

Właściwy kod HTML, który należy wprowadzić do edytora HTML, jest zawarty w pliku, który udostępniamy w ramach tego rozdziału. Zawartość tego kodu pozwoli na prawidłowe wyświetlanie najczęściej zadawanych pytań. Oto przykładowe pytania, które znajdą się na stronie FAQ:

1. Co to jest SpaceB?
   SpaceB to fikcyjna firma zajmująca się rakietami, inspirowana SpaceX, skoncentrowana na badaniach kosmicznych i innowacjach.

2. Jak mogę wziąć udział w misjach SpaceB?
   Możesz śledzić nasze aktualności, uczestniczyć w wydarzeniach lub dołączyć do naszego zespołu, jeśli będą dostępne odpowiednie oferty.

3. Gdzie znajduje się siedziba SpaceB?
   SpaceB ma swoją siedzibę w Kentucky, ale działa na całym świecie.

4. Jakie rakiety rozwija SpaceB?
   SpaceB opracowuje rakiety, które noszą nazwy różnych gatunków żółwi, takie jak Terrapin i Snapper, przeznaczone do misji załogowych i towarowych na Księżyc i poza niego.

5. Jaka jest misja SpaceB?
   Celem SpaceB jest zrewolucjonizowanie podróży kosmicznych, czyniąc je bardziej dostępnymi i zrównoważonymi, z naciskiem na eksplorację Księżyca, rozmieszczanie satelitów oraz przyszłe misje na Marsa.

6. Czy SpaceB współpracuje z innymi organizacjami?
   Tak, SpaceB współpracuje z różnymi agencjami kosmicznymi, instytutami badawczymi i prywatnymi firmami, aby rozwijać technologię kosmiczną i promować międzynarodową współpracę w zakresie badań kosmosu.

Po zakończeniu pracy nad stroną FAQ należy dodać odpowiednią stylizację CSS, aby zapewnić estetyczny wygląd sekcji pytań i odpowiedzi. W tym celu przechodzimy do narzędzia „Custom CSS” w panelu CMS Publii. Otwieramy edytor CSS i wklejamy tam odpowiedni kod, który znajduje się w pliku „faq.css.txt”. Po zapisaniu zmian, strona FAQ powinna nabrać odpowiedniego wyglądu – każdy element będzie dobrze widoczny, z wyraźnymi odstępami i wyraźnymi nagłówkami pytań.

Poniżej znajduje się kod CSS, który powinien zostać wklejony do edytora:

css
Copy code
/* FAQ */

.faq-list {
   max-width: 600px;
   margin: 0 auto;
   padding: 10px;
   background-color: white;
   border-radius: 5px;
   box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
details {
   margin-bottom: 10px;
   border: 1px solid #ddd;
   border-radius: 4px;
}
summary {
   cursor: pointer;
   padding: 10px;
   font-weight: bold;
   background-color: #f7f7f7;
   border-bottom: 1px solid #ddd;
}
details > p {
   margin: 0;
   padding: 10px !important;
   background-color: #fff;
   line-height: normal;
}
details[open] summary {
   background-color: #e7e7e7;
}

Po zapisaniu zmian, należy pamiętać, aby ponownie sprawdzić, jak wygląda strona FAQ w trybie podglądu, klikając „Podgląd zmian” w menu głównym CMS Publii. Można wtedy zobaczyć, jak strona wygląda w przeglądarce internetowej.

Zanim przejdziemy do linkowania strony FAQ, warto zwrócić uwagę, że często sama strona FAQ jest jeszcze stroną „sierotą” w witrynie, ponieważ nie jest powiązana z żadną inną stroną. W takim przypadku konieczne będzie dodanie linku do tej strony z innych sekcji witryny, np. ze strony głównej. W tym celu otwieramy stronę główną w edytorze, lokalizujemy link do FAQ i edytujemy go, wybierając jako docelową stronę „FAQ”. Po zapisaniu zmian, strona FAQ powinna być łatwo dostępna dla użytkowników.

Ważnym aspektem jest także odpowiednia stylizacja linków. Przykładowo, linki mogą zostać stylizowane w taki sposób, by wyglądały jak przyciski „Call to Action”, czyli zachęcające do kliknięcia. W tym celu trzeba dodać odpowiedni kod CSS, który zamieni tradycyjne linki w przyciski, co zwiększy ich widoczność i atrakcyjność dla odwiedzających witrynę.

Tworzenie i stylizacja strony FAQ to tylko początek pracy nad witryną. Oprócz samego kodowania i stylizacji, ważne jest, aby regularnie aktualizować treści na stronie, uwzględniając pytania, które mogą pojawiać się wraz z rozwojem produktu lub usługi. Warto również dbać o to, aby FAQ było łatwe do znalezienia i intuicyjne w nawigacji, ponieważ odpowiedzi na najczęściej zadawane pytania mogą znacznie ułatwić użytkownikom życie i poprawić ich doświadczenia związane z korzystaniem z witryny.