Cara Cepat Mengganti Font Blog WordPress – Dulu pada awal ngeblog saya sempat mempunyai anggapan bahwa cara mengganti font hanya bisa dilakukan di komputer saja. Tapi anggapan saya itu ternyata salah besar. Karena kenyataanya di blog juga baik WordPress ataupun Blogpsot bisa melakukan kegiatan tersebut.
Baca Juga : Trik Mudah Cara Memasang Script HTML Di WordPress
Cara Mengganti Font WordPress Gratisan
Daftar Isi :
Mengganti font di WordPress, caranya memiliki perbedaan antara WordPress gratisan dan WordPress berbayar (TLD). Hal perbedaan yang paling menonjol antara WordPress.com dan WordPress.org adalah modifikasi style CSS.
Mengganti font di WordPress hanya bisa Anda lakukan di editor theme. Dan itu sangat mustahil bisa melakukannya jika CMS blog masih menggunakan WordPress gratisan. Tapi untuk pengguna CMS WordPress.com jangan patah semangat dulu ! Karena font WordPress bisa diganti juga tanpa harus upgrade WordPress. Atas dasar keterbatasan editor, maka teknik mengganti font ini hanya bisa dijalankan di halaman posting dan widget text saja.
Bagi pengguna WordPress.com jika malas mengganti tema hanya untuk merubah jenis font yang akan dipasang di halaman posting. Maka langkah satu-satunya bisa memanfa’atkan cara ini. Yaitu memanggil font yang umum digunakan di komputer dengan menambah sedikit kode HTML.
Font umum yang biasanya sudah terpasang otomatis di komputer OS Windows adalah sebagai berikut :
| Jenis Huruf | Kode Huruf |
| Agency FB | Agency FB |
| Algerian | Algerian |
| Arial | Arial |
| Arial Narrow | Arial Narrow |
| Baskerville Old Face | Baskerville Old Face |
| Bauhaus 93 | Bauhaus 93 |
| Benguiat Bk BT | Benguiat Bk BT |
| Bernard MT Condensed | Bernard MT Condensed |
| Blackadder ITC | Blackadder ITC |
| Book Antiqua | Book Antiqua |
| Bradly Hand ITC | Bradly Hand ITC |
| Bremen Bd BT | Bremen Bd BT |
| Broadway | Broadway |
| Calibri | Calibri |
| Cambria | Cambria |
| Castellar | Castellar |
| Chiller | Chiller |
| Comic Sans MS | Comic Sans MS |
| Copperplate Gothic | Copperplate Gothic |
| Curlz MT | Curlz MT |
| Edwardian Script ITC | Edwardian Script ITC |
| Franch Script MT | Franch Script MT |
| Harlow Solid Italic | Harlow Solid Italic |
| Lucida Handwriting | Lucida Handwriting |
| Magneto | Magneto |
| Jockerman | Jockerman |
| Old English Text MT | Old English Text MT |
| Onyx | Onyx |
| Tekton Pro | Tekton Pro |
| Times New Roman | Times New Roman |
Selebihnya bisa Anda cari lagi di komputer pada C:\Windows\Fonts. Untuk kode HTML agar jenis-jenis font tertentu bisa diaktifkan pada halaman posting adalah sebagai berikut :
<span style="font-family: Kode Huruf">Disini Tulisannya</span>
Anda pasang kode HTML diatas pada mode Text halaman posting WordPress. Jika ingin sedikit dimodifikasi dengan menambahkan warna, ukuran, bayangan, ketebalan pada huruf. Contoh seperti di bawah ini :
Disini Tulisannya
Maka kodenya kira-kira seperti ini :
<span style="font-family: Agency FB; color: #FF0000; font-size: 100px; font-weight: bold; text-shadow: 4px 4px 8px #000;">Disini Tulisannya</span>
Silakan Anda sesuaikan dengan kebutuhan setiap kode HTML yang berwarna merah.
Cara Mengganti Font WordPress Berbayar (TLD)
Cara Mengganti Font WordPress Berbayar atau blog Top Level Domain (TLD) ini sangat mudah. Anda tinggal mengoprek CSS Theme yang Anda gunakan. Dan sebenarnya langkah diataspun bisa Anda terapkan di blog WordPress Berbayar Anda. Namun kelemahannya jika Anda tidak menginstall font yang Anda gunakan di root theme, maka font tersebut tidak bisa berjalan dengan normal di komputer yang tidak terpasang font yang sama dengan font yang Anda tentukan.
Untuk menghindari hal tersebut dalam Cara Mengganti Font WordPress TLD, Anda bisa memanfa’atkan pihak ketiga. Banyak sekali pihak ketiga untuk mendukung Cara Mengganti Font WordPress, baik yang berbayar maupun yang gratis. Contoh WEB penyedia Font gratis yang bisa dipasang di CMS WordPress Anda adalah Google Fonts. Font yang disediakan di Goggle Fonts lumayan banyak juga jenisnya, Anda bisa memilih dan menentukan berbagai macam pilihan Font yang disediakan di Google Fonts.
Cara Mengganti Font WordPress Berbayar Dengan Google Fonts
Mengganti font WordPress.org sebetulnya cara diataspun bisa diterapkan juga. Namun selain itu kita bisa memanfa’atkan pihak ketiga. Dan disini saya akan memberi contoh menggunakan Google Fonts. Silakan Anda klik untuk menuju ke WEB Google Fonts.
Pada kolom pencarian di Google Fonts, Anda ketik jenis font yang ingin Anda terapkan di WordPress, contoh saya akan menggunakan jenis Font Bree Serif. Setelah Anda menemukan jenis font yang cocok, selanjutnya klik Quick-use.
Geser kursor kebawah, nanti Anda akan menemukan tiga jenis script untuk ditambahkan di WordPress (Standard, @import, dan Javascript).
Silakan pilih Standard lalu copy scriptnya dan paste di theme editor Anda pada header.php. Tepatnya di bawah kode <head>.
Untuk menjalankan font yang sudah Anda tentukan di Google Fonts, Anda tinggal rubah jenis font default theme Anda pada style.css dengan format sebagai berikut :
font-family: 'Bree Serif', serif;
Contoh jika Anda ingin mengganti Font default theme pada heading H1, maka Anda bisa menggunakan script sebagai berikut pada style.css :
h1 {
font-family: 'Bree Serif', serif;
font-weight: 400;
font-size: 16px;
color: #526f94;
}Mungkin hanya itu Cara Cepat Mengganti Font Blog WordPress baik untuk WordPress.com dan juga WordPress.org.
dimana ?
Dimana saja.
Thanks ka infonya ya :) Izin s hare..
Ok. Kalau share diblog jangan lupa untuk mencantumkan link sumbernya ya!
Thanks guys infonya :)
Sama-sama guys.
kenapa di wp saya scriptnya gak jalan ya?
Script yang mana mas yang ga jalan?
Sudah berhasil mas.. Terima kasih ^^
bro kok gak jalan sama skali ya code font nya, kalau d html sih mau.
apa karena WP saya gratisan ya? atau ada pengaruh dari theme yang saya pilih?
tx saya tunggu balsan nya
WordPress gratisan tidak bisa mas. WordPress.com hanya bisa menggunakan font yang umum saja atau yang sudah biasa terpasang di Komputer Windows seperti Arial, Tahoma, dan lain-lain. Coba mas baca lagi deh artikel diatas.
mas admin, ada gak sih cara menguba size text di postingan. wordpress?
dan bila beli domain di wordpress seharga 18$ itu permanent ataou ada jangka waktunya?
Jika mas menggunakan WordPress self hosted (berbayar) silahkan mas rubah ukuran huruf postingan di dalam file
style.csspada selektorbodyatausingle-post. Untuk ukuran huruf rubahlah nilai padafont-size.Wih makasih ya mas. Informasi nya berguna sekali :)
Sangat bermanfaat bagi saya yang masih belajar.
makasih infonya gan. lagi nyari nih buat rubah font di blogku… kalau buat merubah ukuran huruf pake plug in google font bisa ga gan?
Bisa gan! Tinggal atur saja di style.css dengan menggunakan font-size. Lebih bagus lagi menggunakan font face. Caranya bisa dilihat pada artikel ini.
Mas kalau ngubah default font word press piye carane? Biar praktis gak tiap kali nulis mesti rubah-rubah.
Terimakasih
Kalau mas menggunakan WordPress Self Hosted gampang, mas tinggal mengubah pengaturan font dari
stye.csssaja. Mas bisa menggunakan Google Font atau Font Awesome.Halo mas, saya sudah coba mengedit style.css di blog saya, baik itu ukuran font maupun settingan yang mengubah tag H1-H6 jadi huruf besar semua (text-transform: uppercase;), tapi kok tidak berubah ya? Saya juga menggunakan Theme Point, di web info-menarik kok bisa ya? Apa itu ada trik khususnya mas? Mohon bantuannya, terimakasih sebelumnya
Saya sudah dan cek bisa gan. Yang agan ubah script ini kan?
h1, h2, h3, h4, h5, h6 { margin: 0; margin-bottom: 12px; color: #2A2A2A; font-weight: bold; text-transform: uppercase; }Iya mas, yang itu. Apa cuma dihapus aja ya yg uppercase-nya? Saya sudah tes, pas disimpan style.css-nya saat dibuka tak ada yang berubah duh..
Ceritanya mas ini mau mengubah font jadi bagaimana? Kalau efeknya tidak mau huruf kapital semua maka ya dihilangkan saja script
text-transform: uppercase;. Mungkin saja mas menggunakan CDN CloudFlare! Jika iya maka akan ada cache dulu setiap melakukan perubahan editor template, maka seolah-olah tidak ada perubahan. Untuk menghindarinya silakan hapus dulu cache yang ada di CDN CloudFlare setiap sudah melakukan perubahan di template. Atau mungkin juga mas menggunakan Plugin WP Super Cache atau W3 Total Cache WordPress! Jika benar, setelah melakukan perubahan juga harus dihapus cache dari plugin tersebut.Tadi sudah saya tes mengubah huruf yang ada di blog mas dari metode Inpeksi Element browser dan tidak ada masalah sedikitpun mas!
Sudah beres mas, tadinya cuma mau gedein font aja sama yg uppercase itu. Saya lupa kalau ada cloudflare juga hehe. Ternyata memang masalah cache di browser, terima kasih banyak mas sekali lagi. Sukses terus untuk info-menarik.net !
infonya bagus gan. kebetulan ane mau rubah font di wp ane
kunjung balik ya?
semuatutorial[dot]web[dot]id
kalo tampilan di home page gimana ya, kok ga berubah ya gan? apakah ada cara lain? Tolong infonya ya gan. Terimakasih
Jika prosedurnya sudah benar, mungkin agan mengaktifkan plugin cache atau CDN. Coba clear dulu cache dan historynya termasuk yang di web browser juag!
Maaf mau nanya mas, setelah saya ubah ukuran font-nya via Css, berhasil.
Tapi bingkai templatenya jadi melebar, sehingga gambar header ama body jadi gak presisi (gak enak diandang).
So, gimana caranya agar perubahan ukuran font tersebut tidak mengakibatkan layout templatenya juga berubah?
Mohon pencerahan, terimakasih sebelumnya.
kebetulan baru hijrah ke WP Selfhost thanks tutornya gan, oiya kalo mau bikin footer menu yg dibawah blog gimana ya contohnya macem blog ini ada profil penulis label post dll
Tulisan yg sangat bermanfaat. Kalo mau edit font MENU gimana langkahnya ya.?
Kalo mas buka website saya bahanguru itu font dari Home, Berita, RPP K13 dll mo saya ubah, tapi dah mutar2 belum dapat juga. mohon bantuannya. maklum saya newbi.
thanks info nya gan, alau ada ilmu yang baik2 tolong di share yaaa para master agar bisa belajar lebih banyak lagi………..
Terima kasih mas, segera saya praktek kan