Jak w prosty sposób dodawać niestandardowe czcionki do WordPressa?

Dodanie większej liczby czcionek do komputera jest dość proste. Po prostu pobierz pliki do katalogu czcionek, a następnie możesz zacząć używać ich w wybranym oprogramowaniu i aplikacjach.

Jeśli jednak chcesz używać niestandardowych czcionek w swojej witrynie, zwłaszcza tych krojów pisma, których odwiedzający mogli nie zainstalować na swoich urządzeniach, sprawa staje się nieco bardziej skomplikowana.

Na szczęście, jako użytkownik WordPressa, istnieje kilka świetnych bezpłatnych narzędzi, których możesz użyć do dodawania pojedynczych czcionek lub całej ich biblioteki do swojej witryny. Po udostępnieniu czcionek w motywie możesz zacząć stosować je do różnych stylów używanych w witrynie.

W tym artykule pokażemy Ci, gdzie możesz znaleźć wysokiej jakości czcionki bezpłatne i premium, jak dodać je do witryny WordPress, a także kilka narzędzi, które pomogą Ci wybrać odpowiednie ustawienia dla każdego kroju pisma w Twojej witrynie.

Gdzie znaleźć czcionki do swojej witryny

Zanim przejdziemy do instrukcji dotyczących dodawania niestandardowych czcionek do witryny WordPress, przyjrzyjmy się niektórym miejscom, w których można znaleźć nowe kroje czcionek, aby zmodyfikować wygląd tekstu w witrynie.

Dostępne są świetne bezpłatne zasoby online, w których można znaleźć czcionki typu open source , których można swobodnie używać w całej witrynie. Niektóre zasoby, które możesz chcieć poznać, obejmują:

• Czcionki Google: przeglądaj ponad 600 czcionek open source, które zostały zoptymalizowane pod kątem internetu. Korzystanie z tych czcionek w witrynie WordPress jest bardzo łatwe, o czym wkrótce omówimy.
• Font Squirrel: kolejne duże repozytorium darmowych czcionek.
• Edge Web Fonts: kolekcja bezpłatnych czcionek internetowych obsługiwanych przez Adobe Typekit.
• Typekit: profesjonalna kolekcja ponad 4000 darmowych i premium czcionek firmy Adobe do użytku w Internecie i w druku.

Jak widać, istnieje wiele legalnych źródeł internetowych darmowych i premium czcionek, których możesz użyć do dostosowania wyglądu swojej witryny WordPress.

Narzędzia typograficzne dla projektantów stron internetowych

Wybór odpowiedniego zestawu czcionek dla Twojej witryny może być trudny. W tym procesie chodzi o coś więcej niż tylko wybranie jednej lub dwóch czcionek , które lubisz, a następnie dodanie ich do swojej witryny.

Musisz wziąć pod uwagę nie tylko wygląd czcionki, ale także rozmiar, jaki wybierzesz, jak szeroki jest obszar treści na Twojej stronie i jaka jest optymalna wysokość linii dla każdego kroju.

Na szczęście istnieje kilka bezpłatnych narzędzi online, których możesz użyć, aby pomóc we właściwym zastosowaniu wybranych czcionek. Dzięki temu Twoje treści będą wyglądać jak najlepiej .

Jednym z zasobów internetowych, na które zdecydowanie powinieneś rzucić okiem podczas dostosowywania czcionek w swojej witrynie, jest Kalkulator typografii Golden Ratio. To narzędzie typograficzne, od twórcy Thesis Framework, pozwala wprowadzić rozmiar czcionki, a następnie szerokość obszaru zawartości. Narzędzie obliczy następnie idealne ustawienia typograficzne dla konkretnej konfiguracji witryny.

Type Scale to kolejne narzędzie online, które ułatwia ustalenie, jaki rozmiar powinny mieć różne style tekstu w Twojej witrynie. Po wprowadzeniu podstawowego rozmiaru czcionki, takiego jak rozmiar tekstu akapitu w witrynie, dowiesz się, jaki rozmiar powinien mieć każdy z różnych nagłówków .

Do wyboru jest kilka skal, w tym powyższy Złoty podział. Gdy będziesz zadowolony z ustawień, możesz szybko skopiować CSS do użytku we własnej witrynie.

Niestandardowe wtyczki czcionek WordPress

Tak jak istnieje wiele miejsc, w których można znaleźć czcionki online, istnieje również wiele sposobów na zintegrowanie ich z witryną WordPress. Aby jednak pomóc Ci jak najszybciej rozpocząć pracę , oto niektóre z najlepszych wtyczek związanych z czcionkami WordPress:

Łatwe czcionki Google

Easy Google Fonts to bezpłatna wtyczka, która umożliwia korzystanie z dowolnej z ponad 600 bezpłatnych czcionek z repozytorium Google w witrynie WordPress. Wtyczka współpracuje z narzędziem WordPress Customizer. Dzięki temu możesz wyświetlić podgląd zmian przed podjęciem ostatecznej decyzji o tym, których czcionek użyć w danym miejscu witryny.

Po zainstalowaniu i aktywacji wtyczki na swojej stronie możesz zacząć zmieniać czcionki używane przez Twój aktualny motyw WordPress. Aby to zrobić, przejdź do narzędzia WordPress Customizer i kliknij sekcję Typografia.

Po wyjęciu z pudełka wtyczka umożliwia zmianę ustawień typografii dla głównych stylów używanych w motywie. Może to obejmować akapit i poszczególne nagłówki. Jednak na stronie ustawień Easy Google Fonts możesz tworzyć niestandardowe elementy sterujące czcionkami . Są one następnie dodawane do interfejsu Customizer, co pozwala w łatwy sposób zmienić czcionkę używaną przez takie elementy, jak listy, cytaty i inne.

Po dodaniu niestandardowej kontrolki czcionki możesz uzyskać do niej dostęp w ustawieniach Typografia motywu w programie Customizer.

Korzystając z tej funkcji wtyczki, możesz modyfikować czcionki używane przez dowolny element lub styl motywu WordPress. Kontrolki dodawane do Customizer obejmują również grubość czcionki, dekorację tekstu i właściwości przekształcania, a także kolor czcionki, kolor tła, rozmiar, wysokość linii i odstępy między literami.

Łącząc niestandardowe ustawienia czcionek ze szczegółowymi ustawieniami w ofercie, wtyczka Easy Google Fonts otwiera cały świat możliwości, jeśli chodzi o modyfikowanie wyglądu tekstu w witrynie WordPress, a wszystko to bez potrzeby bezpośredniej edycji jakiegokolwiek kodu.

Użyj dowolnej czcionki

Powyższa wtyczka Easy Google Fonts jest wysoce zalecana. Ma jednak jedną wadę: możesz używać tylko krojów pisma z kolekcji Google Fonts. Jeśli żadna z tych 686 czcionek nie jest atrakcyjna lub chcesz użyć niestandardowego kroju czcionki , równie darmowa wtyczka Use Any Font jest dobrą alternatywą.

Po zainstalowaniu i aktywacji wtyczki możesz przesłać jedną lub więcej czcionek do swojej witryny bezpośrednio z komputera. Jednak zanim zaczniesz, musisz zarejestrować się w celu uzyskania darmowego klucza API (lub dokonać darowizny), który połączy wtyczkę z narzędziem do konwersji czcionek.

Po przesłaniu co najmniej jednej czcionki możesz przypisać ją do określonych elementów witryny. Obejmuje to listę elementów domyślnych, a także wszelkie zdefiniowane przez Ciebie elementy niestandardowe.

Wtyczka dodaje również kilka kontrolek czcionek do edytora postów WordPress . Ułatwia to zmianę czcionek używanych w Twoich postach i stronach, indywidualnie, a nie globalnie.

Po przypisaniu czcionki możesz wyświetlić zmiany w typografii, odwiedzając fronton swojej witryny. Chociaż elementy sterujące tej wtyczki nie są porównywalne z tymi oferowanymi przez wtyczkę Easy Google Fonts, jeśli chcesz po prostu zmienić czcionki używane przez określone elementy motywu na wybraną czcionkę niestandardową, użyj dowolnej czcionki praca ładnie.

Czcionki Typekit dla WordPress

Jeśli chcesz korzystać z darmowych i premium czcionek z usługi Adobe Typekit w swojej witrynie WordPress, to bezpłatna wtyczka Typekit Fonts for WordPress jest dla Ciebie.

Dzięki tej wtyczce możesz użyć predefiniowanych selektorów lub dodać własne niestandardowe reguły CSS . Gwarantuje to, że niezależnie od części witryny, którą chcesz spersonalizować za pomocą czcionki Typekit, możesz to zrobić za pomocą tej wtyczki.

Ręczne dodawanie niestandardowych czcionek do WordPressa

Jeśli z jakiegoś powodu pomysł korzystania z jednej z powyższych darmowych wtyczek nie przemawia do Ciebie, zawsze możesz ręcznie zmienić czcionki używane w witrynie WordPress. Jeśli czcionkę, której chcesz użyć, można znaleźć w repozytorium Google Fonts, dodanie jej do swojej witryny jest bardzo łatwe.

Wystarczy, że wybierzesz czcionkę na stronie Google, a następnie skopiujesz odpowiedni kod do sekcji head i arkusza stylów CSS swojej witryny.

Jeśli jednak wybrana czcionka nie jest hostowana w repozytorium , takim jak Google Fonts, gdzie możesz po prostu utworzyć do niej link, musisz samodzielnie hostować czcionkę. Zmienia to nieco proces i dodaje kilka dodatkowych kroków, takich jak przesłanie czcionki na serwer.

Możesz przesłać plik czcionki za pomocą oprogramowania FTP lub narzędzia do zarządzania plikami w panelu sterowania hosta internetowego. Dobrym pomysłem jest przesłanie czcionki do dedykowanego katalogu czcionek , najlepiej do folderu motywów podrzędnych, aby utrzymać porządek.

Gdy plik czcionki znajdzie się na serwerze, otwórz plik arkusza stylów CSS motywów do edycji. Można to zrobić z poziomu pulpitu administracyjnego WordPress na ekranie Wygląd > Edytor.

Po dodaniu powyższego CSS do arkusza stylów, aby załadować czcionkę, możesz użyć go w dowolnym miejscu tego pliku CSS, aby zmodyfikować wygląd tekstu, jak poniżej:

Ze względu na wydajność, jeśli to możliwe, powinieneś spróbować połączyć się z zewnętrznym repozytorium czcionek, takim jak Google Fonts. Jeśli jednak nie możesz znaleźć czcionki, której chcesz użyć w Internecie, być może będziesz musiał poświęcić część szybkości strony, samodzielnie hostując plik.

Wniosek

Mamy nadzieję, że teraz wiesz, gdzie znaleźć niestandardowe czcionki, a także jak zacząć dodawać je do swojej witryny WordPress. Korzystając z jednej z bezpłatnych wtyczek, takich jak Easy Google Fonts, możesz zacząć zmieniać nie tylko czcionki używane w Twojej witrynie, ale także sposób ich prezentacji .

Dzięki narzędziu WordPress Customizer możesz teraz w łatwy sposób wprowadzać zmiany w wyglądzie tekstu na swojej stronie. Wszystko to odbywa się za pomocą zestawu wizualnych menu, wraz z podglądem na żywo.

Jeśli Twój obecny motyw nie daje Ci dużej kontroli nad czcionkami używanymi w Twojej witrynie, korzystając z jednej z powyższych metod, masz teraz łatwy sposób na wprowadzenie tych zmian, bez samodzielnej edycji żadnego z podstawowych arkuszy CSS.

Jakie są twoje ulubione czcionki? Jakie ustawienia typograficzne w swojej witrynie chcesz zmienić? Jeśli masz jakiekolwiek pytania dotyczące czcionek, typografii lub ogólnie WordPressa, podziel się nimi w komentarzach poniżej.