window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'AW-655919844'); (function(h,o,t,j,a,r){ h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)}; h._hjSettings={hjid:1940020,hjsv:6}; a=o.getElementsByTagName('head')[0]; r=o.createElement('script');r.async=1; r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv; a.appendChild(r); })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');

Własna, skonfigurowana strona 404 jest ważna pod kątem SEO. Zobacz, jak zrobić stronę 404 bez korzystania z wtyczek na motywach Divi i Astra.

Dobrze zbudowana strona 404 powoduje, że gość na stronie widzi, że twórca o niego dba. Ma nie tylko informację o błędzie, ale także kilka linków do wykorzystania. Jest to istotne w sklepach internetowych ale i na portalach oraz blogach.

Są wtyczki do WordPressa, które generują stronę 404. Nie będziemy ich tu reklamować. Jeśli zechcesz, znajdziesz je samodzielnie na stronie Wordrpess: https://pl.wordpress.org/plugins/

3 kroki do strony 404

  1. Zgrywasz plik 404.php na dysk. Plik znajdziesz w katalogu z wp-content/themes/nazwa-motywu. Jeżeli nie znajdziesz pliku, możesz go utworzyć samodzielnie np. poprzez Notepad++.
  2. W pliku 404.php tworzysz content. Aby było łatwiej, możesz porównać plik 404.php z plikiem page.php.
  3. Wgrywasz utworzony plik 404.php do katalogu wp-content/themes/nazwa-motywu i podmieniasz istniejący.

Przykładowy content w pliku 404.php

Jak powinien wyglądać plik 404.php? To już zależy od Ciebie. Poniżej 2 przykłady, jak może wyglądać kod w pliku 404.php dla motywów Divi i Astra.

Kod w pliku 404.php w motywie Astra

jak zrobić stronę 404 divi

Kod w pliku 404.php w motywie Divi

jak zrobić stronę 404 astra

Efekt końcowy strony 404

Poniżej przykładowa strona 404 na stronie butiku Venecjasklep.pl.

jak zrobić stronę 404 wordpress

Dodanie linijek w pliku CSS

Ostatnie zadanie to dodatkowy kod CSS, do oscylowania div-ów. Jeżeli chcesz, aby Twoja strona 404 wyglądał jak ta powyżej, to oprócz dodania zaznaczonego kodu w pliku 404.php, musisz dodać kod CSS:


/* 404 */
#boxblad {
display: flex;
max-width: 1000px;
margin: 0 auto;
}
.catblad{
margin:10px;
}

[Głosów: 1   Average: 5/5]
Call Now Button