1. Wstęp

Dokumentacja dotyczy strony internetowej firmy Selectivv Poland opartej na systemie zarządzania treścią Wordpress, oddanej do użytku i przerzuconej na serwer klienta w Czerwcu 2018 roku.

2. System zarządzania treścią

System zarządzania treścią (ang. Content Management System, CMS) to oprogramowanie pozwalające na łatwe utworzenie serwisu WWW oraz jego późniejszą aktualizację i rozbudowę przez redakcyjny personel nietechniczny.

Kształtowanie treści i sposobu ich prezentacji w serwisie internetowym zarządzanym przez CMS odbywa się za pomocą prostych w obsłudze interfejsów użytkownika, zazwyczaj w postaci stron WWW zawierających rozbudowane formularze i moduły.

2.1 Wordpress

Wykorzystany w tym projekcie WordPress to napisany w języku PHP system zarządzania treścią zaprojektowany głównie do obsługi blogów.

Korzysta z bazy danych MySQL. Rozpowszechniany jest na licencji GNU General Public License i jest dostępny bezpłatnie.

WordPress ma system szablonów stron internetowych wykorzystujący procesor szablonów. Jego architektura opiera się na kontrolerze, który przekierowuje wszystkie żądania niestatycznych identyfikatorów URI do pojedynczego pliku PHP, ten zaś analizuje identyfikator URI i identyfikuje stronę docelową. Pozwala to na obsługę bardziej czytelnych dla człowieka adresów podstron (permalinków)

Użytkownicy WordPressa mogą instalować i przełączać się między różnymi motywami. Motywy umożliwiają użytkownikom zmianę wyglądu i funkcjonalności witryny WordPress bez zmiany kodu źródłowego lub treści witryny. Każda strona internetowa WordPress wymaga obecności co najmniej jednego motywu, a każdy motyw powinien być zaprojektowany przy użyciu standardów WordPress

Architektura wtyczek WordPress pozwala użytkownikom rozszerzyć funkcjonalność strony internetowej lub bloga. WordPress ma ponad 50.316 dostępnych wtyczek, z których każda oferuje niestandardowe funkcje umożliwiające użytkownikom dostosowanie witryn do ich konkretnych potrzeb. Te dostosowania obejmują zakres od optymalizacji pod kątem wyszukiwarek do portali klienta używanych do wyświetlania prywatnych informacji zalogowanym użytkownikom, do systemów zarządzania treścią, do funkcji wyświetlania treści, takich jak dodanie widgetów i pasków nawigacyjnych.

2.2 Aktualizacje

Strona internetowa stoi w tej chwili na najnowszej, stabilnej wersji Wordpressa o numerze 4.9.8.

Przeprowadzanie aktualizacji systemu na którym oparta jest strona to bardzo ważny element. WordPress pod kątem zabezpieczenia strony staje na wysokości zadania oferując w tym zakresie dość częste aktualizacje – średnio kilka razy w roku. Update’y zawierają w sobie poprawki dotyczące głównie bezpieczeństwa i “szczelności” strony.

Zalecamy ręczne aktualizacje wersji systemu każdorazowo kilka dni po jej oficjalnym wydaniu. Czynność tę można wykonać bezpośrednio z kokpitu administratora.

2.3 Przeniesienie systemu

Aby przenieść stronę w inne miejsce należy:

  • Wykonać kopię aktualnej bazy danych MySQL - w przypadku strony Selectivv baza znajduje się na serwerach firmy Zenbo. Aktualne dostępy do bazy danych z której korzysta strona najlepiej wyciągnąć bezpośrednio z pliku wp-config.php znajdującego się w głównym folderze Wordpressa.
  • Wykonać kopię aktualnych plików Wordpressa za pomocą klienta FTP - wszystkie pliki i foldery znajdujące się w folderze na który wskazuje domena - w tym wypadku jest to folder /Beta.
  • Stworzenie nowej bazy danych MySQL w miejscu docelowym - na serwerze postawionym lokalnie np. za pomocą programu Xampp lub wybranym hostingu.
  • Podmienienie w starej bazie danych wszystkich adresów url na nowe - ten krok jest wymagany tylko w przypadku zmiany domeny.
  • Zaimportowanie starej bazy danych do stworzonej chwilę temu nowej bazy danych MySQL - możliwe że pojawi się potrzeba usunięcia kilku linii kodu w starej bazie, znajdujących się na samym początku odpowiedzialnych za stworzenie bazy (CREATE ...).
  • Aktualizacja ustawień połączenia z bazą danych znajdujących się w pliku wp-config.php - należy podmienić nazwę bazy danych, użytkownika bazy oraz hasło do bazy.
  • Wgranie plików Wordpressa do nowego miejsca docelowego - na serwerze postawionym lokalnie lub wybranym hostingu.

3. Wtyczki

Lista wtyczek zapewniających poprawne działanie strony:

3.1 WPML

Wtyczka odpowiedzialna za wersje językowe na stronie internetowej. Odpowiada za tłumaczenie treści stron, wpisów, custom postów a także własnych pól stworzonych za pomocą wtyczki Zaawansowane własne pola. Strona wtyczki:WPML

3.2 Zaawansowane własne pola

Wtyczka pozwala na tworzenie własnych pól i meta boxów które następnie można łatwo wywołać bezpośrednio na froncie serwisu. Pozwala na tworzenie wszelakiego typu treści i elementów edytowanych bezpośrednio z poziomu edycji danej podstrony. Strona wtyczki:Advanced Custom Fields

3.3 FreshMail for WordPress

Autorska wtyczka do Wordpressa stworzona przez zespół Freshmaila, pozwala tworzyć pola zapisu i formularze zintegrowane z listami mailingowymi tworzonymi bezpośrednio przez stronę Freshmaila. Strona wtyczki:Freshmail

3.4 Disqus for WordPress

Wtyczka podmienia standardowy system komentarzy. Dzięki Disqusowi można bezboleśnie dodawać swoje komentarze na wielu stronach, bez potrzeby ciągłego logowania się lub żmudnego wypełniania formularzy. Do jego najciekawszych funkcji należą: możliwość logowania za pomocą konta Disqus, Facebook, Twitter, Google czy wątkowanie komentarzy. Strona wtyczki:Disqus Comment System

3.5 Contact Form 7

Po instalacji do dyspozycji mamy przykładowy formularz kontaktowy, który łatwo możemy dostosować do własnych potrzeb.Ilość dostępnych typów pól sprawia, że za pomocą tego rozszerzenia możemy tworzyć naprawdę rozbudowane formularze, służące do czegoś więcej niż tylko kontakt z właścicielem strony.

Dodatkowo w repozytorium znaleźć możemy sporo wtyczek będących dodatkami do Contact Form 7. Korzystając z nich możemy dodać do własnego formularza alternatywne do wbudowanego pole z kodem zabezpieczającym (CAPTCHA), dodatkowe typy pól czy możliwość zapisu danych do bazy danych zamiast wysyłania ich e-mailem (przydatne na przykład do formularzy konkursowych). Strona wtyczki:Contact Form 7

3.6 GDPR Cookie Consent

Wtyczka odpowiedzialna za wyświetlanie zgód związanych z RODO użytkownikowi przy jego pierwszej wizycie na stronie. Współgra z wtyczką WPML - możliwe jest więc tworzenie zgód dla każdego języka oddzielnie. Strona wtyczki:GDPR Cookie Consent

3.7 LiteSpeed Cache

LiteSpeed jest serwerem www, znanym z zapewniania doskonałej wydajności i lepszej skalowalności hostingu. Wtyczka pozwala wykorzystać warstwę LiteSpeed serwera do cache'owania. Strona wtyczki:LiteSpeed Cache

4. Motyw

Motyw z którego korzysta strona internetowa Selectivv.com został napisany od zera, bazując jedynie na strukturze proponowanej przez firmę Automatic i ich starterze Underscore (https://underscores.me/)

4.1 Struktura

Struktura plików motywu wygląda następująco:

  • 404.php - podstrona wczytywywana w przypadku wystąpienia błędu 404
  • archive.php - podstrona wczytywywana w przypadku wystąpienia błędu 404
  • footer-offer.php - kod wczytywany jako stopka podstron Narzędzia, Media i Badania
  • footer-page.php - kod wczytywany jako stopka zwyklych podstron
  • footer.php - kod wczytywany jako stopka Strona Głównej
  • functions.php - plik zawierający funkcje potrzebne do poprawnego funkcjonowania motywu
  • header.php - kod wczytywany jako head każdej podstrony
  • index.php - podstrona odpowiadająca za wyświetlanie Bloga
  • page-badania.php - podstrona odpowiadająca za wyświetlanie podstrony Narzędzia
  • page-contact.php - podstrona odpowiadająca za wyświetlanie podstrony Kontakt
  • page-home2.php - podstrona odpowiadająca za wyświetlanie Strony Głównej
  • page-marketing.php - podstrona odpowiadająca za wyświetlanie podstrony Marketing
  • page-media.php - podstrona odpowiadająca za wyświetlanie podstrony Dla Mediów
  • page-sass.php - podstrona odpowiadająca za wyświetlanie podstrony Narzędzia
  • search.php - podstrona wyświetlająca wyniki wyszukiwania
  • sidebar.php - plik odpowiedzialny za wyświetlanie panelu bocznego
  • single-badania.php - plik odpowiedzialny za wyświetlanie badawczego Case Study
  • single-casestudy.php - plik odpowiedzialny za wyświetlanie marketingowego Case Study
  • single-komunikat.php - plik odpowiedzialny za wyświetlanie typu Komunikat dla Mediów
  • single.php - plik odpowiedzialny za wyświetlanie pojedynczego Wpisu
  • style.css - plik zawierający wszystkie style kaskadowe potrzebne to poprawnego wyświetlania strony
  • folder /template-parts - folder zawierający pliki z kodem wczytywanym w innych miejsach jak np. pliki zawierające grafiki SVG
  • folder /img - folder zawierający pliki graficzne
  • folder /fonts - folder zawierający czcionki wykorzystywane w projekcie

4.2 Szablony podstron

Wszystkie szablony podstron zostały wymienione w punkcie 4.1.

Każda z podstron ma przypisane własne zaawansowane pola. Można je edytować bezpośrednio z poziomu panelu wtyczki wybierając odpowiednią grupę pól odpowiadającą nazwie konkretnej podstrony.

4.3 Custom Post Type

Motyw wykorzystuje cztery autorskie typy treście. Każdy z nich można edytować i dodawać nowe treści bezpośrednio z poziomu panelu admina.

Deklaracja każdego z nich znajduje się w pliku functions.php

  • Badania - pojedyczne badania które wyświetlane są na podstronie ofertowej Badania i analizy w formie slidera. Ten typ posta posiada 4 pola: Tytuł, Obrazek wyróżniający, Content (wyświetlany bezpośrednio na podstronie konkretnego badania) oraz Zajawkę (wyświetlaną w sliderze).
  • Case Study - pojedyczne case study marketingowe które wyświetlane są na podstronie ofertowej Marketing Mobilny w formie slidera. Ten typ posta posiada 7 pól: Tytuł, Obrazek wyróżniający, Content (wyświetlany bezpośrednio na podstronie konkretnego badania), Zajawkę (wyświetlaną w sliderze), Logo Klienta, Logo Agencji, Target.
  • Komunikaty - pojedynczy komunikat wyświetlany na podstronie Dla Mediów. Ten typ posta zawiera 3 pola: Tytuł, Content oraz link do komunikatu w formacie PDF.
  • Klienci - pojedyczne logo klienta wyświetlane na Strone Głównej. Ten typ posta zawiera 2 pola: Tytuł oraz obrazek wyróżniający.

4.4 Nagłowki

W motywie występuje tylko jeden nagłówek, wyświetlany w ten sam sposób na wszystkich podstronach. Jest zaciągany z pliku header.php.

To w nim ręcznie wklejone jest np. Google Tag Manager. Poza tym odpowiada za wygenerowanie belki z nawigacją i logotypem firmy.

4.5 Stopki

W motywie możemy znaleźć 3 różne pliki odpowiedzialne za wyświetlane stopek serwisu:

  • footer.php - kod wyświetlany na Stronie Głównej. Zawiera kod Javascript odpowiedzialny za działanie wszystkich animacji znajdujących się na tej podstronie.
  • footer-offer.php - kod wyświetlany na podstronach ofertowych Marketing Mobilny, Badania i analizy, Narzędzia Marketera. Zawiera kod Javascript odpowiedzialny za działanie wszystkich animacji znajdujących się na tych podstronach.
  • footer-page.php - kod wyświetlany na wszystkich pozostałych podstronach. Zawiera kod Javascript odpowiedzialny za wyświetlanie efektu fixowania nawigacji.

4.6 Style CSS

Wszystkie kaskadowe style znajdują się w jednym pliku style.css.

Przy wprowadzaniu jakichkolwiek zmian w stylach musimy pamię†ać aby wymuszać ponowne zcashowanie strony przez wtyczkę LightSpeed Cache.

4.7 Edycja kodu

Wordpress pozwala na edycję kodu plików motywu bezpośrednio z poziomu panelu administratora. Można to zrobić przechodząc do zakładki Wygląd i następnie wybierając Edytor.

Nie jest to jednak najbezpieczniejsza forma edycji, sugerowalibyśmy korzystanie z klienta FTP i ręczną edycję plików (ściąganie a następnie wysyłanie ponownie na serwer). W przypadku korzystania z wbudowanego edytora w przypadku wystąpienia np. losowej utraty internetu może nastąpić skasowanie całej zawartości pliku.

5. Pomoc

W razie jakichkolwiek pytań wykraczających poza informacje zawarte w tej krótkiej dokumentacji zapraszamy do kontaktu pod adresem email: hello@esumomedia.com

W razie wystąpienia sytuacji kryzysowej warto również pamiętać że Zenbox sam tworzy backup wszystkich plików i baz danych do kilku dni wstecz. Jednym kliknięciem możemy przywrócić wersję pliku sprzed kilku godzin lub dni.