← Wszystkie wpisy

Poradniki

Zbuduj własny tryb czytnika z JustZix

17 maja 2026 · autor JustZix Team

Tryby czytnika przeglądarki są świetne, dopóki nie wytną jedynego obrazu, którego chciałeś, nie zniekształcą bloków kodu lub w ogóle odmówią uruchomienia. Dzięki JustZix możesz zbudować własny tryb czytnika, który działa dokładnie tak, jak lubisz, dokładnie na wybranych przez ciebie stronach.

Dlaczego stworzyć własny

Wbudowany tryb czytnika to czarna skrzynka. Nie możesz dostroić długości wiersza, nie możesz zachować rycin, a często zawodzi na stronach, które nie są klasycznymi artykułami. Reguła JustZix to z kolei po prostu CSS, który kontrolujesz. Działa na prawdziwej stronie, więc linki, kod i media nadal działają. Ty decydujesz, co zostaje, a co znika.

Krok pierwszy: okiełznaj kolumnę artykułu

Pojedyncza największa wygrana w czytelności to ograniczenie długości wiersza. Wiersze dłuższe niż około 75 znaków zmuszają oczy do zbyt dalekiej podróży, a ty gubisz miejsce przy ruchu powrotnym. Wyśrodkuj główną kolumnę i ogranicz jej szerokość:

article, .post-content, main {
  max-width: 68ch !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 1.5rem !important;
}

Jednostka ch jest powiązana z szerokością znaku 0, więc 68ch ląduje blisko klasycznego ideału 66 znaków niezależnie od rozmiaru czcionki. Dostosuj listę selektorów do swojej docelowej strony.

Krok drugi: otwórz tekst

Domyślna wysokość wiersza na stronach informacyjnych to często ciasne 1,4. Czytanie jest dużo wygodniejsze przy około 1,7, z nieco większym rozmiarem body oraz krojem szeryfowym lub humanistycznym bezszeryfowym:

article p, .post-content p {
  font-size: 1.18rem !important;
  line-height: 1.75 !important;
  margin-bottom: 1.4em !important;
  font-family: Georgia, 'Iowan Old Style', serif !important;
}
article h2, article h3 {
  line-height: 1.3 !important;
  margin-top: 2em !important;
}

Krok trzeci: oczyść scenę

Teraz ukryj hałas. Paski boczne, przyklejone nagłówki, wsuwki newsletterów i kolumny treści powiązanych walczą o uwagę. Ogólna reguła display je usuwa:

aside,
.sidebar,
.newsletter-signup,
.related-posts,
[class*="sticky"],
[id*="recirculation"] {
  display: none !important;
}
body { overflow-x: hidden !important; }

Bądź lekko ostrożny z selektorami atrybutów typu [class*="sticky"] — przetestuj stronę i usuń każdy selektor, który ukrywa coś, co chciałeś zachować.

Składanie tego razem jako reguła

W JustZix utwórz nową regułę, ustaw wzorzec URL na stronę, którą czytasz najczęściej (na przykład *://*.example-news.com/*), wklej wszystkie trzy bloki CSS do panelu CSS i zapisz. Każdy pasujący artykuł otwiera się teraz automatycznie w twoim osobistym trybie czytnika.

Spokojne tło

Czysta biel przy pełnej jasności jest ostra wieczorem. Miękki kremowy ton redukuje odblask bez utraty kontrastu ciężkiego ciemnego motywu:

html, body, article {
  background: #f6f1e6 !important;
  color: #2b2620 !important;
}
article a { color: #7a4a1f !important; }

Stąd możesz dalej dopracowywać: przypiąć spis treści, dodać podświetlenie skupienia do bieżącego akapitu lub nałożyć plakietkę czasu czytania. Przejrzyj nasze gotowe przykłady, aby zdobyć więcej punktów wyjścia, zobacz towarzyszący tekst o ustawieniu szerokości kolumny dokładnie tak jak trzeba i pobierz JustZix, jeśli jeszcze tego nie zrobiłeś. Tryb czytnika po twojemu.