Jak dodać zmianę rozmiaru czcionki w WordPress dla ułatwienia dostępu?

Czy chcesz umożliwić odwiedzającym zmianę rozmiaru tekstu na twojej witrynie internetowej WordPress?

Celem oferowania zmiany rozmiaru pisma jest zapewnienie odwiedzającym o słabym wzroku łatwiejszego sposobu na dostosowanie wielkości liter bez naruszania układu witryny internetowej. Pomaga to zwiększyć dostępność.

W tym artykule pokażemy, jak dodać tekst o zmiennym rozmiarze dla odwiedzających witrynę w WordPress.

Dlaczego warto dodać tekst o zmiennym rozmiarze do twojej witryny internetowej?

Znalezienie odpowiedniego kroju pisma dla twojej witryny internetowej WordPress jest ważne, ponieważ odgrywa on ogromną rolę w uatrakcyjnianiu witryny i pomaga importerom w czytaniu twoich treści.

Czasami jednak wybór najlepszego kroju pisma dla twojej witryny internetowej może nie wystarczyć. Jeśli rozmiar pisma jest mały, ludzie będą mieli trudności z czytaniem twoich artykułów i ostatecznie porzucą twoją witrynę.

Łatwiejszym sposobem na poprawę czytelności jest zaoferowanie odwiedzającym opcji zmiany rozmiaru głównego tekstu na twojej witrynie internetowej. Dzięki temu użytkownicy mogą dostosować rozmiar tekstu do swoich upodobań i spędzić więcej czasu na twojej witrynie.

Mimo że można użyć wbudowanej funkcji powiększania przeglądarki, naciskając klawisz „CTRL i +”, zwiększa ona rozmiar każdego elementu na stronie, a nie tylko tekstu. Może to zepsuć układ witryny internetowej i nie zapewnić doskonałych wrażeń użytkownika.

To powiedziawszy, zobaczmy, jak możesz łatwo dodać tekst o zmiennym rozmiarze dla twoich odwiedzających w WordPress.

Film instruktażowy

Jeśli wolisz instrukcje pisemne, po prostu czytaj dalej. Możesz skorzystać z poniższych odnośników, aby przejść do konkretnej metody:

Metoda 1: Dodanie tekstu o zmiennym rozmiarze w WordPress (tylko klasyczne motywy WordPress)

Najprostszym sposobem na umożliwienie użytkownikom zmiany rozmiaru tekstu na twojej witrynie internetowej jest użycie wtyczki WordPress, takiej jak Accessibility Widget.

Jest to darmowa wtyczka WordPress, która pozwala dodać opcję do panelu bocznego twojej witryny, aby zmienić rozmiar tekstu. Wtyczka jest lekka i bardzo łatwa w użyciu.

Należy jednak pamiętać, że wtyczka Accessibility Widget nie jest zgodna [może być też „kompatybilna”] z motywami Full Site Editing i blokowymi, więc będzie działać tylko w przypadku korzystania z klasycznego motywu.

Pierwszą rzeczą, którą musisz zrobić, jest zainstalowanie i włączanie wtyczki Accessibility Widget na twojej witrynie internetowej. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem na temat instalacji wtyczki WordPress.

Po włączaniu wystarczy przejść do Wygląd ” Widżet z panelu administracyjnego WordPress. Następnie możesz kliknąć przycisk „+” i dodać blok „Widżet dostępności” do twojego panelu bocznego.

Następnie możesz wpisz tytuł widżetu, na przykład „Zmień rozmiar tekstu” lub „Zmień rozmiar tekstu”.

Następnie należy wybrać, na które elementy HTML lub klasy CSS widżet będzie miał wpływ. Domyślne opcje to body, akapit, elementy listy i komórki tabeli. Opcje te powinny być odpowiednie dla większości witryn internetowych.

Widżet umożliwia maksymalnie cztery opcje zmiany rozmiaru. Domyślne opcje to 90%, 100%, 110% i 120%. Można zwiększać lub zmniejszać wielkości liter, wpisz cyfry w polu „Ustaw na te rozmiary”.

Ostatnim ustawieniem widżetu jest tekst kontrolera i jest to tekst, który zobaczą użytkownicy. Możesz zachować domyślne wartości procentowe dla rozmiaru tekstu lub użyć litery, aby wyświetlić różne rozmiary pisma.

Po zakończeniu kliknij przycisk „Aktualizuj”, aby zapisać twoje ustawienia widżetu.

Możesz teraz przejść na twoją witrynę internetową, aby zobaczyć widżet w działaniu. Tak powinien wyglądać widżet na panelu bocznym twojej witryny internetowej:

Jeśli uważasz, że tekst kontrolera nie jest godny powiadomienia, możesz to zmienić za pomocą CSS.

Na przykład, dodaj ten kod CSS do arkusza stylów twojego motywu:

.widget_accesstxt a {
border: 2px solid #000;
padding: 2px;
font-weight: bold;
}

Ten CSS doda obramowanie wokół tekstu kontrolera, pogrubi go i doda trochę dopełnienia. Aby uzyskać więcej informacji, zapoznaj się z naszym przewodnikiem na temat dodawania własnego CSS w WordPress.

Metoda 2: Dodawanie tekstu o zmiennym rozmiarze w WordPress (wszystkie motywy WordPress)

Innym prostym sposobem na umożliwienie użytkownikom zmiany rozmiaru tekstu na twojej witrynie internetowej jest użycie WP Accessibility. Wtyczka ta umożliwia dodanie paska narzędzi do witryny w celu zmiany rozmiaru tekstu, niezależnie od używanego przez ciebie motywu.

Pierwszą rzeczą, którą musisz zrobić, jest zainstalowanie i włączanie wtyczki WP Accessibility na twojej witrynie internetowej. Jeśli potrzebujesz pomocy, zapoznaj się z naszym przewodnikiem na temat instalacji wtyczki WordPress.

Po włączaniu wystarczy przejść do strony WP Accessibility z panelu administracyjnego WordPress.

W sekcji „Pasek narzędzi dostępności” kliknij opcję „Włącz pasek narzędzi dostępności” i wybierz „Wielkość liter”. Spowoduje to dodanie zmiany rozmiaru pisma do paska narzędzi.

W razie potrzeby można również włączyć opcje Kontrast i Skala szarości.

Dodatkowo można zmienić wielkość litery treści po kliknięciu paska narzędzi. Możesz także wybrać „Domyślny rozmiar” z menu rozwijanego, jeśli nie jesteś pewien, co wybrać.

Poza tym zalecamy włączenie opcji „Użyj alternatywnego arkusza stylów zmiany rozmiaru pisma”. Gdy ta opcja jest włączona, użytkownicy mogą łatwo przełączać się między domyślnymi wielkościami liter a większą, bardziej czytelną wersją tekstu.

Zachęcamy do włączania innych ustawień we wtyczce.

Po zakończeniu kliknij przycisk „Aktualizuj ustawienia paska narzędzi”.

To wszystko!

Oto jak wygląda nasz pasek narzędzi do zmiany rozmiaru pisma na front-endzie:

Aby uzyskać więcej informacji, możesz przeczytać nasz przewodnik na temat tego, jak poprawić dostępność twojej witryny WordPress.

Mamy nadzieję, że ten artykuł pomógł ci dodać tekst o zmiennym rozmiarze do twojej witryny WordPress. Możesz również zapoznać się z naszym przewodnikiem na temat tego, jak poprawić wydajność twojej witryny WordPress i najlepszych wtyczek WooCommerce.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.