Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

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

Chcesz uczynić twoją witrynę WordPress bardziej dostępną, ale zmagasz się ze zmianą rozmiaru pisma? Chociaż istnieją funkcje powiększania w przeglądarkach, często psują one układ Twojej witryny i powodują frustrujące wrażenia dla użytkowników, którzy potrzebują większego tekstu 😞

Pomogliśmy tysiącom początkujących użytkowników WordPress poprawić wygląd ich witryn. Oto, czego się nauczyliśmy: odpowiedni zmieniacz wielkości pisma powinien umożliwiać odwiedzającym dostosowanie rozmiaru tekstu bez zniekształcania innych elementów strony.

Ta pozornie niewielka funkcja może mieć ogromny wpływ na zaangażowanie odwiedzających w twoją treść.

W tym przewodniku pokażemy ci dwa sprawdzone sposoby na dodanie krój pisma do twojej witryny WordPress – jeden dla klasycznych motywów i drugi, który działa z dowolnym motywem. Obie metody są przyjazne dla początkujących i nie zepsują wyglądu twojej witryny.

How to add resizeable text for site visitors in WordPress

Czy importowanie tekstu o zmiennym rozmiarze na twoją witrynę internetową jest ważne? 🤔

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 najlepszej wielkości czcionki w WordPress 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 projektu WordPress na stronie, a nie tylko tekstu. Może to zepsuć układ witryny internetowej i nie zapewnić doskonałego doświadczenia użytkownika.

To powiedziawszy, zobaczmy, jak możesz łatwo dodać tekst o zmiennym rozmiarze dla twoich odwiedzających w WordPress. Możesz użyć szybkich odnośników poniżej, aby przejść do konkretnej metody:

Metoda 1: Dodanie zmiany rozmiaru czcionki WordPress za pomocą wtyczki i kodu

Jednym z łatwych sposobów na umożliwienie użytkownikom zmiany wielkości tekstu na twojej witrynie internetowej jest użycie wtyczki WordPress do zmiany wielkości pisma, 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.

Add an accessibility widget block

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.

Change accessibility widget settings

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:

Change text size preview

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.

Opening the WordPress theme customizer for classic themes

Powinieneś teraz zobaczyć kilka opcji, aby dostosować swój klasyczny motyw.

Tutaj wybierz „Dodatkowy CSS”.

Opening the Additional CSS tab in Theme Customizer

Teraz możesz dodać kod CSS, aby nadać widżetowi styl. Oto co dodaliśmy:

1
2
3
4
5
.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.

Adding additional CSS to a classic theme to style the accessibility widget

Metoda 2: Użyj wtyczki WordPress Accessibility Plugin

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.

WP Accessibility Settings

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”.

WP Accessibility toolbar settings

To wszystko!

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

Gif of how the WP Accessibility plugin works

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:

Film instruktażowy

Subscribe to WPBeginner

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 naszym wyborem najlepszych kreatorów stron WordPress typu „przeciągnij i upuść ” oraz naszym kompletnym przewodnikiem po aktualizacjach motywów WordPress.

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.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

7 komentarzyLeave a Reply

  1. 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!

      Admin

  2. 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

  3. 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

  4. Eric Paquette

    is it possible to make the A A A bigger ?

  5. 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?

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.