Daftar isi
Permintaan yang cukup umum terkait dengan menyembunyikan bagian tertentu di situs web yang tidak memiliki tombol on/off sendiri di sisi admin. Karena tidak mungkin memiliki tombol admin tema untuk setiap detail di frontend, Anda cukup menyembunyikan bagian yang tidak diinginkan menggunakan CSS jika Anda sama sekali tidak terbiasa dengan pengeditan kode HTML untuk menghapus bagian tersebut.
Temukan bagian yang akan dihapus
Anda dapat menggunakan alat pengembang peramban untuk menemukan bagian persis yang ingin Anda hapus.
Katakanlah Anda ingin menghapus bagian dengan tanggal dan penulis di bawah posting blog, dengan klik kanan pada bagian ini Periksa Elemen dan buka alat pengembang browser:
Memindahkan kursor mouse ke kode sumber Anda, Anda dapat melihat bagian yang disorot pada halaman yang merujuk ke baris kode sumber di bawah kursor mouse Anda:
Dengan cara ini Anda dapat menemukan par yang ingin Anda sembunyikan – misalnya mengacu pada tangkapan layar di atas jika itu semua bagian dengan tanggal dan penulis, atau hanya bagian tanggal, atau hanya bagian penulis.
Tulis CSS untuk menyembunyikan bagian yang dipilih
Saat Anda telah memilih bagian yang ingin Anda sembunyikan, gunakan atribut ID atau CLASS dari tag HTML yang dipilih dalam gaya CSS Anda sendiri, atau gunakan pemilih CSS yang tepat yang digunakan oleh tema untuk tag ini. Pemilih CSS untuk tag terpilih yang digunakan oleh tema dapat Anda temukan di sisi kanan alat pengembang browser.
Misalnya, jika Anda memutuskan untuk menghapus seluruh bagian dengan tanggal dan penulis, pemilih yang digunakan oleh tema adalah: .elm-posts-main .item .item-info
Gaya CSS untuk menyembunyikan tag HTML di samping adalah "display: none;", Anda juga bisa menggunakan !penting pernyataan untuk mencegah penimpaan lebih lanjut dari gaya CSS dengan CSS lain.
Jadi gaya CSS terakhir untuk menyembunyikan bagian dengan tanggal dan penulis adalah:
.elm-posts-main .item .item-info { tampilan: tidak ada !penting; }
Tambahkan kode CSS khusus ke dalam Penyesuai
Anda dapat menambahkan kode CSS khusus ke dalam Penampilan > Sesuaikan > CSS tambahan
Setelah diterbitkan, Anda dapat memeriksanya di situs web Anda:
