Czy starasz się, aby twoja witryna WordPress była naprawdę dostępna dla wszystkich użytkowników? Prawdopodobnie słyszałeś o programach do zmiany rozmiaru pisma, ale wdrożenie takiego, który faktycznie działa bez naruszania układu twojej witryny, może być prawdziwym wyzwaniem.
Wielu właścicieli witryn WordPress zakłada, że funkcje powiększania w przeglądarce są wystarczające, ale często zniekształcają elementy strony i powodują słabe wrażenia użytkownika. To, czego potrzebujesz, to krój pisma, który umożliwia odwiedzającym łatwe dostosowanie wielkości tekstu, nie mając wpływu na inne elementy strony.
Po latach prowadzenia WPBeginner przekonaliśmy się na własnej skórze, że bez odpowiednich funkcji ułatwień dostępu ryzykujesz alienację znacznej części twojej publiczności. Dlatego też opracowaliśmy dwa niezawodne sposoby na dodanie funkcji zmiany kroju pisma do twojej witryny internetowej 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 pełną edycją witryny i motywami blokowymi, więc będzie działać tylko w przypadku korzystania z klasycznego motywu. Będziesz wiedział, że używasz motywu blokowego, jeśli w twoim panelu administracyjnym WordPress brakuje konfiguratora motywów.
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.
Aby to zrobić, po prostu przejdź do swojego panelu administracyjnego WordPress i wybierz Wygląd „ Dostosuj.
Powinieneś teraz zobaczyć kilka opcji, aby dostosować swój klasyczny motyw.
Tutaj wybierz „Dodatkowy CSS”.
Teraz możesz dodać kod CSS, aby nadać widżetowi styl. Oto co dodaliśmy:
.widget_accesstxt a {
border: 2px solid #000;
padding: 2px;
font-weight: bold;
}
CSS doda obramowanie wokół tekstu kontrolera, pogrubi go i doda trochę dopełnienia. Gdy będziesz zadowolony z wyglądu widżetu, po prostu kliknij „Opublikuj”.
Więcej szczegółów można znaleźć w naszym przewodniku na temat dodawania własnych 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.
Spraw, by twoja witryna WordPress była jeszcze łatwiejsza w obsłudze dzięki tym wskazówkom
Chcesz, aby twoja witryna była łatwiejsza w użyciu i wyglądała świetnie? Sprawdź te pomocne przewodniki:
- How to Add Arrow-Key Keyboard Navigation in WordPress – Ułatw użytkownikom poruszanie się po twojej witrynie.
- Jak dostosować kolory na Twojej witrynie internetowej WordPress – Wybierz odpowiednie kolory, aby Twoja witryna wyglądała dobrze i była łatwa do odczytania.
- How to Add a Preloader Animation to WordPress (Step by Step) – Dodaj fajny ekran wczytywania do twojej witryny.
- Jak łatwo dodać tryb ciemny do twojej witryny internetowej WordPress – Pozwól użytkownikom przełączyć się na ciemniejszy motyw, jeśli wolą.
- Sposoby na stworzenie witryny WordPress przyjaznej dla urządzeń mobilnych – Upewnij się, że twoja witryna działa dobrze na telefonach i tabletach.
- Jak uzyskać uwagi na temat projektu witryny internetowej w WordPress (krok po kroku) – Dowiedz się, jak zapytać ludzi, co myślą o projekcie twojej witryny.
- Jak wyróżnić tekst w WordPress (przewodnik dla początkujących) – Naucz się wyróżniać ważne słowa na swoich stronach.
Mamy nadzieję, że ten artykuł pomógł ci dodać tekst o zmiennym rozmiarze do twojej witryny WordPress. Zachęcamy również do zapoznania się z naszymi najlepszymi kreatorami stron WordPress typu „przeciągnij i upuść ” oraz naszym przewodnikiem na temat tego , jak zaktualizować twój motyw WordPress bez utraty własnych konfiguratorów.
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.
Shushanna
Hi, thanks for the amazing post. I wonder if your site does not have a sidebar, is it possible to to put the widget somewhere else, for example above the navigation.
WPBeginner Support
You can place it in your theme’s widget areas if your theme has widget areas available!
Administrator
Jasper
I have installed the widget but don’t have the Set Controller Text box so on the website it shows the %s.
Any sugestions? Thanks
Ivo
Hi, I followed the instructions as on the video but noting happens. Please help.
I actually wont it to make my girlfriend site to be zoom-able when open in mobile devices. Please suggest…
Regards,
Ivo
Eric Paquette
is it possible to make the A A A bigger ?
Wrenling
This widget is AMAZING, thank you so much!!
I’m curious, I added it to my blog and it is EXACTLY what I wanted, but it only affects the main page of the blog – if you click on an individual post, the widget disappears. Can you tell me how to fix this?
WPBeginner Support
Your WordPress theme probably uses different sidebars for main page and single posts.
Administrator