Daftar Isi :
Halo selamat malam semua, kali ini saya akan share pangelaman saya menggunakan theme twenty twenty.
Theme twenty twenty ini adalah official theme wordpress untuk tahun 2020, saya mulai jatuh cinta pada theme ini karena framework AMP yang saya pakai, ternyata langsung bisa support.
Simple Theme
Setelah saya googling ternyata twenty twenty memang masuk kedalam ekosistem dari frame work AMP, disamping puluhan theme yang ada.
Disamping design nya yang menurut saya OKE banget, simple dan clean, saya juga mempertimbangkan loading speed dari blog saya agar tidak banyak resource yang digunakan terutama pada saat diload pada perangkat mobile.
Namun demikian dengan simple nya theme ini dibandingkan astra dan generate press membiliki ‘kelemahan’ tersendiri.
The Font
Salah satunya adalah saat anda melakukan speed test pada google page speed, gtmetrix dan light house, maka ada salah satu font yang menjadi ‘penghambat’ loading dari situs yang menggunakan theme twenty twenty.
Font tersebuta adalah inter : inter-upright-var.woff2 pada beberpa website audit font ini memberikan tambahan loading pada website sehingga performa website akan menurun.
Tidak seperti astra dan generatepress yang anda bisa ganti font nya menjadi UI system font agar dapat menghemat waktu loading web.
Pada twenty twenty tidak dapat dilakukan customize dengan mudah, anda harus paham terhadap struktur dari tema ini.
Using Plugin
Kabar baiknya adalah kita bisa menggunakan sebuah plugin untuk melakukan penggantian font yang dianggap sebagai penghambat ini dengan menggantinya menjadi UI system font.
Berikut adalah langkah nya :
- Login ke dashboard wordpress anda
- Klik Plugin
- Klik Installed Plugin
- Klik Add New
- Search Twentig
- Klik Install
- Klik Activate

Kemudian setelah anda melakukan installasi, silahkan lanjutkan Navigasi ke menu Appearance, klik customize.

Klik Twentig Options, Klik Fonts, Klik Body Fonts ganti ke UI System Fonts. Sedangkan Heading font ganti juga ke UI System Fonts.

Setelah selesai update, klik publish, seharusnya font inter yang menjadi ‘masalah’ sudah tidak di load lagi oleh situs anda.
Tampilan font nya memang banyak berubah dari default inter, tapi menurut saya tidak masalah karena masih enak untuk di baca. Daripada speed web nya menjadi turun dan pembaca males untuk mengakses situs anda.
Customize Layout
Lebih jauh selain untuk mengganti font yang dianggap bermasalah, plugin ini bisa melakukan customize untuk post dan page, seperti misalnya mengganti layout waterfall menjadi grid pada halaman awal.

Anda bisa melakukan setting pada customize, twentig options, blog dan ubah default menjadi grid.

Selain itu juga anda bisa melakukan customize untuk page dan post dengan template yang sudah di sediakan.
Customize Post and Page
Pada post / page klik icon tw pada kanan atas dan klikt paterns, disana akan muncul patern-patern yang sudah disediakan oleh twentig library s
Misalnya anda ingin membuat cover 3 column, dengan text atau dengan gambar. Atau hanya columns saja atau text dengan columns, Hero page title, Cowver, Call to Action, List, dll Dimana ini semua syncron dengan block editor milik gutenberg.
Ini Contoh Patern

First item
Lorem ipsum dolor sit amet, commodo erat adipiscing elit. Sed do eiusmod ut tempor incididunt ut labore et dolore.

Second item
Integer enim risus, suscipit eu iaculis sed, ullamcorper at metus. Venenatis nec convallis magna, eu congue velit.

Third item
Aliquam tempus mi nulla porta luctus. Sed non neque at lectus bibendum blandit. Morbi fringilla sapien libero.

Fourth item
Duis enim elit, porttitor id feugiat at, blandit at erat. Proin varius libero sit amet tortor volutpat diam laoreet.

Contoh Pattern
Lorem ipsum dolor sit amet, commodo erat adipiscing elit. Sed do eiusmod ut tempor incididunt ut labore et dolore. Integer enim risus, suscipit eu iaculis sed ullamcorper.
Contoh Pattern 2 captivates your audience
Kesimpulan
Dengan plugin twentig ini anda bisa memodifikasi font yang menjadi ‘penghalang’ speed pada tema twenty twenty, lebih jauh anda bisa melakukan customize untuk situs anda agar lebih menarik.
Tentunya semua itu juga sudah compatible dengan framework AMP, sehingga anda tidak perlu khawatir terkait css dan js nya.
Selamat mencoba dan mohon bisa di share pengalamannya pada kolom komentar ya.
Wassalam
Hendra Wijaya
Discover more from hendrawijaya.net
Subscribe to get the latest posts sent to your email.
Terimakasih banget atas panduannya,mas.
Saya baru belajar nyoba nyoba bikin blog dimana theme yang saya ambil adalah theme 2020.
Baca baca di internet, katanya font inter the theme 2020 itu bikin loading page nya lama.
Pas saya cari cari bagaimana mengatasinya, saya ketemu tulisan mas di WP.org,
yang akhirnya saya jadi mendarat di blog mas ini :).
Makasih sekali lagi atas panduannya mas.
Sukses selalu ya.
Sama2 mas karma semoga bermanfaat yah…