Dwie proste metody, instrukcje krok po kroku, porady i wsparcie...

Brak produktów w koszyku.

Krok 4 – dodanie treści

W końcu przechodzimy do etapu gdzie można będzie zapełnić naszą dziewiczą stronę konkretnymi treściami. Wiele osób z którymi mam styczność tego etapu obawia się najbardziej zadając pytanie „czy będę potrafił”, „czy będę potrafiła”. Oczywiście, że tak. Jeśli tylko nie są Ci obce klawiatura i myszka komputerowa a do tego zdarzyło Ci się popełnić teksty w dowolnym edytorze np. Word, również jesteś w stanie zrobić to samo na swojej stronie. Jedyna różnica to interfejs edytora, do którego po prostu trzeba się przyzwyczaić i poznać jego możliwości.

Stronę tworzymy po to aby za jej pośrednictwem dzielić się z innymi informacjami, czy to na temat własnej firmy, zainteresowań, hobby itp. Gdy już przedarliśmy się przez poprzednie kroki czyli mamy zainstalowanego WordPress’a, mamy zainstalowany motyw graficzny możemy przystąpić do uzupełnienia strony o treści.

WordPress w standardzie oferuje dwa rodzaje zawartości na jakich możesz operować. To „Strony” np. dla podstron w rodzaju Kontakt, O firmie itp…, oraz „Wpisy„, które z powodzeniem mogą być wykorzystane jako artykuły na podstronie z blogiem, w dziale aktualności itp… Można tworzyć także własne rodzaje treści, ale to już nieco bardziej złożony temat na osobny artykuł, dlatego na starcie nie będę Ci tym zaśmiecał głowy.

Do tej pory w WordPressie mieliśmy do czynienia z prostym edytorem treści stworzonym na bazie skryptu TinyMCE. Wyglądało to jak na załączonym poniżej obrazku.

Standardowy edytor treści

Zwróć uwagę na centralną część obrazka. Widać tu pole do wprowadzania treści, a powyżej niego znajomo wyglądający pasek narzędzi do formatowania tekstu. Wprowadzało się treść analogicznie jak w typowym edytorze tekstu, a gdy wszystko było gotowe wystarczyło po prawej stronie kliknąć w przycisk „Opublikuj”. Ten sposób edycji treści był i w sumie to nadal jest bo można wciąż z niego korzystać jeśli zechcemy bardzo intuicyjny. Szybko można było zorientować się co gdzie jest i do czego służy mając jedyne doświadczenia np. z Wordem lub podobnym edytorem. Ten sposób edycji treści na stronach i podstronach serwisu działającego na WordPress’ie funkcjonował od wielu lat. Trzeba jednak pamiętać, że WordPress pierwotnie powstał jako platforma blogowa, w większości, gdzie dominowały jednolite artykuły wzbogacone fotkami czy filmikami. Świat jednak idzie do przodu, a WordPress już dawno przestał być skryptem wykorzystywanym wyłącznie do prowadzenia bloga. Jak wiesz działają na jego bazie strony biznesowe, portale czy sklepy internetowe. Prędzej czy później zmiana musiała nadejść.

Edytor Gutenberg

Licząc od wersji 5 WordPress’a, która została oficjalnie wydana 6 grudnia 2018 roku dotychczasowy edytor treści został zastąpiony nowym o nazwie „Gutenberg”. Razem z jego nadejściem praktycznie całkowicie zmienia się sposób zarządzania zawartością strony internetowej. Głównym ograniczeniem dotychczasowego edytora było to, że nie pozwalał na swobodną aranżację układu treści. Mogliśmy zapakować tekst w formie jednolitego bloku przeplatanego fotkami, które również miały dość ograniczony sposób wkomponowania ich w artykuł. Gutenberg to zmienia wprowadzając sporo elementów, przy pomocy których będziesz mógł wygodniej zarządzać zawartością strony i jednocześnie tworzyć ją w taki sposób, aby była atrakcyjna i dotrzymywała kroku zmieniającym się trendom.

To jednak wiąże się nieuchronnie z tym, że dotychczasowa niezwykle prosta edycja treści, dla osób, które nigdy nie miały styczności z zarządzaniem stronami WWW może się teraz wydać bardziej skomplikowana. Faktycznie Gutenberg ma nieporównywalnie więcej opcji, co przy pierwszym zetknięciu może wystraszyć, ale jeśli poświęcisz chwilę na zabawę z tym narzędziem szybko powinieneś załapać o co w nim chodzi i nagle okaże się, że trudno będzie Ci wyobrazić sobie pracę bez niego.

edytor gutenberg

Wstawmy treść na stronę główną

Pozwól, że pominę w dalszej części tradycyjny edytor, bo jego dni są policzone więc zwyczajnie szkoda czasu. Domyślnie po instalacji WordPress’a stroną główną jest lista wpisów (artykułów). Wynika to z faktu, że WordPress pierwotnie był wyłącznie platforma blogową. My jednak w naszym przykładzie nie chcemy aby na stronie głównej pojawiała się lista artykułów, ale chcemy dać kilka informacji na temat naszej firmy. Żeby tak się stało musimy najpierw utworzyć stronę, która stanie na froncie naszej witryny.

W tym celu z menu wybierz kolejno „Strony > dodaj nową”

dodaj stronę

Uruchomi się edytor Gutenberg przy pomocy którego wprowadzimy nasz tekst. Na starcie będzie to wyglądało mniej więcej tak:

edycja treści

Warto wspomnieć, że w odróżnieniu od klasycznego edytora w Gutenbergu pracujemy na blokach, a każdy blok (no może prawie każdy) ma swoje właściwości. Blokiem jest w naszym przykładzie zarówno tytuł i tekst zamieszczony poniżej. Edycja jest bardzo prosta. Klikając w pole tytułu – na powyższym zrzucie to „Add title” możesz wpisać własny tytuł, z kolei klikając w obszar treściWrite your story” możesz wprowadzić dowolny tekst. Gutenberg nie jest jeszcze spolszczony, przynajmniej w chwili gdy to piszę, ale być może gdy uruchomisz go u siebie będzie już inaczej. Po wprowadzeniu treści w tych dwóch blokach efekt jest taki:

Zauważ, że edytując tekst, tuż nad nim widoczny jest podręczny pasek narzędziowy z dodatkowymi opcjami formatowania. 

podręczny pasek formatowania

Przy jego pomocy dodasz link, pogrubisz wybrane fragmenty, wyrównasz tekst do lewej lub prawej itd… To jednak nie wszystko. Spójrz na okno konfiguracyjne bloku tekstowego znajdujące się po prawej stronie.

właściwości bloku

To co tu widzisz to dodatkowe ustawienia treści w naszym bloku. Możesz zwiększyć rozmiar tekstu, kolory tła i fontów czy włączyć Drop Cap. Przykład zabawy ustawieniami:

format

Czegoś podobnego nie byłbyś w stanie zrobić w poprzednim edytorze bez grzebania w kodzie. Czy to dobrze czy źle trudno mi powiedzieć. Jeśli będziesz w stanie estetycznie zaaranżować całość, to taka funkcjonalność na pewno korzystnie wpłynie na odbiór strony przez internautów, jeśli jednak przesadzisz i zrobisz ze swojej strony istny jarmark – na co obecny edytor pozwala – efekt będzie zupełnie odwrotny. Wszystko w Twoich rękach :)

Ale uwaga, uwaga. To nie wszystko. Nowy edytor umożliwia Ci dokładnie kolejnych bloków i to nie tylko tekstowych. Klikając w małą ikonkę z plusikiem rozwiniesz listę dostępnych opcji:

dostępne bloki w edytorze

Klikając na wybranej możesz wstawić np. kolejny paragraf, zdjęcie, galerię, wideo i wiele więcej. Załóżmy że w naszym przykładzie dodamy listę wypunktowaną. Klikam więc na ikonce „List” i w efekcie nowy blok z listą pojawi mi się na stronie do edycji.

Po co w ogóle idea bloków, przecież taką listę można by było spokojnie wprowadzić korzystając ze zwykłego edytora jak to miało miejsce dotychczasz. Bloki poza tym o czym już wspomniałem (niezależna konfiguracji ich właściwości) mogą być przemieszczane względem siebie. Gdybym zechciał w normalnym edytorze zamienić kolejnością pierwszy fragment treści z listą wypunktowaną musiałbym ją skopiować, usunąć i wkleić nad tekstem. Mając do dyspozycji bloki jednym kliknięciem zmieniam ich kolejność. To jak się przekonasz niejednokrotnie, niezwykle ułatwia pracę i zaoszczędza masę czasu. Pobaw się na swojej instalacji klikając w przycisk widoczny w prawym górnym rogu danego bloku.

Bardzo, ale to bardzo ważnym elementem nowego edytora jest możliwość układania treści w kolumnach. Tego chyba wszystkim łącznie z moją osobą najbardziej brakowało w tradycyjnym edytorze. Podobnie jak powyżej klikami w ikonkę z plusikiem, rozwijamy listę bloków i wybieramy z niej kolumny. 

kolumny

Blok z dwoma kolumnami wskoczy nam do obszaru edycji i teraz do każdej z kolumn możemy dodać kolejne bloki. Ja w naszym przykładzie do lewej kolumny wrzuciłem tekst, a do prawej obrazek.

dwie kolumny

Kolumn możesz tworzyć więcej w zależności od potrzeb, a poniżej możesz jeszcze zobaczyć to o czym napisałem powyżej tyle że w formie filmiku.

Tak naprawdę dużo zależy od Twojej pomysłowości. Nowy edytor to narzędzie z dużo większymi możliwościami, łatwe do opanowana, ale także niestety może okazać się pułapką jeśli wykorzystując jego możliwości zwyczajnie przesadzisz. Strona powinna być czytelna, internauta powinien móc skoncentrować się na przekazywanych treściach, a nie być rozpraszanym wodotryskami, wszystkimi kolorami tęczy, animowanymi gifami itd, itp… Jeśli choćby poczujesz, że zaczynasz się zapędzać w tym kierunku powiedz stop i zrób krok wstecz. Koniecznie.

Po wprowadzeniu treści nie zapomnij opublikować strony. Aby to zrobić kliknij w przycisk publikacji, który znajdziesz w prawym górnym rogu edytora.

OK Mamy więc dodaną podstronę „O firmie„. W identyczny sposób dodajesz kolejne podstrony a także wpisy, np. na podstronie bloga czy aktualności o czym już wspomniałem powyżej. Wpisy w przeciwieństwie do Stron dodatkowo mogą być kategoryzowane oraz tagowane, ale to temat na artykuł o prowadzeniu bloga czy działu a’la poradnik z artykułami – swoją drogą pomyśl o tym.

Wróćmy do naszej podstrony „O firmie„. Załóżmy, że chcemy aby była to główna strona naszego serwisu. Aby tak się stało przechodzimy do zakładki Ustawienia –> Czytanie.

czytanie

I zaznaczamy dla naszej strony głównej opcję „statyczną stronę„, a z listy wybieramy „O firmie”. Zapisujemy zmiany i gotowe.

czytanie02

Jak widzisz to nic skomplikowanego. Kilka kliknięć i cała filozofia. Wszystko sprowadza się do tego abyś wiedział co do czego służy, a obcując z tym systemem z dnia na dzień będziesz wiedział coraz więcej stając się prawdziwym ekspertem w tej dziedzinie.

Droga na skróty

Nie masz zbyt wiele wolnego czasu na robienie wszystkiego samodzielnie? Sprawdź moją propozycję wsparcia.

Udostępnij na Facebooku
Udostępnij na Twitterze

Co nowego na blogu?