Cara Menambahkan Font Kustom ke WordPress dengan Cara Mudah

Menambahkan lebih banyak font ke komputer Anda cukup mudah. Cukup unduh file ke direktori font Anda, dan kemudian Anda dapat mulai menggunakannya di perangkat lunak dan aplikasi pilihan Anda.

Namun, jika Anda ingin menggunakan font khusus di situs web Anda, terutama tipografi yang mungkin belum diinstal pengunjung Anda di perangkat mereka, itu menjadi sedikit lebih rumit.

Untungnya, sebagai pengguna WordPress, ada beberapa alat gratis hebat yang dapat Anda gunakan untuk menambahkan font individual , atau seluruh pustakanya ke situs web Anda. Setelah font tersedia untuk tema Anda, Anda dapat mulai menerapkannya ke berbagai gaya yang digunakan di situs web Anda.

Pada artikel ini kami akan menunjukkan kepada Anda di mana Anda dapat menemukan font gratis dan premium berkualitas tinggi, cara menambahkannya ke situs web WordPress Anda, ditambah beberapa alat untuk membantu Anda memilih pengaturan yang tepat untuk setiap jenis huruf di situs web Anda.

Di mana Menemukan Font untuk Situs Web Anda

Sebelum kita sampai pada instruksi yang membahas bagaimana Anda dapat menambahkan font kustom ke situs WordPress Anda, mari kita lihat beberapa tempat di mana Anda dapat menemukan tipografi baru untuk mengubah tampilan teks di situs Anda.

Ada beberapa sumber online gratis yang bagus yang tersedia, di mana Anda dapat menemukan font sumber terbuka yang dapat digunakan secara bebas di seluruh situs web Anda. Beberapa sumber daya yang mungkin ingin Anda jelajahi meliputi:

• Google Fonts: jelajahi lebih dari 600 font open source yang telah dioptimalkan untuk web. Menggunakan font ini di situs WordPress Anda sangat mudah, karena kami akan segera membahasnya.
• Font Squirrel: gudang besar font gratis lainnya.
• Edge Web Fonts: kumpulan font web gratis yang didukung oleh Adobe Typekit.
• Typekit: koleksi profesional lebih dari 4.000 font gratis dan premium dari Adobe, untuk digunakan di web dan dicetak.

Seperti yang Anda lihat, ada banyak sumber online yang sah untuk font gratis dan premium yang dapat Anda gunakan untuk menyesuaikan tampilan situs web WordPress Anda.

Alat Tipografi untuk Desainer Web

Memilih set font yang tepat untuk situs web Anda bisa jadi sulit. Ada lebih banyak proses daripada hanya memilih satu atau dua font yang Anda suka, dan kemudian menambahkannya ke situs web Anda.

Anda tidak hanya harus mempertimbangkan tampilan font, tetapi juga ukuran yang akan Anda pilih, seberapa luas area konten di situs Anda, dan berapa tinggi garis optimal untuk setiap jenis huruf.

Untungnya, ada beberapa alat online gratis yang dapat Anda gunakan untuk membantu Anda menerapkan font pilihan Anda dengan benar. Ini kemudian memastikan konten Anda terlihat terbaik .

Salah satu sumber online yang harus Anda lihat dengan cepat saat menyesuaikan font di situs web Anda, adalah Kalkulator Tipografi Rasio Emas. Alat tipografi ini, dari orang di belakang Kerangka Tesis, memungkinkan Anda memasukkan ukuran font, diikuti dengan lebar area konten Anda. Alat ini kemudian akan menghitung pengaturan tipografi yang sempurna untuk konfigurasi situs web spesifik Anda.

Type Scale adalah alat online lain yang memudahkan untuk menentukan ukuran gaya teks yang berbeda di situs web Anda dalam kaitannya satu sama lain. Setelah memasukkan ukuran font dasar Anda, seperti ukuran teks paragraf di situs Anda, Anda kemudian akan mengetahui ukuran masing-masing judul yang berbeda harus diatur.

Ada sejumlah skala untuk dipilih, termasuk Rasio Emas di atas. Setelah Anda puas dengan pengaturannya, Anda dapat dengan cepat menyalin CSS untuk digunakan di situs web Anda sendiri.

Plugin Font Kustom WordPress

Sama seperti ada banyak tempat untuk menemukan font online, ada juga banyak cara untuk mengintegrasikannya ke situs WordPress Anda. Namun, untuk membantu Anda memulai secepat mungkin , berikut adalah beberapa plugin terkait font WordPress terbaik:

Google Font Mudah

Easy Google Fonts adalah plugin gratis yang memberi Anda kemampuan untuk menggunakan salah satu dari 600+ font gratis dari repositori Google di situs WordPress Anda. Plugin ini bekerja dengan alat Penyesuai WordPress. Ini memungkinkan Anda untuk melihat pratinjau perubahan Anda sebelum Anda membuat keputusan akhir tentang font mana yang akan digunakan di situs Anda.

Setelah menginstal dan mengaktifkan plugin di situs web Anda, Anda dapat mulai mengubah font yang digunakan oleh tema WordPress Anda saat ini. Untuk melakukannya, buka alat Penyesuai WordPress dan klik pada bagian Tipografi.

Di luar kotak, plugin memungkinkan Anda mengubah pengaturan tipografi untuk gaya utama yang digunakan oleh tema Anda. Ini dapat mencakup paragraf dan judul individu. Namun, melalui halaman pengaturan Easy Google Fonts, Anda dapat membuat kontrol font khusus . Ini kemudian ditambahkan ke antarmuka Customizer, memberi Anda cara mudah untuk mengubah font yang digunakan oleh elemen seperti daftar, kutipan, dan banyak lagi.

Setelah Anda menambahkan kontrol font kustom, Anda kemudian dapat mengaksesnya dari pengaturan Tipografi Tema di Customizer.

Dengan menggunakan fitur plugin ini, Anda kemudian dapat memodifikasi font yang digunakan oleh salah satu elemen atau gaya tema WordPress Anda. Kontrol yang ditambahkan ke Customizer juga mencakup bobot font, dekorasi teks dan properti transformasi, serta warna font, warna latar belakang, ukuran, tinggi baris, dan spasi huruf.

Dengan menggabungkan kontrol font khusus dengan pengaturan terperinci yang ditawarkan, plugin Easy Google Fonts membuka banyak kemungkinan untuk memodifikasi tampilan teks di situs WordPress Anda, semuanya tanpa perlu mengedit kode apa pun secara langsung.

Gunakan Font Apa Saja

Plugin Easy Google Fonts di atas sangat direkomendasikan. Namun, ia memiliki satu kelemahan: Anda hanya dapat menggunakan tipografi dari koleksi Google Fonts. Jika tidak satu pun dari 686 font tersebut menarik, atau Anda ingin menggunakan jenis huruf khusus , maka plugin Use Any Font yang sama-sama gratisnya adalah alternatif yang baik.

Setelah menginstal dan mengaktifkan plugin, Anda dapat mengunggah satu atau lebih font ke situs web Anda, langsung dari komputer Anda. Namun, sebelum memulai, Anda harus mendaftar untuk mendapatkan kunci API gratis (atau berdonasi), yang akan menghubungkan plugin ke alat konversi font.

Setelah Anda mengunggah setidaknya satu font, Anda kemudian dapat menetapkannya ke elemen tertentu dari situs web Anda. Ini termasuk daftar elemen default, serta elemen kustom yang Anda tentukan.

Plugin ini juga menambahkan beberapa kontrol font ke editor posting WordPress . Ini memudahkan untuk mengubah font yang digunakan dalam posting dan halaman Anda, secara individual, bukan secara global.

Setelah menetapkan font, Anda dapat melihat perubahan tipografi Anda dengan mengunjungi ujung depan situs web Anda. Meskipun kontrol plugin ini tidak dapat dibandingkan dengan yang ditawarkan dari plugin Easy Google Fonts, jika Anda hanya ingin mengubah font yang digunakan oleh elemen tertentu dari tema Anda menjadi font kustom pilihan Anda, maka Use Any Font melakukannya pekerjaan dengan baik.

Font Typekit untuk WordPress

Jika Anda ingin menggunakan font gratis dan premium dari layanan Adobe Typekit di situs WordPress Anda, maka plugin Typekit Fonts for WordPress gratis adalah untuk Anda.

Dengan plugin ini, Anda dapat menggunakan pemilih yang telah ditentukan sebelumnya, atau menambahkan aturan CSS khusus Anda sendiri . Ini memastikan bahwa bagian mana pun dari situs web Anda yang ingin dipersonalisasi dengan font Typekit, Anda bebas melakukannya dengan plugin ini.

Menambahkan Font Kustom ke WordPress Dengan Tangan

Jika karena alasan apapun, ide untuk menggunakan salah satu plugin gratis di atas tidak menarik, Anda selalu dapat mengubah font yang digunakan di situs WordPress Anda dengan tangan. Jika font yang ingin Anda gunakan dapat ditemukan di repositori Google Fonts, maka menambahkannya ke situs web Anda sangat mudah.

Yang harus Anda lakukan adalah memilih font di situs web Google, lalu salin kode yang relevan ke bagian kepala dan lembar gaya CSS situs web Anda.

Namun, jika font pilihan Anda tidak dihosting di repositori seperti Google Fonts, di mana Anda dapat dengan mudah menautkannya, maka Anda harus menghosting font sendiri. Ini sedikit mengubah proses dan menambahkan beberapa langkah tambahan, seperti mengunggah font ke server Anda.

Anda dapat mengunggah file font menggunakan perangkat lunak FTP, atau alat pengelola file di panel kontrol host web Anda. Sebaiknya unggah font ke direktori font khusus , sebaiknya di folder tema anak Anda untuk membantu menjaga semuanya tetap teratur.

Setelah file font ada di server Anda, buka file stylesheet CSS tema Anda untuk diedit. Ini dapat dilakukan dari dalam dasbor admin WordPress Anda, pada layar Appearance > Editor.

Setelah Anda menambahkan CSS di atas ke stylesheet untuk memuat font, Anda kemudian dapat menggunakannya di mana saja di file CSS itu untuk mengubah tampilan teks seperti di bawah ini:

Untuk alasan kinerja, jika memungkinkan, Anda harus mencoba menautkan ke repositori font eksternal seperti Google Fonts. Namun, jika Anda tidak dapat menemukan font yang ingin Anda gunakan secara online, Anda mungkin harus mengorbankan sebagian kecepatan halaman Anda dengan menghosting file itu sendiri.

Kesimpulan

Semoga Anda sekarang tahu di mana menemukan font khusus, serta bagaimana mulai menambahkannya ke situs WordPress Anda. Dengan menggunakan salah satu plugin gratis, seperti Easy Google Fonts, Anda dapat mulai mengubah tidak hanya font yang digunakan di situs web Anda, tetapi juga bagaimana tipografi tersebut disajikan .

Berkat alat Penyesuai WordPress, kini Anda dapat dengan mudah membuat perubahan pada tampilan teks di situs web Anda. Ini semua terjadi melalui serangkaian menu visual, lengkap dengan pratinjau langsung.

Jika tema Anda saat ini tidak memberi Anda banyak kendali atas font mana yang digunakan di situs Anda, dengan menggunakan salah satu metode di atas, kini Anda memiliki cara mudah untuk membuat perubahan itu, tanpa mengedit sendiri CSS yang mendasarinya.

Apa font favorit Anda? Pengaturan tipografi apa di situs web Anda yang ingin Anda ubah? Jika Anda memiliki pertanyaan tentang font, tipografi, atau WordPress secara umum, silakan bagikan di komentar di bawah.