Czas czytania treści na stronie, blogu

Z informacją o tym, że przewidywany czas czytania artykułu może zająć mi np. 3 minuty spotykam się na blogach już od dłuższego czas. Sama jednak to rozwiązanie stosuję od niedawna.

Prawdę mówiąc zaczęłam je stosować głównie testowo. Część moich blogów zawiera, krótkie kursy – a tym samym kody i skrypty (np. HTML, CSS) tak naprawdę nie da się przewidzieć ile czasu zajmie komuś ich przeczytanie.

Jeden będzie czytał je szybciej a drugi wolniej. Możliwe jest jedynie orientacyjne określenie czasu czytania.

Ręczne liczenie czasu czytania

Długość czasu czytania wpisu możemy obliczyć samodzielnie z pomocą np. stopera (również tego w komórce). Kiedy już znajdziemy włączamy stoper i czytamy zawartość naszego wpisu.

Otrzymany wynik możemy następnie dodać jako orientacyjny czas czytania.

Z pewnością zajmie nam to trochę czasu.

Określenie czasu czytania z pomocą Reading Time WP

Oczywiście nie zawsze musimy samodzielnie określać czas czytania. Istnieje kilka wtyczek, które mogą to zrobić za nas (to czy robią to poprawnie to już zupełnie inna para kaloszy). Ja zdecydowałam się na użycie wtyczki Reading Time WP

Wtyczkę instalujemy tak jak wszystkie inne. Proces instalacji wtyczek opisałam w innym wpisie tu macie do niego link.

Po instalacji wtyczki należy ją aktywować. Pojawi się w tedy w Ustawieniach nowa zakładka Reading Time WP, w której możemy edytować jej ustawiania.

Wtyczka jest domyślnie dodawane przez wtyczkę opisy są w języku angielskim. Dlatego po instalacji o ile nie prowadzimy anglojęzycznej witryny musimy wejść w jej ustawienia.

Przetłumaczenie na inny język nie powinno być specjalnie trudne. Wystarczy wpisać w odpowiednie pola adekwatny tekst np. czas czytania, minut.

W moim przypadku nigdzie nie musiałam dodawać, żadnych dodatkowych kodów – tekst generowany przez wtyczkę dodał się automatycznie. Musiałam jednak wprowadzić kilka zmian w CSS. Domyśle ustawiony tekst zlewał się z tekstem wpisu.

W razie gdyby w waszym motywie nie włączyła się wtyczka automatycznie u dołu strony z ustawieniami znajdziecie krótkie kody, które można dodać do wpisu.

Artykuł Liczenie czasu czytania wpisu w WordPress (Reading Time WP) pochodzi z serwisu Kurs WordPress od podstaw.

Istnieją jednak takie wersje strony, na których chce się zostać nieco dłużej – spersonalizowane pod witrynę.

Co powinna zawierać strona 404

Przed przygotowaniem strony warto jest dobrze to przemyśleć. Na pewno musi znaleźć się na niej czytelny komunikat co jest powodem jego pojawienia.

W CMS WordPress bardzo łatwo można stworzyć własną stronę 404 bez konieczności modyfikowania motywu z pomocą odpowiedniej wtyczki. Dzisiaj przedstawię wam jedną z takich wtyczek czyli: 404page – your smart custom 404 error page

Instalacja wtyczki

Nie będę wam tutaj dokładnie opisywać jak zainstalować wtyczkę w CMS – Proces instalacji wtyczki.

Po zainstalowaniu wtyczki pamiętajcie by ją aktywować.

Konfiguracja wtyczki dla nieistniejących stron

Następnie udajemy się w lokalizację Wygląd -> 404 Error Page.

Równocześnie warto jest utworzyć nową stronę, która w przyszłości będzie pełnić funkcję strony błędu.

Wtyczka niestety nie jest w języku Polskim, choć nie powinno to sprawiać dużych problemów.

Praktycznie interesuje nas tylko „Page to be displayed as 404 page”. Opis ten dotyczy rozwijanego pola w którym możemy wybrać stronę, która zastąpi domyślną 404.

W naszym przypadku będzie to strona, o której wspomniałam już wcześniej. Powyżej tego tekstu umieściłam obrazek na którym widać jakie inne opcje mam włączone.

Pamiętaj by zapisać zmiany! Przycisk zapisu znajduje się zaraz poniżej konfigurowanych pól.

Zmiana wyglądu strony

Po zapisaniu zmian w panelu obok nazwy wybranej strony (naszej nowej 404) pojawi się informacja. Na czarnym tle 404.

Oczywiście strona ta będzie dalej funkcjonować jak pozostałe, można ją więc w każdej chwili edytować.

Przykładowo zawartość mojej nowej strony błędu wygląda tak:

A tak prezentuje się ona dla osób, które na nią trafią.

Jak widać nie jest ona na razie za ciekawa posiada jednak wszystkie podstawowe cechy jakie powinna mieć tego typu strona czyli komunikat – strona nie istnieje.

Artykuł Jak szybko stworzyć własną stronę błędu 404 w WordPress? pochodzi z serwisu Kurs WordPress od podstaw.

Od czego zacząć instalację wtyczki?

Na początek trzeba mieć oczywiście stronę / blog / sklep oparty o WordPress oraz wtyczkę, którą chce się zainstalować.

W WordPress możemy dodawać wtyczki na kilka różnych sposobów. To jednak na, którą metodę się decydujemy w dużym stopniu zależy skąd mamy konkretną wtyczkę. Jeżeli bowiem pobieramy ją z oficjalnej strony WordPress możemy ją instalować z:

• poziomu panelu administracyjnego bezpośrednio z repozytorium / katalogu wtyczek
• wgrywając na serwer FTP po wcześniejszym jej pobraniu na komputer (metoda ręczna)
  • wgrać możemy z pomocą programu do FTP
  • lub CMS (Wyślij na serwer -> w zakładce Wtyczki)

Jeśli chcemy zainstalować wtyczkę zakupioną z innego źródła możemy ją jedynie ręcznie wgrać na serwer

Nieco dokładniej opisałam ten proces poniżej.

Instalacja z katalogu wtyczek

W celu dodania nowego rozszerzenia musimy być zalogowanie do panelu administracyjnego. Następnie w lewej kolumnie odnajdujemy Wtyczki -> Dodaj nową

W nowo otwartym oknie pokaże nam się repozytorium wtyczek WordPressa (katalog wtyczek). Zaraz po otwarciu w pierwszym oknie zobaczymy rekomendowane pluginy. Są to popularne wtyczki ułatwiające wielu użytkownikom pracę.

Jeśli na tej liście nie znajduje się interesującej nas wtyczka to musimy skorzystać z wyszukiwarki. Mieści się ona nad polem z dodatkami po prawej stronie. Instalacja wtyczek z katalogu jest dość prosta. Wystarczy po jej wyszukaniu kliknąć Zainstaluj Teraz.

Jeżeli nie mamy wybranej jeszcze konkretnej wtyczki to w tym miejscu można również zapoznać się z opcjami wtyczek, które zostały wyszukane. Jedyne co musisz zrobić to kliknąć w szczegóły.

Nie jest to jednak jedyna opcja dodawania nowych rozszerzeń.

Instalacja wtyczki wcześniej pobranej (z komputera)

Z pomocą CMS

Wtyczki możemy pobrać także bezpośrednio ze strony WordPress.org lub zakupić na jednej z wielu stron. W takim przypadku będziemy posiadali archiwum (np. zip) w którym będzie zapakowana wtyczka.

Do jej wgrania użyć możemy przycisku Wyślij wtyczkę na serwer.  Mieści się w oknie  obok napisu Dodaj wtyczkę u góry strony. Po przyciśnięciu przycisku otworzy się okno w którym wybieramy wtyczkę i importujemy na serwer.

Przez serwer ftp

Wtyczkę możemy również wgrać bezpośrednio na serwer FTP. Rozpakowaną wtyczkę wgrywamy w lokalizacji:

katalog-z-wordpressem/wp-content/plugins/

Aktywacja Wtyczki

Po zainstalowaniu wtyczki trzeba ją jeszcze aktywować. Aby tego dokonać trzeba być zalogowanym do WordPress. Następnie wchodzimy w zakładkę Wtyczki -> Zainstalowane wtyczki

Odnajdujemy tam naszą wtyczkę i klikamy AKTYWUJ.

Jeśli proces się nie powiedzie na pewno pojawi się komunikat o przyczynie. Może być ona naprawdę różnorodna. Od błędu we wtyczce do np. braku innej wymaganej wtyczki.

Artykuł Instalacja wtyczki w WordPress pochodzi z serwisu Kurs WordPress od podstaw.

Umieszczenie na stronie samego adresu e-mail w praktyce nie zawsze wystarczy.  Skopiowanie adresu i zalogowanie się do skrzynki pocztowej może skutecznie zniechęcić część osób a i nigdy nie mamy pewności czy koś nie spisze sobie tego adresu i nie za spamuj nam skrzynki. Dlatego warto jest pomyśleć o formularzu kontaktowym.

Trochę o formularzach w CMS

Na platformę WordPress stworzonych zostało wiele wtyczek, dzięki którym możemy szybko i w łatwy sposób zbudować formularz. Obsługa większości z nich nie wymaga praktycznie żadnej wiedzy informatycznej – jedynie poświęcenia chwili na doczytanie co napisał autor. Jedną z nich jest właśnie Contact Form 7. Plugin ten przeznaczony jest zarówno do tworzenia prostych jak i nieco bardziej rozbudowanych formularzy kontaktowych.

„Pobierz Contact Form 7” .

Sama wtyczka jest w miarę intuicyjna – praktycznie konfiguracja podstawowego formularza zajmie nam najwyżej kilka minut. Dlatego jest też polecana przez wiele osób jako jedna z najlepszych. Na korzyść wtyczki z pewnością przemawia również dostępność w języku polskim – tak więc język angielski nie jest wymogiem koniecznym (choć może się przydać przy bardziej skomplikowanych konfiguracjach).

Od czego zacząć pracę z Contact Form 7

Pracę z wtyczką zaczynamy jak zwykle od jej instalacji. Proces instalacji pluginów w WordPress opisałam w innym wpisie dlatego tylko zostawię wam do tego wpisu link. Po uruchomieniu wtyczki musimy ją skonfigurować. Opcje Contact Form 7 znajdziemy w panelu bocznym – połączeniu powinien pojawić się tam nowy odnośnik „Formularze”

Po wejściu w niego zobaczymy od razu pierwszy przykładowy formularz.

Budowa formularza

W nowo otwartym oknie zobaczymy listę istniejących już formularzy. Na samym początku będzie to jeden już gotowy jeden przykładowy formularz. Obiekt ten możemy edytować lub utworzyć nowy. Warto w tym miejscu wspomnieć, że jeśli zdecydujemy się utworzyć nowy to będzie on dokładnie taki samo jak pierwszy przykładowy – gdyż zawiera on wyłącznie podstawową strukturę.

Oprócz nazwy formularza w tym oknie będziemy mogli zobaczyć jaki jest „skrót” do formularza (shortcode) oraz datę utworzenia. Kod ten przyda nam się w momencie gdy będziemy chcieli umieścić formularz w treści strony lub wpisu.

W celu wejścia w formularz klikamy w jego nazwę.

Nowy formularz będzie wyglądał jak na załączonym obrazku poniżej. Jak widać składa się on z kilku sekcji.

W górnej części znajduje się pole z nazwą formularza, oraz kodem który umieszczamy w miejscu gdzie chcemy, by został opublikowany formularz. Poniżej znajduje się właściwa część formularza składająca się proste menu w formie tabów z ustawieniami formularza oraz pole zmieniające swoją zawartość w zależności od tego, którą opcję wejdziemy.

Pierwszą kartą jest formularz.

Na początku dysponuje on następującymi polami:

• [text* your-name]
• [email* your-email]
• [text your-subject]
• [textarea your-message]

Taki formularz praktycznie powinien już wystarczyć do kontaktu. Jeśli jednak zdecydujecie się go rozbudować to jego ewentualna rozbudowa nie powinna przysparzać też dużych problemów. Praktycznie wszystkie dodatkowe pola jakie możemy dodać znajdują się nad polem tekstowym. Jedyne co do nas należy wybrać i umieścić je w odpowiednim miejscu.

Wysyłanie formularza

Teraz warto wejść w zakładkę email (gdzie zamieszczone są opcje wysyłki) i zmienić adres e-mail na ten na który mają przychodzić wiadomości.

• Odbiorca – w to miejsce wpisujemy adres na jaki mają przychodzić wiadomości e-mail
• Nadawca – adres z którego jest wysyłany (najlepiej, by był to powiązany z domeną np. biuro@aurainweb.pl dla domeny http://www.aurainweb.pl – inny może powodować nie dochodzenie wiadomości)
• Temat – pole z tematem (domyślnie wprowadzane jest z formularza [temat] można jednak usunąć i ustawić wartość domyślną np. wiadomość z strony)
• Dodatkowe nagłówki
• Treść wiadomości – treść wiadomości, w tym polu umieszczamy kody z naszego formularza, które zostaną zastąpione treścią
• Załączniki – pole na załączniki
• Email (2) – daje możliwość wysyłania kopi wiadomości

Na koniec wprowadzania zmian wszystko zapisujemy.

Komunikaty

Ważne jest też ustawienie komunikatów tak, by wypełniająca osoba wiedziała gdzie popełnia ewentualny błąd.

Umieszczanie na stronie

Tak jak piałam już wcześniej należy skopiować indywidualny shortcode formularza np.:

[contact-form-7 id="6052" title="Formularz 1"]

umieścić go w miejscu na stronie tam gdzie chcemy pokazać formularz.

Po aktualizacji formularz nie musimy umieszczać na nowo kodu jeśli wprowadzimy jakąś zmianę na stronie – automatycznie zostanie to zaktualizowane.

przykładowy formularz:
[contact-form-7 id=”6052″ title=”Formularz 1″]

Formularz można edytować podobnie jak każdy inny odwołując się do jego klasy.

Redukowanie spamu w formularzu

Bez wątpienia stanowi to wyjątkowo irytujące zjawisko. Dlatego w celu jego ograniczenia można do formularza dodatkowo zainstalować wtyczkę Really Simple CAPTCHA. W nowszej wersji pole wtyczki jest widoczne na belce narzędzi – nie jest ona jednak dostępna.

W celu skonfigurowania wtyczki musimy pobrać indywidualny klucz z Google.

Contact Form 7 wiadomości nie docierają

Na początek sprawdź czy Nadawca jest w domenie strony.

Bywa tak czasem tak że nasz hosting nie pozwala na wykorzystanie funkcji php mail, wymaga jest za to autoryzacja smtp. Domyślnie wtyczka jednak nie posiada takiej możliwości. Dlatego trzeba zainstalować dodatkową wtyczkę np. WP Mail SMTP.

Zmiana wyglądu formularza

Wygląd formularza możemy zmienić samodzielnie z pomocą HTML i CSS lub zainstalować wtyczkę Contact Form 7 Style dzięki której będziemy mogli dokonać zmiany wyglądu z poziomu edytora.

Nowsza wersja pluginu została trochę zmodyfikowana jednak zasady jej działania w CMS WordPress nie uległy zmianie.

Aktualizacja [26.09.2017]

Dodatkowe tagi:
contact form 7 konfiguracja
zaawansowane formularze kontaktowe w WordPressie
instalacja

Artykuł Najlepszy formularz kontaktowy w WordPress! – Contact Form 7 pochodzi z serwisu Kurs WordPress od podstaw.

WordPress sam jak i niektóre instalowane dodatki mają możliwość modyfikowania zawartości tego pliku. W efekcie wprowadzone przez nas zmiany po kilku dniach mogą zostać nadpisane lub nie będą w ogóle interpretowane przez przeglądarkę.

Kiedy stosujemy przekierowania

Przekierowania tworzymy w sytuacjach kiedy:

• nasza strona strona zmieni swój dotychczasowy adres,
• strona lub podstrona serwisu zostanie usunięta,
• nastąpiła zmiana struktury strony np. przejście na system CMS WordPress,
• połączymy ze sobą kilka stron.

Przekierowania w WordPress

Do wykonania przekierowania przyda nam się plugin plugin redirection. Wtyczkę można pobrać ze strony (wordpress.org) lub zainstalować poprzez dodaj nową w panelu administracyjnym.

Wtyczka jest bardzo prosta w obsłudze, choć na początku może sprawiać drobne trudności. Wtyczka oferuje nam dodawanie i konfigurowanie różnego typu przekierowań (np. 301,302). Całość operacji dokonuje się z panelu administracyjnym więc nie musimy w żaden sposób ingerować w kod, czy szukać odpowiednich komend.

Plugin wraz z instrukcją i filmem instruktażowym dostępny jest na stronie autora całość napisana jest w języku angielskim – obecnie dla wielu osób nie powinno to sprawiać problemu.

Jak dodać przekierowanie z nieistniejącego adresu?

Po zainstalowaniu i włączeniu wtyczki będzie można nią zarządzać w lokalizacji Narzędzia -> Przekierowania.

Pierwszą kartą jaka nam się otworzy będą przekierowania (Redirects). Na początku karta będzie zawierać tylko opcję dodania nowego przekierowania. Później jednak w miarę tworzenia nowych przekierowań zacznie pojawiać się tam ich lista.

Zaczynając pracę z wtyczką warto odwiedzić ustawienia (Options).

Przekierowania dodajemy na podstronie przekierowania.

Przekierowania możemy dodawać na kilka sposobów. Jednym z nich jest wejście w zakładkę Redirections następnie możemy kliknąć przycisk Add New lub przejść na duł strony.

Po wykonaniu jednej z tych czynności pokaże się poniższe pole. Teraz trzeba uzupełnić odpowiednie rubryki:

• Source URL (Źródłowy URL) – stary adres, po wpisaniu którego chcemy przenieść odwiedzającą stronę osobę
• Target URL (Docelowy URL) – a następnie nowy adres docelowy

W starszej wersji wtyczki mieliśmy widocznych całkiem sporo opcji do wyboru. Najnowszej zaś przekierowania możemy dodawać w 2 miejscach. W pierwszej zakładce -> Redirects poprzez przycisk Add New oraz w 404s. Pierwsza opcja daje nam możliwość wprowadzania nazwy stron, które chcemy przekierować.

W zakładce 404s mieści się z kolei lista zawierająca błędy 404 czyli strona nie istniej.

W celu przekierowania na inny adres takiego błędu wystarczy w niego najechać wskaźnikiem pokaże się wtedy  dodatkowe menu. Wybieramy w nim Add Redirect! Otworzy się wtedy pole analogiczne do tego co było w przekierowaniach. Będzie miało ono jednak więcej opcji.

Zainteresować może cię również:

Przekierowanie starej domeny na nową za pomocą PHP i HTML
Jak zrobić przekierowanie bez www na www?
Przekierowanie 302 – przekierowanie tymczasowe
http://urbangiraffe.com/plugins/redirection/

Dodatkowe tagi:
Jak wykonać poprawnie przekierowanie w cms wordpress z pluginem
Ustawianie przekierowań w WordPress na właściwy adres
zmiana adresu strony, witryny www
Obsługa błędu 404

Artykuł Ustawianie przekierowań z starego na nowy adres w WordPress – Redirection pochodzi z serwisu Kurs WordPress od podstaw.