Panduan Lengkap: Mari Bersama Menguji WordPress 7.1

Kolaborasi (Collaboration)

Fitur Baru “Notes” (Catatan Internal)

Fitur Notes memungkinkan tim atau klien untuk meninggalkan umpan balik (feedback) secara langsung di dalam editor. WordPress 7.1 membuat fitur ini menjadi jauh lebih kaya: catatan pada kata-kata tertentu atau di beberapa blok sekaligus, rich text di dalam catatan, @mentions, beberapa utas (threads) catatan pada blok yang sama, tombol toggle tampilkan lebih banyak/sedikit untuk catatan panjang, serta tombol toolbar baru untuk mempermudah pembuatan catatan.

Langkah-Langkah Pengujian:

1. Buat Postingan Baru: Buat sebuah post baru dan tambahkan beberapa paragraf konten di dalamnya.
2. Pilih Teks Tertentu: Sorot atau blok beberapa teks di dalam paragraf tersebut.
3. Tambahkan Catatan: Buka toolbar blok (atau menu opsi tiga titik ⋮) lalu pilih opsi Add note (cari ikon berbentuk lembar catatan/komentar).
4. Ketik dan Simpan: Ketik isi catatan Anda lalu simpan. Konfirmasikan bahwa catatan tersebut muncul dan menempel (anchored) tepat pada teks yang Anda pilih sebelumnya.
5. Uji Balasan (Reply): Balas catatan Anda sendiri dan pastikan balasan tersebut muncul dalam utas (thread) yang rapi.
6. Uji Pemformatan Teks (Keyboard Shortcuts): Karena tidak ada toolbar visual di dalam kolom catatan, uji pemformatan menggunakan pintasan keyboard. Sorot teks di dalam catatan lalu tekan ⌘/Ctrl + B untuk cetak tebal (bold), ⌘/Ctrl + I untuk cetak miring (italic), atau ⌘/Ctrl + K untuk menyisipkan tautan (link). Untuk memformat kode (code), ketik teks yang diapit oleh backticks (`seperti ini`). Pastikan format tersebut tetap terjaga setelah catatan disimpan. (Catatan: Pemformatan ini sengaja dibatasi hanya untuk bold, italic, link, dan code).
7. Buat Utas Terpisah: Buat utas percakapan kedua yang terpisah pada blok yang sama, lalu pastikan kedua utas tersebut dilacak secara independen dan tidak tercampur.
8. Catatan Lintas Blok: Cobalah membuat satu catatan yang cakupannya mencakup lebih dari satu blok, lalu pastikan catatan tersebut terlacak dengan benar.
9. Uji Catatan Panjang: Ketik catatan yang sangat panjang dan konfirmasikan apakah tombol toggle Show more/less berfungsi untuk melipat dan membuka teks catatan agar margin editor tetap rapi.
10. Gunakan @mentions: Ketik simbol “@” di dalam catatan untuk memunculkan daftar kolaborator yang dapat dicari, lalu tag salah satu pengguna. Pastikan mention tersebut masuk dengan benar.

Ekspektasi Hasil (Expected):

Catatan menempel pada konten yang tepat; fungsi balasan (replies), mentions dengan notifikasi, pembuatan beberapa utas sekaligus per blok, pemformatan teks lewat keyboard, serta tombol toggle melipat teks panjang semuanya harus berjalan lancar sesuai deskripsi di atas.

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan kendala, bug, atau perilaku tidak biasa saat menguji fitur ini, silakan laporkan ke area Alpha/Beta di forum dukungan resmi. Anda juga bisa memantau perkembangan teknis fitur ini melalui tautan tiket pelacakan resmi core WordPress di Ticket #76316.

Video Panduan Pengujian Fitur Notes:

(Anda bisa klik gambar di bawah ini untuk menampilkan video demonstrasi fitur Notes)

Desain & Antarmuka (Design & Interface)

Gaya Responsif Bawaan (Responsive Styling)

Fitur ini memungkinkan Anda mengatur gaya visual sebuah blok secara berbeda untuk resolusi tablet dan seluler langsung dari editor—tanpa memerlukan kode CSS kustom. Anda cukup mengaktifkan fitur Responsive editing dari menu dropdown device-preview, lalu pindah ke mode Tablet atau Mobile. Perubahan yang Anda lakukan hanya akan disimpan khusus untuk breakpoint resolusi layar tersebut.

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan kendala atau perilaku aneh saat menguji fungsionalitas responsif ini, silakan laporkan ke area Alpha/Beta di forum dukungan resmi. Anda dapat melihat detail teknis pengembangan fitur ini melalui Pull Request GitHub #75121.

💡 Untuk skenario pengujian yang lebih lengkap (seperti resize handles, device view syncing, per-viewport styles, dan hidden-on-device blocks), Anda juga bisa mengikuti postingan instruksi khusus di Make Core: Call for Testing: Responsive Styling.

Gaya Status Interaktif (Interactive States Styling)

Kini Anda bisa mengatur gaya visual status interaktif pada blok Tombol (Button)—seperti Hover, Focus, dan Active—tanpa menulis satu baris CSS pun. Contohnya, membuat tombol berubah warna secara otomatis tepat saat kursor diarahkan ke atasnya (hover).

Fitur ini bekerja dalam dua tingkatan (layer):

1. Global Styles: Mengatur gaya hover, focus, dan active satu kali saja, dan aturan ini akan langsung berlaku untuk semua tombol di seluruh situs web Anda.
2. Individual Block Instance: Setiap blok tombol individual bisa memiliki gaya interaktif uniknya sendiri tanpa memengaruhi tombol-tombol lain di halaman tersebut. (Catatan: Saat ini status pseudo per instans baru didukung oleh blok Button; blok lain belum menyediakannya).

Langkah-Langkah Pengujian:

• Tahap 1: Menguji Global Styles (Berlaku untuk semua tombol)
  1. Buka Site Editor (Tampilan → Editor) lalu masuk ke bagian Styles → Blocks → Button.
  2. Gunakan komponen States selector untuk berpindah ke status Hover.
  3. Saat status Hover aktif, ganti warna latar belakang (Background) dan warna teks (Text color), atau gaya visual lainnya sesuai preferensi Anda.
  4. Ulangi langkah yang sama untuk status Focus dan Active, berikan gaya visual yang berbeda untuk masing-masing status.
  5. Simpan pengaturan gaya tersebut.
  6. Buka halaman depan situs (front-end), arahkan kursor (hover), tekan menggunakan tombol Tab (focus), dan klik tombol tersebut untuk memastikan gaya visual yang benar muncul pada semua tombol di situs Anda.
• Tahap 2: Menguji Per Instans Blok Tombol (Hanya berlaku untuk satu tombol)
  1. Tambahkan dua atau lebih blok Tombol (Button blocks) ke dalam sebuah postingan atau halaman.
  2. Pilih salah satu tombol tersebut, lalu buka pengaturan Styles di sidebar kanan.
  3. Buka pemilih status (state selector) pada bagian header block card (ikon menu tiga titik kecil) lalu ganti ke status Hover.
  4. Ubah salah satu gaya, misalnya warna latar belakang. Kanvas editor harus langsung memperbarui tampilannya secara instan. Klik pilihan Show state on canvas (aktif/nonaktif) untuk memverifikasi pratinjau tampilan hover secara langsung di editor.
  5. Simpan dan lihat postingan tersebut di halaman depan (front-end). Mengarahkan kursor pada satu tombol khusus tersebut harus menerapkan gaya unik yang Anda buat, sedangkan tombol lainnya tidak ikut berubah.
  6. Pindah ke status Focus dan Active lalu ulangi proses di atas untuk memberikan karakteristik interaktif unik pada tombol tersebut.
  7. Kembalikan (reset) pengaturan gaya hover pada instans tombol tersebut dan pastikan status interaktif lainnya serta Global Styles tombol tidak ikut terganggu.

Ekspektasi Hasil (Expected):

Gaya hover, focus, dan active di tingkat Global Styles berlaku untuk semua tombol di seluruh situs web, sedangkan gaya di tingkat instans blok hanya memengaruhi tombol yang dipilih saja. Kedua tingkatan ini berpadu secara logis, di mana menghapus kustomisasi di satu tingkat tidak merusak tingkat lainnya. Fitur Show state on canvas dapat menampilkan pratinjau status di editor dengan akurat tanpa Anda harus benar-benar mengarahkan kursor.

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan masalah, silakan laporkan ke forum dukungan resmi. Anda bisa memantau perkembangan teknisnya di repositori GitHub lewat Issue #38277 (dukungan per instans blok mendarat melalui PR #76491).

Video Panduan Pengujian Fitur Interactive States:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Interactive States)

Toolbar Admin yang Selalu Muncul (Persistent Toolbar)

Bilah menu admin (admin toolbar) atas sekarang akan selalu ikut muncul saat Anda berada di dalam Post Editor maupun Site Editor—di mana pada versi sebelumnya toolbar ini menghilang saat Anda masuk ke Site Editor. Terdapat beberapa penyegaran visual yang dibawa: ikon rumah (home icon) kini berubah menjadi Ikon Situs web Anda (jika sudah diatur), foto avatar profil Anda sekarang berbentuk lingkaran, dan ikon command palette telah dihapus dari jajaran toolbar editor.

Langkah-Langkah Pengujian:

1. Set Ikon Situs: Pastikan Anda sudah mengatur Site Icon terlebih dahulu (bisa lewat Site Editor → Design → Identity, atau menu Pengaturan Umum).
2. Periksa Post Editor: Buka halaman Post Editor (edit kiriman apa saja) dan pastikan bilah admin terlihat jelas menempel di sisi paling atas.
3. Periksa Site Editor: Buka halaman Site Editor (Tampilan → Editor) dan pastikan bilah admin atas tetap terlihat di sana (tidak menghilang seperti versi terdahulu).
4. Verifikasi Ikon: Pastikan ikon beranda pada bilah admin menampilkan logo/ikon situs kustom Anda, bukan ikon bawaan WordPress (dashicon). Jika situs belum memiliki ikon kustom, sistem akan otomatis menggunakan ikon fallback bawaan.
5. Periksa Bentuk Avatar: Pastikan foto profil admin Anda di sudut kanan atas berbentuk lingkaran utuh, bukan kotak.
6. Uji Command Palette: Pastikan ikon command palette sudah tidak ada lagi di barisan toolbar editor, dan pastikan jendela pencarian pintas tersebut tetap bisa terbuka dengan menekan kombinasi tombol Cmd/Ctrl + K.
7. Uji Skema Warna: Ubah skema warna admin Anda di menu Pengguna → Profil (Users → Profile), lalu masuk kembali ke editor untuk memastikan bilah admin di kedua editor tersebut mengikuti skema warna baru yang Anda pilih.
8. Uji Mode Responsif: Ubah ukuran resolusi browser Anda ke lebar yang sempit atau mode seluler (mobile width), lalu pastikan struktur bilah admin di dalam editor tetap tampil dengan rapi dan benar.

Ekspektasi Hasil (Expected):

Bilah admin (admin bar) terlihat konsisten di Post Editor dan Site Editor, menampilkan ikon situs kustom serta avatar berbentuk lingkaran, tidak lagi membawa ikon command-palette di toolbar editor, serta secara akurat mengikuti skema warna admin yang dipilih pengguna di profil.

Pelaporan Masalah & Umpan Balik:

Setiap temuan kesalahan atau kejanggalan pada komponen toolbar ini dapat dilaporkan langsung ke forum dukungan resmi Alpha/Beta dengan merujuk pada detail Issue GitHub #79036.

Video Panduan Pengujian Fitur Persistent Toolbar:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Persistent Toolbar)

Bagian Identitas Situs Khusus (Dedicated Identity Section)

Panel navigasi Design → Identity di dalam Site Editor kini memungkinkan Anda untuk mengubah Judul Situs (Site Title) dan Slogan Situs (Site Tagline) secara langsung berdampingan dengan pengaturan Logo dan Ikon Situs yang sudah ada sebelumnya. Anda tidak perlu lagi melompat keluar editor menuju halaman Pengaturan Umum dasbor admin. Perubahan data pada panel ini akan langsung memperbarui blok Site Title dan Site Tagline secara real-time di kanvas pratinjau editor.

Langkah-Langkah Pengujian:

1. Buka Dasbor WordPress Anda lalu arahkan ke menu Appearance → Editor (Tampilan → Editor).
2. Di dalam Site Editor, masuk ke menu navigasi Design → Identity.
3. Pastikan ada empat kolom isian yang muncul secara berurutan: Site Title, Site Tagline, Site Logo, dan Site Icon.
4. Pastikan teks deskripsi di bawah masing-masing kolom isian memiliki ukuran font dan gaya penulisan yang seragam dan konsisten.
5. Ubah isi teks pada kolom Site Title, lalu perhatikan apakah blok judul situs pada kanvas pratinjau berubah secara instan saat Anda mengetik.
6. Ubah isi teks pada kolom Site Tagline, lalu perhatikan apakah blok slogan situs pada kanvas pratinjau ikut berubah secara langsung.
7. Klik tombol Save (Simpan) dan pastikan semua kolom data yang Anda sunting tadi muncul di dalam panel daftar konfirmasi penyimpanan.
8. Muat ulang (reload) halaman editor Anda dan pastikan perubahan yang Anda simpan tadi tetap terjaga dengan benar (persisted).

Ekspektasi Hasil (Expected):

Komponen Site Title dan Site Tagline dapat disunting dengan mudah langsung dari panel Identity di dalam editor, tampilan kanvas pratinjau terupdate secara real-time seiring Anda mengetik, serta seluruh perubahan tersimpan dan bertahan dengan sempurna setelah editor dimuat ulang.

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan bug atau kegagalan sinkronisasi data pada fitur ini, silakan laporkan masalah Anda dan pantau perkembangannya melalui tautan isu resmi di Ticket Core #76261.

Video Panduan Pengujian Fitur Dedicated Identity Section:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Dedicated Identity Section)

Skema Warna Admin di Site Editor (Admin Color Scheme Reflected)

Antarmuka Site Editor sekarang akan sepenuhnya mengikuti skema warna admin WordPress pilihan Anda, alih-alih selalu memaksa penggunaan antarmuka latar belakang gelap yang kaku seperti versi sebelumnya. Bagian sidebar dan area bingkai luar (chrome interface) akan langsung berubah mengambil warna dari skema pilihan Anda, sementara area kanvas pengeditan konten (editing canvas) akan tetap berwarna putih bersih demi kenyamanan dan keterbacaan tingkat kontras desain.

Langkah-Langkah Pengujian:

1. Pergi ke halaman dasbor admin di menu Users → Profile (Pengguna → Profil) dan pilih salah satu skema warna admin kustom Anda (misalnya: Modern, Blue, Coffee, Ectoplasm, Midnight, Ocean, Sunrise).
2. Buka halaman Site Editor melalui menu Appearance → Editor (Tampilan → Editor).
3. Pastikan warna area sidebar dan bingkai sekeliling antarmuka editor merefleksikan kombinasi warna dari skema yang Anda pilih tadi, bukan latar belakang hitam bawaan yang kaku.
4. Pastikan area kanvas pengeditan / area konten utama tetap berwarna putih bersih agar konten di dalamnya mudah dibaca.
5. Coba ganti ke skema warna admin yang berbeda di profil Anda, lalu kembali masuk ke Site Editor untuk mengonfirmasi antarmuka langsung berubah mengikuti skema baru tersebut.
6. Ubah ukuran layar browser Anda menjadi sempit atau ke lebar mode seluler (mobile width), lalu pastikan kombinasi warna tema pada sidebar dan area konten putih tetap tampil dengan proporsional dan tidak cacat visual.

Ekspektasi Hasil (Expected):

Tampilan area bingkai luar (chrome) dan sidebar pada Site Editor cocok dengan skema warna admin yang Anda tentukan di semua pilihan skema yang tersedia serta pada mode resolusi seluler, sedangkan kanvas konten utama tetap terjaga putih bersih.

Pelaporan Masalah & Umpan Balik:

Laporkan kendala visual atau error penargetan warna CSS pada fitur ini ke forum dukungan pengujian Alpha/Beta dengan menyertakan rujukan pelacakan di Ticket Core #78397.

Video Panduan Pengujian Fitur Admin Color Scheme di Site Editor:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Admin Color Scheme di Site Editor)

Kategori & Riwayat Terakhir di Command Palette (Command Palette Iterations)

Fitur Command Palette (kombinasi tombol Cmd/Ctrl + K) kini dibuat menjadi jauh lebih mudah untuk dinavigasi. Hasil pencarian dan daftar perintah sekarang dikelompokkan secara terstruktur ke dalam beberapa bagian utama: Suggestions (Saran), Recent (Terbaru), dan Results (Hasil Pencarian). Setiap perintah yang sering atau baru saja Anda jalankan akan otomatis diingat dan disimpan di bawah bagian Recent sebagai bagian dari preferensi profil pengguna Anda. Ukuran lebar kotak dialog palette ini juga dibuat sedikit lebih lebar agar mempermudah pemindaian secara visual.

Langkah-Langkah Pengujian:

1. Saat berada di dalam editor, tekan tombol kombinasi Cmd/Ctrl + K pada keyboard Anda untuk memunculkan kotak command palette.
2. Ketik dan jalankan beberapa perintah yang berbeda (misalnya: menavigasi ke halaman tertentu, membuka preferensi, dll.), lalu tutup kotak dialog tersebut.
3. Buka kembali kotak command palette menggunakan pintasan Cmd/Ctrl + K, lalu pastikan bagian bernama Recently used muncul di daftar teratas dan menampilkan deretan perintah yang baru saja Anda jalankan sebelumnya.
4. Mulai mengetik sebuah kata kunci baru di dalam kolom pencarian, lalu verifikasikan apakah hasil pencarian yang keluar telah dikelompokkan dengan rapi ke dalam kategori perintah terbaru (recent), perintah yang disarankan (suggested), dan hasil yang cocok (matching sections).
5. Segarkan (reload) halaman browser Anda atau mulai sesi admin yang baru, lalu buka kembali command palette untuk memastikan bahwa daftar perintah yang baru saja digunakan (recently used) tetap tersimpan dengan aman (persist).
6. Periksa struktur tata letak teks dan kotak dialog secara visual untuk memastikan tampilannya rapi, mudah dibaca, dan nyaman untuk dipindai oleh mata Anda.

Ekspektasi Hasil (Expected):

Seluruh perintah terkelompokkan ke dalam kategori bagian yang jelas dan terstruktur, daftar perintah yang baru saja digunakan tetap tersimpan di bawah kolom Recent meskipun halaman dimuat ulang, serta ukuran lebar kotak dialog yang baru mempermudah pemindaian visual dengan cepat.

Pelaporan Masalah & Umpan Balik:

Setiap kendala performa pencarian atau bug navigasi pada komponen ini bisa dikirimkan ke forum dukungan teknis dengan merujuk pada dokumentasi Ticket Core #75616.

Video Panduan Pengujian Fitur Command Palette:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Command Palette)

Sistem Media (Media)

Pemrosesan Media di Sisi Klien (Client-side Media Processing)

Saat Anda mengunggah gambar di dalam editor, browser Anda kini akan melakukan proses dekode, perubahan ukuran (resize), dan enkode untuk semua ukuran turunan (sub-sizes) secara lokal langsung di sisi klien (memanfaatkan teknologi wasm-vips) sebelum file dikirim ke server.

Fitur ini mendukung format AVIF, WebP, HEIC (format bawaan foto iPhone), UltraHDR, JPEG XL, serta konversi otomatis dari GIF ke format video agar pemuatan file menjadi jauh lebih ringan dan efisien. Jika browser atau perangkat yang digunakan tidak mendukung fitur ini, sistem akan otomatis dialihkan secara aman (silently fall back) ke jalur pemrosesan server seperti versi terdahulu. (Catatan: Fitur ini baru berjalan pada browser berbasis Chromium, membutuhkan RAM perangkat di atas 2 GB, dan koneksi internet yang stabil).

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan kendala atau kegagalan saat mengunggah aset gambar menggunakan metode pemrosesan lokal ini, silakan laporkan ke area Alpha/Beta di forum dukungan resmi dengan menyertakan tag [Feature] Client Side Media. Anda dapat memantau perkembangan teknis fitur ini melalui tautan Ticket #76756.

💡 Untuk skenario pengujian yang lebih luas (termasuk pengujian unggahan multi-file secara bersamaan, ketahanan unggahan saat internet tidak stabil, dan skenario perangkat berspesifikasi rendah), Anda bisa merujuk pada panduan Make Core: Call for Testing: client-side media processing.

Modal Editor Media Baru (Media Editor Modal)

Sebuah jendela modal khusus untuk penyuntingan media kini hadir menggantikan alat pemotong gambar bawaan halaman (old inline image cropper). Fitur ini menyatukan fungsi pemotongan (cropping), rotasi gambar, membalik gambar (flip), perbesaran (zoom), serta pengeditan metadata (seperti alt text dan caption) ke dalam satu tempat alur kerja yang rapi. Fitur ini dapat diakses dengan mengklik tombol Crop pada blok Image, Site Logo, dan Cover.

Langkah-Langkah Pengujian:

1. Tambahkan Blok Gambar: Di halaman atau postingan baru, tambahkan blok Image, lalu unggah gambar baru atau pilih dari Pustaka Media.
2. Buka Modal Editor: Klik tombol Crop pada bilah toolbar blok. Pastikan jendela modal baru terbuka (bukan lagi memicu alat pemotong inline yang lama).
3. Uji Freeform Crop: Coba lakukan pemotongan bebas (freeform crop) dengan menggeser titik penyesuaian (handles) di tepi gambar, dan pastikan fungsinya berjalan dengan baik.
4. Uji Aspect-Ratio Lock: Cobalah memotong gambar dengan pilihan rasio tetap (aspect-ratio crop) dan pastikan bingkai pemotong mengunci proporsi rasio tersebut.
5. Uji Rotasi Gambar: Gunakan fitur Rotate (termasuk fitur rotasi halus / snap rotation jika tersedia) dan pastikan arah gambar berputar dengan benar.
6. Uji Fitur Flip: Gunakan tombol Flip untuk membalikkan posisi gambar secara horizontal atau vertikal, pastikan visual gambar langsung berubah.
7. Uji Fitur Zoom: Manfaatkan kontrol perbesaran gambar (tombol + dan −) dan pastikan gambar membesar atau mengecil secara proporsional di dalam bingkai pemotongan.
8. Uji Metadata: Ubah atau isi data metadata gambar (seperti Alt Text atau Caption) langsung di dalam jendela modal tersebut, lalu klik tombol Save.
9. Verifikasi Hasil: Pastikan hasil gambar yang telah dipotong dan diedit langsung diterapkan pada blok di editor, serta tetap terjaga (persist) dengan benar setelah Anda menyimpan postingan dan memuat ulang halaman editor.
10. Uji pada Blok Lain: Ulangi langkah-langkah di atas dengan mengklik tombol Crop pada blok Site Logo dan blok Cover untuk memastikan jendela modal yang sama terbuka di sana.

Ekspektasi Hasil (Expected):

Jendela Media Editor Modal terbuka dengan lancar saat tombol Crop diklik; mendukung fungsionalitas pemotongan bebas maupun rasio tetap, rotasi, flip, zoom, serta pengeditan metadata; berhasil menerapkan hasil suntingan kembali ke aset gambar awal; serta dapat diakses secara konsisten dari blok Image, Site Logo, dan Cover.

Pelaporan Masalah & Umpan Balik:

Setiap kendala atau kegagalan simpan pada modal editor baru ini dapat dilaporkan langsung melalui forum dukungan Alpha/Beta dengan merujuk pada nomor pelacakan Ticket #73771.

Video Panduan Pengujian Fitur Media Editor Modal:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Media Editor Modal)

Blok Galeri yang Lebih Cerdas (Smarter Galleries)

Komponen blok Galeri kini menjadi jauh lebih cerdas dengan hadirnya mode Dynamic Gallery (Galeri Dinamis). Fitur ini secara otomatis menampilkan semua file media yang telah diunggah dan terlampir (attached) pada postingan tersebut—baik di dalam kanvas editor maupun di halaman depan (front-end) situs—serupa dengan cara kerja shortcode galeri klasik terdahulu. Selain itu, Anda kini bisa mengelola gambar-gambar yang terlampir pada post tersebut lewat kategori Attachments baru yang terletak di dalam panel media inserter.

Langkah-Langkah Pengujian:

1. Unggah Gambar ke Postingan: Buat sebuah postingan baru, lalu unggah beberapa gambar ke dalam post tersebut agar gambar-gambar tersebut statusnya otomatis “terlampir” (attached) pada ID postingan tersebut.
2. Aktifkan Dynamic Gallery: Tambahkan blok Gallery baru ke dalam halaman. Pada tampilan awal blok (placeholder), pilih opsi bernama “Use attached images” (Dynamic Gallery).
3. Verifikasi Tampilan Editor: Konfirmasikan bahwa blok galeri secara otomatis menarik dan menampilkan seluruh gambar yang telah Anda unggah ke dalam postingan tadi.
4. Verifikasi Tampilan Front-End: Simpan draf postingan Anda, lalu buka halaman depan (front-end). Pastikan deretan gambar galeri yang sama muncul dengan rapi bagi pengunjung situs.
5. Uji Pengaturan Sorting: Buka bagian pengaturan Source settings pada blok galeri di sidebar kanan, ubah urutan sortirnya (sort order), lalu pastikan posisi susunan gambar di dalam galeri ikut berubah.
6. Uji Konversi Blok: Coba konversikan struktur Dynamic Gallery tersebut menjadi galeri statis (static gallery). Pastikan setelah dikonversi, Anda bisa menambah, menghapus, atau mengatur ulang posisi gambar individual secara manual.
7. Periksa Panel Media Inserter: Buka panel pencarian media samping (klik tombol ikon + di sudut kiri atas, lalu masuk ke tab Media). Temukan kategori baru bernama Attachments.
8. Uji Fitur Attach & Detach: Pastikan kategori tersebut menampilkan daftar gambar yang menempel di postingan aktif saat ini. Coba gunakan fitur Attach untuk menyematkan gambar baru atau fitur Detach untuk melepas kaitan gambar, lalu konfirmasikan apakah tampilan pada Dynamic Gallery ikut terupdate secara otomatis mengikuti perubahan tersebut.

Ekspektasi Hasil (Expected):

Fitur Dynamic Gallery secara otomatis menampilkan seluruh media yang terlampir pada post (baik di editor maupun di halaman depan), patuh pada pengaturan sortir arah urutan data, serta dapat dikonversi menjadi galeri statis secara instan. Kolom kategori Attachments pada media inserter mendaftar gambar dengan akurat serta mendukung fungsi attach/detach yang langsung tersinkronisasi dengan kanvas galeri dinamis.

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan bug visual layouting atau masalah sinkronisasi gambar pada galeri baru ini, silakan kirimkan umpan balik Anda ke forum pengujian resmi dengan merujuk pada tautan Ticket #77117.

Video Panduan Pengujian Fitur Smarter Galleries:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Smarter Galleries)

Dasbor Admin (Dashboard)

Peningkatan Riwayat Revisi Visual (Visual Revisions Improvements)

Fitur Visual Revisions (yang diperkenalkan sejak versi 7.0) memungkinkan Anda membandingkan dan mengembalikan revisi konten masa lalu secara visual langsung di dalam editor. Di WordPress 7.1, alur kerja penyimpanan otomatis (autosaves) diintegrasikan dengan jauh lebih matang.

Kini, tombol “View the autosave” pada notifikasi autosave akan langsung membuka tampilan Visual Revisions (dengan data autosave terpilih dan perubahan konten langsung disorot secara visual) tanpa memicu pemuatan ulang halaman (no page reload), menggantikan layar revisi klasik bawaan lama. Proses pemulihan (restore) otomatis akan langsung menghilangkan notifikasi tersebut. Selain itu, baris autosave pada lini masa (timeline) revisi kini dilengkapi dengan badge bertuliskan “Autosave” yang jelas bagi mata pengembang maupun perangkat pembaca layar (screen readers).

Langkah-Langkah Pengujian:

1. Picu Autosave Server: Edit sebuah postingan yang sudah diterbitkan (published post), ubah sebagian kontennya, lalu tunggu hingga sistem memicu autosave server secara otomatis (atau jalankan perintah wp.data.dispatch( 'core/editor' ).autosave() pada Console browser Anda). Segarkan (reload) browser Anda tanpa mengeklik tombol simpan.
2. Buka Tampilan Revisi Visual: Pada jendela notifikasi autosave yang muncul di atas editor, klik tombol “View the autosave”. Konfirmasikan bahwa antarmuka Visual Revisions langsung terbuka dengan kondisi data autosave terpilih dan perubahan teks disorot dengan warna kontras tanpa memuat ulang halaman.
3. Uji Fungsi Restore: Klik tombol Restore (Kembalikan) dan pastikan konten dari autosave tersebut langsung diterapkan ke kanvas editor serta kotak notifikasi peringatan di atas otomatis menghilang.
4. Uji Jalur Fallback: Uji pada postingan yang fitur Visual Revisions-nya dinonaktifkan (misalnya halaman post yang masih menggunakan classic meta boxes). Pastikan tombol “View the autosave” dialihkan secara aman ke tampilan layar revisi klasik lama.
5. Periksa Badge Garis Waktu: Buka riwayat kiriman yang memiliki kombinasi revisi reguler dan autosave terbaru. Buka layar revisi dan pastikan baris autosave memiliki label badge “Autosave” yang membedakannya dari revisi kiriman biasa.

Ekspektasi Hasil (Expected):

Tombol “View the autosave” membuka tampilan Visual Revisions secara instan dengan penyorotan perubahan yang akurat, menutup notifikasi peringatan saat dipulihkan, beralih ke layar klasik dengan benar jika fitur revisi visual tidak aktif, serta memberikan identitas visual badge “Autosave” yang jelas pada lini masa.

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan error pada alur pemulihan visual ini, silakan kirimkan laporan Anda ke forum Alpha/Beta dengan merujuk pada dokumentasi Ticket Core #79120 (dikembangkan melalui PR #79947 dan PR #79950).

Video Panduan Pengujian Fitur Visual Revisions Improvements:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Visual Revisions Improvements)

Tampilan Cuplikan Teks untuk Postingan Tanpa Judul (Untitled Posts Excerpt)

Sebelumnya, postingan atau halaman yang tidak memiliki judul hanya akan menampilkan teks kaku (no title) pada tabel daftar postingan dasbor admin, membuat agensi atau developer kesulitan membedakan antar-konten kiriman tanpa judul tersebut.

Pada tampilan Compact View, WordPress 7.1 kini secara cerdas menambahkan cuplikan (trimmed excerpt) hingga 15 kata pertama dari isi konten tepat di belakang teks (no title). Informasi tambahan ini ditampilkan dengan bobot font yang lebih tipis (lighter font weight) agar postingan tanpa judul dapat diidentifikasi secara instan sekilas pandang.

Langkah-Langkah Pengujian:

1. Buat Postingan Tanpa Judul: Buat beberapa postingan baru tanpa mengisi judul, namun berikan variasi konten pembuka yang berbeda (konten teks biasa, blok layout, atau hanya memuat gambar saja).
2. Periksa Tabel Kiriman Dasbor: Buka halaman Posts → All Posts (Tulisan → Semua Tulisan) dan pastikan tampilan tabel admin diatur pada mode Compact view.
3. Verifikasi Injeksi Teks: Pastikan setiap baris postingan tanpa judul menampilkan teks (no title) yang diikuti oleh potongan kata isi kontennya (maksimal 15 kata, diakhiri tanda titik tiga/tanda elipsis ...) dengan warna font yang lebih abu-abu/tipis. Khusus untuk kiriman yang isi kontennya hanya diawali gambar tanpa teks, baris tabel hanya boleh menampilkan teks (no title) saja.
4. Periksa Kiriman Berjudul: Pastikan postingan yang memiliki judul normal tidak menampilkan cuplikan teks tambahan ini pada tabel.
5. Periksa Extended View: Pindah ke mode Extended view pada opsi tabel. Pastikan potongan cuplikan teks di belakang judul menghilang (karena pada mode ini cuplikan teks penuh sudah memiliki baris khususnya sendiri di bawah judul). Pindah kembali ke mode Compact View untuk memastikan teks cuplikan kembali muncul.
6. Uji Proteksi Password & Status Sampah: Buat postingan tanpa judul yang dilindungi kata sandi (password-protected), pastikan cuplikan teks disembunyikan dan hanya memunculkan teks (no title). Coba masukkan kiriman tanpa judul ke dalam tempat sampah (Trash) dan pastikan cuplikan teks tetap mendampingi label (no title).
7. Uji Fungsionalitas Tabel: Pastikan fitur pengurutan data (sorting), kolom pencarian admin, sistem halaman (pagination), serta fitur Quick Edit / Bulk Edit tetap bekerja 100% normal pada kiriman tanpa judul tersebut.

Ekspektasi Hasil (Expected):

Pada mode Compact view, baris postingan/halaman tanpa judul menampilkan identitas teks pembuka konten hingga 15 kata; aturan ini tidak bocor ke kiriman berjudul atau kiriman terproteksi; serta tidak merusak fungsionalitas inti tabel manajemen data dasbor admin.

Pelaporan Masalah & Umpan Balik:

Laporkan kejanggalan atau bug penataan teks daftar kiriman ini melalui forum dukungan resmi dengan menyertakan rujukan pelacakan di Ticket Trac #65022 (atau ikuti perkembangannya di PR #11553).

Video Panduan Pengujian Fitur Untitled Posts Show an Excerpt:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Untitled Posts Show an Excerpt)

Widget Dasbor Baru “On This Day” (Pada Hari Ini)

Sebuah komponen widget bawaan baru bernama “On This Day” kini hadir menghiasi halaman utama dasbor admin wp-admin. Widget ini berfungsi menampilkan daftar postingan dari semua penulis (all authors) yang pernah diterbitkan pada tanggal dan bulan yang sama di tahun-tahun terdahulu—memberikan kilas balik historis konten satu, dua, atau beberapa tahun lalu. Widget ini dirancang secara dinamis; ia akan otomatis tersembunyi jika pada tanggal hari ini tidak ada riwayat kiriman masa lalu, agar dasbor tetap bersih (namun opsi registrasinya tetap dapat ditemukan di bawah menu Screen Options atas).

Langkah-Langkah Pengujian:

1. Periksa Kondisi Kosong: Masuk ke dasbor utama admin. Jika tanggal hari ini pada tahun-tahun lalu situs Anda tidak memiliki riwayat publikasi artikel, pastikan widget “On This Day” tidak muncul atau tersembunyi secara default di dasbor.
2. Simulasikan Kiriman Masa Lalu: Buat sebuah postingan baru, lalu ubah pengaturan tanggal penerbitannya (publish date) mundur ke tanggal dan bulan yang sama dengan hari ini, namun setel tahunnya ke 1 atau 2 tahun yang lalu. Klik terbitkan.
3. Verifikasi Kemunculan Widget: Muat ulang halaman dasbor utama admin Anda. Pastikan widget “On This Day” kini muncul secara otomatis, menampilkan tajuk (heading) angka tahun kustom, dan mendaftar judul postingan tersebut di bawahnya.
4. Uji Tautan Konten: Klik pada judul postingan yang terdaftar di dalam widget dan pastikan tautan mengarah secara tepat ke permalink halaman depan (front-end) artikel tersebut.
5. Uji Multi-Penulis & Aturan Sortir: Jika kiriman masa lalu tersebut ditulis oleh user lain, pastikan baris judul menampilkan teks tambahan "by [nama penulis]". Jika kiriman tersebut ditulis oleh akun Anda sendiri, label nama penulis tidak boleh muncul. Tambahkan beberapa kiriman tiruan di tanggal hari ini lintas tahun lalu untuk memastikan data dikelompokkan berdasarkan tahun dengan urutan tahun terbaru di posisi atas (maksimal menampilkan 10 post).
6. Uji Batasan Filter Tanggal: Pastikan kiriman yang diterbitkan pada hari ini di tahun berjalan (tahun ini) tidak masuk ke dalam daftar widget. Pastikan juga kiriman dari bulan atau tanggal yang berbeda tidak ikut bocor ke dalam widget.

Ekspektasi Hasil (Expected):

Widget tersembunyi secara otomatis saat tidak ada data yang cocok; muncul dengan struktur pengelompokan berdasarkan tahun (tahun terbaru di atas) saat terdeteksi adanya arsip publikasi lintas tahun di tanggal yang sama; mendukung identitas multi-penulis; serta memetakan tautan permalink dengan akurat.

Pelaporan Masalah & Umpan Balik:

Setiap kendala pemuatan data query tanggal atau ketidaksesuaian tampilan pada widget dasbor baru ini dapat dilaporkan secara formal melalui tautan Ticket Trac #65116.

Video Panduan Pengujian Fitur Widget Dasbor “On This Day”:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Widget Dasbor “On This Day”)

Mengubah Induk Utas Komentar (Re-parent a Comment)

Memperbaiki posisi balasan komentar yang salah kamar (misthreaded comment) sebelumnya mengharuskan developer agensi untuk membongkar dan mengubah struktur data tabel database MySQL secara manual.

WordPress 7.1 menyelesaikan masalah ini dengan menambahkan opsi kontrol “In reply to” yang dapat disunting secara visual langsung di dalam kotak pengaturan Save box pada layar Edit Comment dasbor admin. Fitur ini memungkinkan Anda memindahkan komentar ke induk komentar lain melalui pilihan menu dropdown, atau memilih opsi None untuk mengubah komentar balasan tersebut naik kasta menjadi komentar utama (top-level comment). Cakupan pemindahan ini dibatasi strictly hanya di dalam lingkup post yang sama untuk mencegah terjadinya looping hierarchy error.

Langkah-Langkah Pengujian:

1. Buka Layar Edit Komentar: Pada postingan yang memiliki aktivitas komentar berutas (threaded comments), pergi ke menu dasbor admin wp-admin → Comments. Klik tombol Edit pada salah satu komentar yang berstatus sebagai balasan (reply).
2. Ubah Kaitan Induk Komentar: Di dalam area kotak Save box sebelah kanan, cari kolom label “In reply to:”, lalu klik tombol Edit di sampingnya. Pilih komponen komentar induk baru dari menu dropdown yang tersedia. (Catatan: Data komentar itu sendiri dan baris komentar anak di bawahnya otomatis dieliminasi dari daftar dropdown oleh sistem untuk mencegah kerusakan struktur loop).
3. Simpan Perubahan: Klik OK, lalu tekan tombol Update.
4. Verifikasi Tampilan Depan: Buka halaman kiriman tersebut di halaman depan (front-end) situs web Anda. Pastikan posisi hierarki komentar tersebut sudah berpindah dan bersarang secara rapi di bawah struktur komentar induk yang baru Anda pilih tadi.
5. Uji Naik Tingkat ke Top-Level: Masuk kembali ke layar edit komentar yang sama, ubah pilihan kontrol “In reply to:” menjadi None, lalu klik Update. Verifikasikan di halaman depan bahwa komentar tersebut kini telah berdiri sendiri sebagai komentar utama (top-level comment).

Ekspektasi Hasil (Expected):

Pengguna dapat mengubah relasi kaitan induk komentar (atau membersihkannya menjadi komentar utama) secara aman langsung dari antarmuka visual layar Edit Comment, sistem mengunci loop hierarki dengan baik, serta perubahan ter-rendering dengan sempurna di halaman depan bagi pengunjung.

Pelaporan Masalah & Umpan Balik:

Setiap temuan bug relasi komentar dinamis ini dapat dikirimkan ke forum Alpha/Beta dengan merujuk pada nomor pelacakan resmi core di Ticket Trac #65570 (atau periksa detail PR #12406).

Video Panduan Pengujian Fitur Re-parent a Comment:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Re-parent a Comment)

Pengembangan & Optimasi Blok (Blocks)

Blok Playlist Audio (Playlist Block)

Blok Playlist baru memungkinkan Anda untuk memutar daftar trek audio langsung dengan komponen pemutar gelombang suara (interactive waveform player) serta daftar putar (track list). Anda tinggal menambahkan file audio Anda sendiri, memutarnya di dalam editor maupun di halaman depan (front-end), serta menyesuaikan gaya visual waveform dan daftar trek lewat panel pengaturan blok. Secara struktur komponen, blok ini tersusun atas: Playlist → Playlist track (satu blok untuk tiap trek).

Langkah-Langkah Pengujian:

1. Tambahkan Blok Playlist: Masukkan blok Playlist baru ke dalam halaman, lalu unggah beberapa file audio (misalnya berformat MP3). Pastikan sebuah trek baru otomatis ditambahkan untuk setiap file, lengkap dengan tampilan waveform player dan track list.
2. Uji Fungsi Pemutaran: Tekan tombol play dan pastikan audio berputar dengan lancar. Klik trek lain di dalam daftar dan pastikan sistem otomatis berpindah trek. Simpan halaman dan periksa di halaman depan (front-end) untuk memastikan fungsi pemutaran audio berjalan sama baiknya.
3. Uji Gaya Visual Waveform: Di bagian pengaturan blok sebelah kanan, buka panel Waveform dan coba ubah pilihan gaya visualisasinya (Visualization style): Bars, Mirror, Line, Blocks, Dots, atau Seekbar. Pastikan bentuk visual gelombang suara langsung terupdate di editor maupun di front-end.
4. Uji Kustomisasi Warna: Atur warna gelombang suara (waveform color) dan warna latar belakang gelombang suara (waveform background color)—coba gunakan juga pilihan warna gradien (gradient options). Pastikan kombinasi warna tersebut ter-rendering dengan benar di kedua sisi antarmuka.
5. Uji Toggle Track-List: Aktifkan dan nonaktifkan opsi pengaturan daftar trek: Show tracklist, Show images (pilihan gambar miniatur sampul album), Show artists, Show numbers, serta Show track length. Pastikan setiap elemen muncul atau tersembunyi dengan tepat sesuai toggle yang Anda pilih.
6. Uji Artwork Tombol Play: Aktifkan opsi Show play button artwork dan pastikan gambar sampul (artwork) dari trek audio yang sedang aktif muncul di dalam lingkaran tombol play.
7. Uji Pengaturan Tipografi: Ubah ukuran font (font size) pada panel pengaturan tipografi blok, lalu pastikan perubahan tersebut diterapkan dengan benar pada teks daftar trek (track list) dan teks judul trek yang sedang aktif.
8. Uji Layouting Spasi & Bingkai: Atur warna latar belakang (background color), jarak spasi dalam/luar (padding/margin), serta bingkai (border) pada blok Playlist utama. Pastikan visualnya diterapkan secara konsisten di editor dan front-end.

Ekspektasi Hasil (Expected):

Audio dapat diputar di editor dan front-end; seluruh gaya visualisasi, warna, dan latar belakang waveform ter-rendering dengan benar; semua tombol toggle daftar trek dan tampilan artwork tombol play berfungsi penuh; serta pengaturan warna, jarak spasi, bingkai, dan tipografi blok diterapkan secara konsisten di semua sisi.

Pelaporan Masalah & Umpan Balik:

Jika Anda menemukan error pemutaran atau cacat visual layouting pada blok ini, silakan laporkan ke forum Alpha/Beta dengan merujuk pada detail Pull Request GitHub #80203 serta halaman tiket iterasi di Issue #77421.

Video Panduan Pengujian Fitur Playlist Block:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Playlist Block)

Blok Tab Konten (Tabs Block)

Blok Tabs bawaan berfungsi untuk mengorganisasikan konten ke dalam beberapa panel tab yang dapat diklik—memungkinkan pengguna mengklik label tab tertentu untuk memunculkan panel konten yang sesuai ke area pandang tanpa memenuhi seluruh halaman web. Struktur blok ini terdiri atas: Tabs → Tab List (barisan tombol-tombol tab) dan Tab Panels → Tab Panel (satu panel konten khusus untuk masing-masing tab). Komponen label dan panel terikat dan tersinkronisasi secara otomatis, sehingga aktivitas menambah, menghapus, atau mengatur ulang urutan posisi tab akan langsung memperbarui posisi panel pasangannya.

Langkah-Langkah Pengujian:

1. Tambahkan Blok Tabs: Masukkan blok Tabs baru. Pastikan sistem otomatis menyisipkan sebuah struktur daftar tab yang memuat dua tab standar beserta dua panel konten yang cocok. Coba tambah tab baru, hapus salah satu tab, dan ubah urutan posisinya, lalu pastikan panel di bawahnya ikut tersinkronisasi secara instan setiap kali terjadi perubahan.
2. Uji Gaya Global & Kustom: Masuk ke bagian Site Editor (Styles → Blocks → Tabs) untuk mengatur gaya visual komponen Tab List secara global. Pastikan gaya tersebut diterapkan pada elemen tombol-tombol tab (kecuali untuk pengaturan block gap). Coba timpa gaya tersebut (override) pada satu instans blok tombol individu dan pastikan hanya instans tombol itu saja yang berubah.
3. Uji Kontras Warna Latar: Ubah warna latar belakang (background color) blok tab dan pastikan teks tombol tab beserta garis bingkainya tetap dapat terbaca dengan jelas (warna teks dan bingkai harus otomatis mewarisi kontras warna teks yang aktif saat ini).
4. Inspeksi Struktur HTML Markup: Lakukan inspect element pada kode HTML markup. Pastikan komponen tab dan panel terhubung secara tepat melalui kode ID unik yang digenerasikan secara otomatis oleh sistem. Coba atur ID panel secara manual (custom panel ID) dan pastikan sistem menghormati serta menerapkan ID kustom tersebut.
5. Uji Fungsi Perpindahan Tab: Simpan halaman Anda dan periksa di halaman depan (front-end). Klik pada label-label tab yang berbeda dan pastikan panel konten langsung berganti memunculkan data yang tepat.
6. Uji Aksesibilitas Standar W3C: Di halaman depan, uji navigasi menggunakan keyboard Anda. Tekan tombol Tab untuk mengarahkan fokus ke barisan tab dan panel, gunakan tombol panah Kiri / Kanan untuk berpindah antar-label tab, dan tekan Enter untuk mengaktifkan tab terpilih. Saat menggunakan perangkat pembaca layar (screen reader), pastikan atribut aria-label bawaan (default berbunyi “Tabbed content”) ikut diumumkan dengan benar.

Ekspektasi Hasil (Expected):

Struktur komponen tab dan panel tetap tersinkronisasi dengan sempurna; pengaturan gaya Global Styles pada Tab List diterapkan ke seluruh tombol tab namun tetap dapat ditimpa secara per instans blok; kaitan ID otomatis maupun manual terpetakan dengan benar; serta blok mematuhi pola aksesibilitas standard W3C tabs secara penuh.

Pelaporan Masalah & Umpan Balik:

Setiap temuan masalah aksesibilitas atau kegagalan sinkronisasi layout pada blok Tab baru ini dapat Anda laporkan ke forum pengujian resmi dengan memantau perkembangan teknisnya di Pull Request GitHub #80163 serta halaman Issue #73230.

Video Panduan Pengujian Fitur Tabs Block:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Tabs Block)

Penyatuan Gradien dan Gambar Latar Belakang (Background Gradients & Images Coexistence)

Di WordPress 7.1, sistem pewarnaan latar belakang mengalami perbaikan besar di mana pengaturan gradien latar belakang (background gradients) dan gambar latar belakang (background images) tidak akan lagi saling bentrok atau menimpa satu sama lain. Pada versi sebelumnya, pemberian gradien akan otomatis tertimpa secara sepihak jika blok diberi gambar latar belakang.

Kini, kedua elemen desain tersebut dapat dikombinasikan dan ditampilkan secara bersamaan (render together). Perbaikan sistem visual ini diterapkan langsung pada beberapa blok inti bawaan berikut: Group, Verse, Accordion, Pullquote, Post Content, dan Quote.

Langkah-Langkah Pengujian:

1. Tambahkan Blok yang Mendukung: Masukkan salah satu blok yang didukung ke kanvas editor—misalnya, blok Group—lalu isi dengan sedikit konten teks.
2. Set Gambar Latar Belakang: Masuk ke bagian panel pengaturan Styles di sisi kanan, pilih opsi Media, lalu pasang sebuah gambar latar belakang pada blok tersebut.
3. Set Gradien Latar Belakang: Pada blok yang sama, buka pengaturan warna latar belakang dan terapkan warna jenis gradien (background gradient).
4. Verifikasi Tampilan Editor: Konfirmasikan bahwa gambar latar belakang dan warna gradien tampil secara bersamaan di dalam kanvas editor, tanpa ada salah satu elemen yang membatalkan atau menutupi elemen lainnya.
5. Verifikasi Halaman Depan: Simpan draf kiriman Anda dan lihat hasilnya di halaman depan (front-end). Pastikan perpaduan gradien dan gambar latar belakang ter-rendering dengan sempurna bagi pengunjung.
6. Uji Lintas Blok: Ulangi langkah di atas pada minimal satu blok didukung lainnya (seperti blok Verse, Accordion, Pullquote, Post Content, atau Quote) dengan mencoba beberapa variasi kombinasi gambar dan gradien warna yang berbeda.

Ekspektasi Hasil (Expected):

Setiap blok yang didukung—Group, Verse, Accordion, Pullquote, Post Content, dan Quote—dapat menampilkan gambar latar belakang dan gradien latar belakang secara bersamaan dan bertumpuk secara rapi tanpa ada konflik kode visual, baik di dalam editor maupun di halaman depan situs web.

Pelaporan Masalah & Umpan Balik:

Jika Anda melihat salah satu elemen latar belakang hilang atau terhapus saat dikombinasikan, Anda bisa melaporkannya di forum Alpha/Beta dengan merujuk pada rangkaian catatan pengembang di PR #75859, PR #79391, serta rangkaian tiket perbaikan visual dari PR #79840 hingga PR #79843.

Video Panduan Pengujian Penyatuan Gradien & Gambar Latar Belakang:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Penyatuan Gradien & Gambar Latar Belakang)

Pilihan “Mark as decorative” pada Blok Gambar (Image Block Decorative Toggle)

Komponen blok Gambar (Image block) kini dibekali dengan tombol pilihan (toggle) baru bernama “Mark as decorative” (Tandai sebagai dekoratif) yang berfungsi khusus untuk menyembunyikan gambar dari jangkauan perangkat pembaca layar (screen readers). Fitur ini sangat berguna untuk menandai aset gambar yang murni hanya berfungsi sebagai dekorasi estetika visual website (seperti gambar latar pelengkap, ornamen pembatas halaman, atau aksen pemanis visual lainnya) sehingga teknologi asistif pembaca layar akan otomatis melompati gambar tersebut demi memberikan pengalaman navigasi yang jauh lebih bersih dan efisien bagi pengguna disabilitas.

Langkah-Langkah Pengujian:

1. Tambahkan Blok Gambar: Masukkan blok Image baru ke dalam postingan atau halaman Anda, lalu pilih atau unggah sebuah gambar baru.
2. Aktifkan Toggle Dekoratif: Buka bilah pengaturan blok (Settings sidebar) di sebelah kanan, cari komponen tombol toggle bertuliskan “Mark as decorative”.
3. Nyalakan Pilihan: Geser tombol toggle tersebut ke posisi aktif (Turn it on).
4. Inspeksi Struktur HTML: Lakukan inspect element pada markup kode gambar di dalam editor. Pastikan tag gambar mendapatkan nilai atribut alt kosong (alt=""), atau bermuatan kode atribut role="presentation" / aria-hidden="true" (tergantung pada jenis output rendering tema) sehingga diverifikasi akan diabaikan oleh perangkat pembaca layar.
5. Verifikasi Halaman Depan: Simpan halaman Anda, buka di halaman depan (front-end), dan lakukan inspeksi kode untuk memastikan struktur markup dekoratif tersebut tetap ter-rendering dengan benar di sisi pengunjung.
6. Uji Pengembalian Atribut: Matikan kembali tombol toggle dekoratif tersebut ke posisi nonaktif, isi kolom Alt Text dengan teks deskripsi yang bermakna, lalu pastikan gambar tersebut kembali dapat terbaca dan diumumkan secara normal oleh teknologi pembaca layar.

Ekspektasi Hasil (Expected):

Saat tombol toggle dekoratif aktif, gambar berhasil disembunyikan dari teknologi pembaca layar melalui penyediaan kode atribut khusus (empty/presentation alt); sedangkan saat toggle dimatikan dan kolom teks alternatif diisi, gambar kembali dibaca secara normal oleh sistem aksesibilitas.

Pelaporan Masalah & Umpan Balik:

Jika tombol toggle gagal mengosongkan nilai alt atau merusak output visual gambar, silakan buat laporan Anda di forum Alpha/Beta dengan merujuk pada catatan Pull Request GitHub #78064.

Video Panduan Pengujian Fitur Toggle “Mark as decorative”:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Toggle “Mark as decorative”)

Blok yang Dapat Diedit di Dalam Blok Custom HTML (Editable Blocks Inside Custom HTML)

Blok Custom HTML kini memiliki kemampuan tingkat lanjut untuk menampung dan mempertahankan blok-blok yang dapat diedit (editable blocks) di dalam sebuah susunan struktur kode HTML yang bersifat statis. Fitur ini didukung oleh sistem arsitektur baru bernama innerContent block support.

Kemampuan ini sangat ideal untuk menangani struktur kode markup yang dibuat secara manual (hand-built markup) atau kode tergenerasi oleh kecerdasan buatan (AI), di mana sebagian besar baris kode HTML utama dikunci agar posisinya tetap statis, tetapi Anda menandai bagian-bagian tertentu di dalamnya—seperti baris paragraf atau elemen gambar—sebagai area yang bebas disunting secara visual. Blok dinamis di dalam kode HTML statis ini akan duduk di posisi yang presisi namun status posisinya terkunci: mereka tidak dapat dipindahkan, dihapus, atau disisipi blok baru, serta tidak memunculkan kontrol pengaturan perataan layout (alignment controls). Anda dapat menyisipkan area blok yang dapat diedit ini dengan menuliskan kode pembatas blok resmi (block delimiter) di dalam kolom kode Custom HTML Anda, misalnya: ….

Langkah-Langkah Pengujian:

1. Tambahkan Blok Custom HTML: Masukkan sebuah blok Custom HTML baru ke dalam halaman atau postingan Anda, lalu buka jendela modal atau mode Edit HTML.
2. Masukkan Kode Sampel Delimiter: Tempelkan (paste) baris kode contoh di bawah ini—yang memuat struktur kode HTML statis dengan sebuah blok Paragraf bawaan di tengahnya—lakh klik tombol Update:HTML<div class="banner"> <h1>Static heading</h1> <p>Editable paragraph</p> <footer>Static footer</footer> </div>
3. Uji Penyuntingan Visual: Konfirmasikan bahwa teks paragraf di dalam kode tersebut berhasil ter-rendering tepat pada posisinya di dalam struktur HTML statis dan dapat diklik untuk diedit secara langsung di tempat (editable in place). Coba ketik teks tambahan di dalamnya.
4. Verifikasi Status Terkunci: Pastikan elemen paragraf tersebut tidak dapat dipindahkan atau dihapus (tidak ada tombol penggeser naik/turun toolbar, dan tidak ada opsi Delete pada menu pilihan tiga titik). Pastikan juga tombol kontrol pengaturan rata kanan/kiri/tengah (alignment controls) disembunyikan oleh sistem.
5. Periksa Struktur Navigator Inspector: Buka panel inspector blok di sebelah kanan dan pastikan daftar struktur blok anak (inner blocks list) muncul dengan rapi, berfungsi sebagai alat bantu navigasi cepat menuju bagian-bagian konten yang dapat diedit.
6. Uji Konsistensi Kode Simpan: Simpan postingan tersebut lalu muat ulang (reload) halaman editor Anda. Pastikan seluruh struktur kode markup yang disimpan tetap identik dan tidak mengalami perubahan karakter byte dengan kode awal yang Anda masukkan, serta hasil editan teks paragraf Anda tersimpan dengan aman pada posisinya.
7. Verifikasi Tampilan Front-End: Lihat halaman tersebut di sisi depan (front-end) dan pastikan seluruh susunan kerangka struktur data (elemen judul statis, teks paragraf yang telah diedit, serta bagian kaki halaman statis) tampil secara utuh dan benar bagi pengunjung.
8. Uji Cek Regresi: Buat sebuah blok Custom HTML biasa yang hanya memuat konten statis murni tanpa kode pembatas blok (block delimiter). Edit dan simpan, lalu pastikan baris kode statis tersebut sama sekali tidak terpengaruh atau berubah. (Catatan Penting: Demi keamanan kanvas editor, eksekusi skrip/javascript kini sengaja dinonaktifkan di dalam pratinjau kanvas editor—gaya CSS tetap diaplikasikan—namun skrip javascript dipastikan tetap berjalan normal 100% di halaman front-end).

Ekspektasi Hasil (Expected):

Baris blok yang dibatasi kode delimiter resmi berhasil berubah menjadi area yang dapat diedit langsung di tempat di dalam struktur blok Custom HTML; posisinya terkunci rapat dari aktivitas pindah/hapus/sisip; terdaftar di navigator inner blocks list; serta menjaga integritas baris kode yang disimpan tetap identik tanpa merusak fungsi blok Custom HTML statis reguler.

Pelaporan Masalah & Umpan Balik:

Jika kode delimiter yang Anda masukkan merusak visual HTML kustom Anda atau gagal memicu area pengeditan visual, silakan kirimkan detail temuan Anda ke forum Alpha/Beta dengan memantau perkembangannya di Pull Request GitHub #79115.

Video Panduan Pengujian Editable Blocks Inside Custom HTML:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Editable Blocks Inside Custom HTML)

Transformasi Otomatis Shortcode ke Blok Embed (Embed Shortcode Transform)

Melakukan penempelan (pasting) atau aktivitas konversi terhadap baris kode shortcode embed kini secara otomatis akan menghasilkan sebuah komponen blok Embed yang semestinya dan berfungsi dengan benar, alih-alih hanya meninggalkan baris teks kode shortcode mentah yang tidak ter-rendering di kanvas editor seperti pada versi terdahulu.

Langkah-Langkah Pengujian:

1. Buka Post Editor: Akses halaman penyuntingan kiriman (Post editor).
2. Pindah ke Code Editor: Masuk ke mode penyuntingan kode teks dengan mengubah mode tampilan editor menjadi Code Editor (Ctrl/Cmd + Alt + Shift + M).
3. Masukkan Shortcode Embed: Tempelkan sebuah baris kode embed shortcode resmi (misalnya shortcode video atau audio eksternal yang valid).
4. Kembali ke Visual Editor: Ubah kembali tampilan editor Anda menuju mode Visual Editor.
5. Jalankan Konversi: Klik pada tombol toolbar blok klasik bertuliskan “Convert to blocks” (Konversi ke blok).
6. Verifikasi Hasil: Terapkan perintah transformasi tersebut dan konfirmasikan bahwa baris kode shortcode tadi telah bersih dikonversikan menjadi sebuah blok Embed resmi yang langsung menampilkan kotak pratinjau konten secara interaktif di dalam kanvas editor serta merender datanya dengan sempurna di halaman depan (front-end).

Ekspektasi Hasil (Expected):

Baris kode embed shortcode berhasil dikonversikan secara bersih dan instan menjadi komponen blok Embed resmi yang mampu menampilkan pratinjau data secara interaktif di dalam editor serta berjalan lancar saat diakses pengunjung di front-end.

Pelaporan Masalah & Umpan Balik:

Laporkan kegagalan konversi atau adanya teks shortcode yang tertinggal setelah transformasi ke area forum dukungan Alpha/Beta dengan merujuk pada dokumentasi detail teknis di Pull Request GitHub #77937.

Video Panduan Pengujian Fitur Embed Shortcode Transform:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Embed Shortcode Transform)

Transformasi Spesifik pada Blok Shortcode (Shortcode Block Transforms)

Ketika baris teks kode di dalam sebuah blok Shortcode terdeteksi cocok dengan jenis data shortcode bawaan yang telah terregistrasi secara resmi di dalam sistem core WordPress (seperti kode

, , atau ), komponen editor kini akan secara otomatis menawarkan menu pilihan opsi transformasi satu-klik untuk mengubah kode tersebut menjadi blok padanannya yang setara (equivalent block). Kehadiran fitur ini akan sangat mempermudah agensi dan pengembang dalam memodernisasi konten-konten lama berbasis shortcode klasik (legacy shortcode content) menuju era blok modern yang ramping.

Langkah-Langkah Pengujian:

1. Tambahkan Blok Shortcode: Masukkan sebuah blok Shortcode baru ke dalam halaman pengujian Anda.
2. Isi dengan Shortcode Terdaftar: Ketik atau tempelkan baris kode shortcode resmi yang didukung sistem (misalnya menuliskan shortcode galeri gambar bawaan seperti ).
3. Verifikasi Munculnya Opsi Transformasi: Konfirmasikan bahwa sebuah ikon menu opsi transformasi otomatis muncul pada bilah toolbar blok, menawarkan pilihan untuk mengubah shortcode tersebut menjadi blok kustom padanannya (seperti mengubah ke blok Gallery, blok Audio, atau blok Video).
4. Eksekusi Transformasi: Klik pada pilihan tombol transformasi tersebut.
5. Verifikasi Rendering Konten: Pastikan komponen blok baru yang dihasilkan berhasil merender dan menampilkan isi data konten yang sama persis dengan data awal di dalam shortcode. Simpan halaman dan periksa di sisi depan (front-end) untuk memastikan output tampilan data yang keluar cocok dan identik dengan hasil eksekusi kode shortcode aslinya.

Ekspektasi Hasil (Expected):

Baris kode shortcode yang terdaftar secara otomatis memicu opsi menu satu-klik untuk bertransformasi menuju blok padanannya yang setara, serta menghasilkan rendering visual konten yang konsisten dan akurat baik di kanvas editor maupun di halaman depan situs.

Pelaporan Masalah & Umpan Balik:

Setiap kendala pemetaan fungsi atau hilangnya opsi menu transformasi pada blok shortcode ini dapat dikirimkan langsung ke forum pengujian resmi dengan memantau rekam jejak teknisnya di Pull Request GitHub #77944.

Video Panduan Pengujian Fitur Shortcode Block Transforms:

(Anda bisa klik gambar di bawah ini untuk menampilkan video Panduan Pengujian Fitur Shortcode Block Transforms)