Jika Anda menggunakan WordPress 5.0 dan lebih tinggi, kecuali Anda telah hidup di bawah batu, Anda pasti pernah mendengar tentang pembaruan Gutenberg yang digabungkan ke WordPress pada Desember 2018^{(December 2018)} .

Jadi, jika Anda menggunakan WP versi terbaru, Anda mungkin sudah menggunakan Gutenberg atau terus menggunakan editor klasik dengan menginstal plugin WordPress Classic Editor^{( WordPress Classic Editor plugin)} .

Mengapa Gutenberg?^{(Why Gutenberg?)}

Banyak pengguna WP tidak siap untuk melompat ke kereta Gutenberg^{(on the Gutenberg wagon)} , tetapi beberapa, termasuk situs web ini.

Beberapa alasan mengapa Anda mungkin ingin menggunakan Gutenberg adalah karena:

• Adalah masa depan bagi pengembang WP.
• Memberikan pengalaman pengguna yang lebih baik.
• Lebih fleksibel daripada editor asli WP ( TinyMCE ).
• Akan memberikan pasar baru bagi pengembang.

Apa Perbedaan Antara WordPress & Gutenberg?^{(What Are The Differences Between WordPress & Gutenberg?)}

Editor Klasik^{(Classic Editor)} WP adalah editor teks dan sangat mirip dengan Microsoft Word . Ini memiliki bidang pengeditan tunggal seperti yang terlihat pada gambar di bawah.

Gutenberg adalah editor berbasis blok yang terlihat seperti ini:

Ada beberapa blok untuk berbagai jenis konten yang menyertakan opsi pemformatan mereka sendiri. Blok seperti:

• Tombol
• Gambar
• Meja
• Sematkan
• Daftar
• Galeri
• audio
• Kutipan
• Menuju
• Kode
• Ayat
• HTML khusus

Selain itu, tema dan plugin menawarkan lebih banyak blok dan widget untuk Anda gunakan di postingan dan halaman WP Anda.

Bagaimana Halaman atau Postingan yang Ada Terpengaruh?^{(How Are Existing Pages Or Posts Affected?)}

Setelah memutakhirkan dan menggunakan Gutenberg , halaman dan postingan Anda yang ada akan terus ditampilkan dengan benar. 

Namun, Anda harus memeriksa kode pendek Anda dan memastikan bahwa plugin yang mungkin Anda gunakan berfungsi.

Saat Anda mengedit halaman atau postingan yang ada, halaman atau postingan tersebut akan terbuka secara otomatis di satu blok klasik editor Gutenberg yang baru.^(Gutenberg)

Apakah Anda siap untuk beralih?

Gunakan Situs Pementasan^{(Use a Staging Site)}

Hal terakhir yang ingin Anda lakukan adalah menghancurkan situs Anda yang sudah ada. Cara menghindarinya adalah dengan mengaktifkan Gutenberg di situs pementasan^{(a staging site)} . Ini adalah replika yang tepat dari situs web Anda tempat Anda dapat menguji berbagai hal tanpa merusak situs langsung Anda.

Situs pengujian menyertakan tema, plugin , opsi, dan konten Anda. Perusahaan hosting Anda mungkin menawarkan situs pementasan. Jika tidak, Anda dapat menggunakan plugin Staging WordPress^{( WordPress Staging plugin)} .

Setelah situs pementasan Anda aktif dan berjalan, instal dan aktifkan plugin Gutenberg^{( Gutenberg plugin)} dan mulai pengujian. Atau instal instance WordPress baru di komputer Anda dan uji di sana.

Periksa Plugin Anda^{(Check Your Plugins)}

Pengguna WordPress sudah familiar dengan apa yang terjadi ketika plugin tidak bekerja sama dengan baik. Terkadang karena fungsionalitas atau kode yang bertentangan. Ini adalah waktu yang tepat untuk melihat apakah Anda menggunakan semua plugin yang telah Anda instal. Jika tidak, hapus.

Anda juga ingin melihat plugin mana yang digunakan saat Anda mengedit konten di WordPress . Plugin tertentu seperti Akismet , Contact Form 7 , Google Sitemap Generator , dan WP Super Cache tidak ada hubungannya dengan editor dan tidak akan terpengaruh dengan menggunakan Gutenberg .

Di sisi lain, plugin apa pun yang menambahkan fungsionalitas atau mengubah tampilan editor klasik WP mungkin tidak kompatibel dengan Gutenberg . Secara khusus, plugin yang menghasilkan kode pendek, menambahkan gaya khusus, atau belum diperbarui baru-baru ini, biasanya bentrok dan menyebabkan masalah.

Gutenberg dulu memiliki database Kompatibilitas Plugin^{(Plugin Compatibility)} yang aktif . Namun, telah ditutup karena tidak lagi aktif dipertahankan.

Anda dapat meninjau data akhir dan mengunduh database^{( download the database)} sebagai file CSV . Tanpa akses ke database kompatibilitas plugin yang aktif, Anda harus menguji secara manual setiap plugin yang Anda gunakan.

Coba buat postingan baru di situs pengujian Anda. Anda akan melihat bahwa Anda berada di editor Gutenberg dan itu akan terlihat berbeda untuk Anda. ^(Gutenberg)Saat Anda mulai mengetik, Anda secara otomatis membuat blok paragraf. Anda tidak perlu menambahkan blok baru saat menambahkan paragraf baru. Tekan saja^(Just) enter atau tombol kembali.

Karena Anda mencoba untuk melihat apakah plugin Anda saat ini akan berfungsi, cobalah untuk membuat ulang cara Anda menggunakan masing-masing dan lihat apakah itu masih berfungsi.

Jika tidak, cari fungsi yang sama di blok Gutenberg default , tambahkan blok itu, dan tambahkan konten Anda.

Pastikan untuk menyimpan daftar plugin yang tidak berfungsi dengan benar sehingga Anda dapat menghapusnya saat live dengan Gutenberg .

Bagaimana Jika Tidak Ada Blok Default Untuk Fungsi yang Anda Butuhkan?^{(What If There Is No Default Block For The Functionality You Need?)}

Periksa semua blok untuk melihat apakah fungsionalitas yang Anda butuhkan ada di dalam blok lain. Jika Anda tidak dapat menemukan sesuatu yang akan berfungsi, Anda dapat menghubungi pembuat plugin dan menanyakan apakah mereka berencana untuk memperbaruinya agar kompatibel dengan Gutenberg .

Jika semuanya gagal, coba temukan plugin Gutenberg^{( Gutenberg plugin)} yang melakukan apa yang Anda butuhkan. Hapus plugin yang tidak berfungsi dari situs pementasan Anda.

Tayang^{(Going Live)}

Sebelum Anda melakukan APA SAJA ke situs langsung Anda, buat cadangan lengkap seluruh situs Anda jika Anda melewatkan sesuatu saat memeriksa kompatibilitas atau terjadi kesalahan lain.

Dimungkinkan untuk membuat semua perubahan yang diperlukan di situs pengujian Anda dan mendorongnya ke situs langsung Anda. Namun, ini membutuhkan beberapa pengetahuan teknis. Jadi, kecuali Anda seorang pengembang atau memiliki pengembang yang cocok untuk Anda, lebih baik melakukan perubahan secara manual.  

Mulailah dengan menghapus plugin yang tidak berfungsi dan menambahkan yang baru yang Anda temukan untuk menggantikannya. Jika plugin lama memproses data untuk posting dan halaman yang ada dan tidak merusak yang baru, Anda dapat membiarkannya tetap terpasang.

Apakah Anda Ingin Mengonversi Posting & Halaman Lama Anda Menjadi Blok Gutenberg?^{(Do You Want To Convert Your Old Posts & Pages To Gutenberg Blocks?)}

Buka setiap halaman dan posting dari Menu Blok^{(Block Menu)} Klasik . Klik^(Click) tiga titik untuk melihat opsi^{(view options)} . Pilih dari menu tarik-turun Konversi ke Blok^{(Convert to Blocks)} .

Setelah WP mengonversi konten Anda ke sistem blok Gutenberg , Anda harus meninjau setiap blok. Gunakan Block Navigation^{(Use Block Navigation)} (dari ikon) untuk melihat semua bagian dari posting atau halaman Anda.

Seperti yang Anda lihat pada tangkapan layar di atas, setiap paragraf, gambar, daftar, dan judul sekarang berada di bloknya sendiri. Mengonversi halaman dan postingan yang ada ke sistem Gutenberg yang baru dapat dilakukan dengan cepat dan mudah.

Mungkin perlu beberapa jam untuk menguji plugin Anda dan menemukan yang baru, tetapi Anda hanya perlu melakukannya sekali. Pastikan untuk mengikuti langkah-langkah yang disarankan di atas agar perpindahan Anda ke Gutenberg tanpa rasa sakit dan bebas kesalahan.

How To Transition From The Classic WordPress Editor To Gutenberg

If you use WоrdPress 5.0 and higher, unless you hаve been liνing under a rock, you will have undoubtedly heard of the Gutenberg update which was merged into WordPress in Decеmber 2018.

So if you are using the latest version of WP, you are either already using Gutenberg or have continued using the classic editor by installing the WordPress Classic Editor plugin.

Why Gutenberg?

Many WP users are not ready to jump on the Gutenberg wagon, but some are, including this website.

A few of the reasons why you might want to use Gutenberg are because it:

• Is the future for WP developers.
• Provides a better user experience.
• Is more flexible that WP’s original editor (TinyMCE).
• Will provide a new market for developers.

What Are The Differences Between WordPress & Gutenberg?

WP’s Classic Editor is a text editor and looks very much like Microsoft Word. It has a single editing field as seen in the screenshot below.

Gutenberg is a block-based editor that looks like this:

There are multiple blocks for different types of content that include their own formatting options. Blocks such as:

• Button
• Image
• Table
• Embeds
• List
• Gallery
• Audio
• Quotes
• Heading
• Code
• Verse
• Custom HTML

Also, themes and plugins offer more blocks and widgets for you to use in your WP posts and pages.

How Are Existing Pages Or Posts Affected?

After upgrading and using Gutenberg, your existing pages and posts should continue to display correctly. 

However, you should check your shortcodes and make sure that the plugins you might be using are working.

When you edit an existing page or post, it will automatically open in a single new Gutenberg editor classic block.

Are you ready to make the switch?

Use a Staging Site

The last thing you want to do is break your existing site. The way to avoid this is to activate Gutenberg on a staging site. This is an exact replica of your website where you can test things out without doing any damage to your live site.

Test sites include your theme, plugins, options, and content. Your hosting company might offer staging sites. If they don’t, you can use the WordPress Staging plugin.

After your staging site is up and running, install and activate the Gutenberg plugin and start testing. Or install a brand new instance of WordPress on your computer and test on there.

Check Your Plugins

WordPress users are familiar with what happens when plugins don’t play nice together. Sometimes it’s due to the functionality or conflicting code. This is an excellent time to see if you are using all the plugins you have installed. If you aren’t, remove them.

You also want to see which plugins are being used when you are editing content in WordPress. Specific plugins such as Akismet, Contact Form 7, Google Sitemap Generator, and WP Super Cache have nothing to do with the editor and will not be affected by using Gutenberg.

On the other hand, any plugin that adds functionality or changes the way the WP classic editor looks might not be compatible with Gutenberg. In particular, plugins that generated shortcodes, adds custom styles, or haven’t been updated recently, usually conflict and cause problems.

Gutenberg used to have an active Plugin Compatibility database. However, it has been shut down because it is no longer actively maintained.

You can review the final data and download the database as a CSV file. Without access to an active plugin compatibility database, you are going to have to manually test each plugin you use.

Try creating a new post on your test site. You will see that you are in the Gutenberg editor and it will look different to you. When you start typing, you are automatically creating a paragraph block. You don’t have to add a new block when you add a new paragraph. Just hit enter or the return key.

Since you are trying to see if your current plugins will work, try to recreate how you used each one and see if it still works.

If it doesn’t, look for the same functionality in the default Gutenberg block, add that block, and add your content.

Be sure to keep a list of the plugins that don’t work correctly so you can remove them when going live with Gutenberg.

What If There Is No Default Block For The Functionality You Need?

Check all the blocks to see if the functionality you need lives inside another block. If you can’t find something that will work, you can contact the plugin authors and ask them if they are planning to update it to be compatible with Gutenberg.

If all else fails, try to find a Gutenberg plugin that does what you need. Delete the plugins that don’t work from your staging site.

Going Live

Before you do ANYTHING to your live site, make a complete backup of your entire site in case you missed something when checking for compatibility or another error occurs.

It is possible to make all the necessary changes on your test site and push them to your live site. However, this requires some technical knowledge. So, unless you are a developer or have one that works for you, it is better to make the changes manually.  

Start by deleting the plugins that didn’t work and adding the new ones you found to replace them. If old plugins are processing data for existing posts and pages and do not break new ones, you can leave them installed.

Do You Want To Convert Your Old Posts & Pages To Gutenberg Blocks?

Open each page and post from the Classic Block Menu. Click the three dots to view options. Select from the drop-down menu Convert to Blocks.

After WP converts your content to the Gutenberg block system, you should review each block. Use Block Navigation (from icons) to see all the parts of your post or page.

As you can see in the above screenshot, every paragraph, image, list, and heading is now in its own block. Converting existing pages and posts to the new Gutenberg system is quick and easy.

It might take several hours to test your plugins and find new ones, but you only have to do this once. Make sure to follow the steps suggested above to make your move to Gutenberg painless and error-free.

Related posts

• Tutorial Gutenberg WordPress: Cara Menggunakan Editor Baru

• Bagaimana memindahkan WordPress site dari satu host ke yang lain

• Cara Memasang & Setup WordPress pada Microsoft Azure

• Bagaimana menjalankan blazingly cepat WordPress di Microsoft Azure

• Cara mengkonfigurasi Privacy di WordPress dan mengapa ini penting

• Cara Mempercepat Situs WordPress Apa Pun Menggunakan .HTACCESS

• Redirect pengguna dari 404 Halaman di WordPress

• Cara Memasang Tema di WordPress

• Cara Mengedit Footer di WordPress

• Format Penulisan Blog Terbaik untuk Menyampaikan Poin Anda

• menunjukkan WordPress HTTP Error ketika gambar upload

• Cara Melindungi Halaman dengan Kata Sandi di Situs WordPress Anda

• 3 Plugin SEO Terbaik Untuk WordPress

• Tampilkan kutipan pada homepage dari WordPress blog

• Cara Menemukan Login Admin WordPress Anda

• Protect dan aman WordPress website dari peretas

• Cara Meningkatkan Kinerja Di WordPress Melalui Pembersihan Basis Data

• Squarespace Vs WordPress: Platform Situs Mana yang Lebih Baik?

• Bagaimana menginstal WordPress di Google Cloud Platform

• 11 Plugin Podcast WordPress Terbaik