Cara Menggunakan Editor Penampilan di WordPress

wordpress-appearance-editor.png


Hingga saat ini, Anda memiliki kesempatan untuk menyesuaikan CMS WordPress melalui berbagai editor yang mudah digunakan. Penyesuai memungkinkan Anda untuk menjajakan opsi tampilan berbeda yang didukung tema Anda. Tetapi ketika Anda memutuskan untuk mempersonalisasi situs Anda di luar opsi yang diberikan, Anda harus tahu tentang Editor Penampilan WordPress.

Di antara banyak file di WordPress yang dapat dimodifikasi, ada dua yang sangat menarik. Kita berbicara tentang templat tema dan file stylesheet yang dapat Anda edit langsung dari WordPress.

Bahkan sebelum Anda mulai mempertimbangkan untuk mengubah kode sendiri, kami harus memperingatkan Anda bahwa WordPress tidak membuat cadangan file yang terpengaruh. Jadi, setiap perubahan bersifat permanen.

Cara mengedit tema dengan Editor Penampilan

Ketika Anda siap untuk belajar lebih banyak tentang WordPress dan membuat tangan Anda kotor dengan mengetikkan beberapa kode khusus, navigasikan ke Penampilan -> Editor. Editor bawaan ini memungkinkan Anda mengubah kode yang disimpan dalam templat tema dan file stylesheet. Setelah Anda membukanya, file style.css yang digunakan tema Anda saat ini akan secara otomatis ditampilkan di depan Anda.

Editor Penampilan WordPress

Bergantung pada pengaturan situs Anda, Anda mungkin tidak dapat mengakses beberapa file. Jika demikian, WordPress akan menampilkan pesan peringatan untuk memberi tahu Anda bahwa Anda perlu mengubah izin file untuk file tersebut. Untuk mempelajari lebih lanjut, lihat cara mengubah izin file di WordPress.

Cara memilih file untuk diedit

Segera setelah Anda membuka Editor, WordPress akan menunjukkan kepada Anda semua template dan file stylesheet yang tersedia dari tema aktif. Jika Anda ingin mengedit tema yang tidak aktif, buka bagian atas daftar, pilih item dari menu drop-down dan klik tombol “Pilih”. WordPress kemudian akan memuat semua file yang terkait dengan tema yang dipilih.

Templat

Untuk memilih file, buka daftar di sisi kanan jendela. Masing-masing memiliki nama dan nama file yang ditunjukkan dalam tanda kurung di bawah ini. Untuk mengedit file, klik saja dan kode akan muncul di editor sebelah kiri.

Hati-hati

Meskipun mengedit file stylesheet relatif aman, mengedit file PHP dapat menyebabkan kesalahan yang dapat membuat situs Anda tidak dapat digunakan. Berhati-hatilah jika Anda memutuskan untuk mengedit file PHP dari Appearance Editor.

Contoh: Cara mengubah ukuran font melalui Editor Penampilan

Untuk menunjukkan kepada Anda bagaimana editor bekerja, kami akan mengubah ukuran font teks dalam posting di tema Twenty Seventeen.

Sebelum kami melanjutkan, kami ingin menggagalkan perhatian Anda untuk sesaat. Di versi 4.7, WordPress diperkenalkan fitur baru yang memungkinkan Anda menambahkan CSS khusus lebih cepat. Alih-alih mengedit kode melalui Editor Penampilan, kami sarankan untuk membuka Penampilan -> Kustomisasi -> CSS tambahan di mana Anda bisa menulis kode CSS khusus yang Anda inginkan tanpa secara langsung mempengaruhi stylesheet.

Periksa elemen

Periksa elemen di Google Chrome

Jika Anda masih ingin mengedit stylesheet secara langsung melalui Editor Penampilan, inilah yang harus dilakukan:

  1. Buka pos apa pun dari blog Anda
  2. Pilih teks posting
  3. Klik kanan pada pilihan dan pilih “Inspect” atau “Inspect Element” (tergantung pada browser yang Anda gunakan)
  4. Di bagian atau jendela baru yang dibuka, cari yang disorot

    elemen

Periksa elemen paragraf

Kelas juga harus terlihat di tab “Gaya”. Jika Anda mengklik style, browser Anda harus membuka stylesheet dan memungkinkan Anda untuk mengedit CSS langsung dari browser. Anda dapat menggunakan fungsi ini untuk menguji kode CSS khusus sebelum benar-benar menerapkan perubahan pada situs Anda. Karena kami ingin mengubah ukuran font teks dalam posting, kode CSS berikut ini sesuai minat kami:

p {
ukuran font: 50px;
}

Menerapkan perubahan

Setelah menguji beberapa ukuran font dari browser, ingat salah satu yang paling Anda sukai. Kemudian Anda dapat melanjutkan ke Editor dan memodifikasi font:

  1. Navigasi ke Penampilan -> Editor
  2. Jika belum dipilih, pilih Stylesheet (style.css) file dari daftar di sebelah kanan
  3. Temukan kelas “p”
  4. Tambahkan “font-size: 50px;” (seluruh kode harus seperti yang kita tulis di atas)
  5. Klik tombol “Perbarui File”

Ubah ukuran font paragraf

Gaya baru disimpan, dan Anda siap memuat ulang situs. Buka sembarang pos untuk melihat perubahan ukuran teks. Jika Anda tidak dapat melihat perbedaannya, dan Anda yakin telah menyesuaikan kode dengan benar, pastikan Anda melakukannya hapus cache browser atau tekan CTRL + F5 untuk menyegarkan halaman.

Berhati-hatilah saat bekerja dengan Penampilan Editor

Penampilan Editor adalah alat luar biasa untuk melakukan perubahan cepat ke file template dan stylesheet. Tetapi untuk memanfaatkan yang terbaik, Anda harus yakin sepenuhnya tentang perubahan yang Anda lakukan. Setiap perubahan pada file PHP dapat mengunci situs Anda sampai Anda memperbaikinya melalui FTP. Jadi, ketika bekerja dengan file PHP, kami sarankan Anda bekerja pada file lokal yang dapat Anda transfer melalui FTP sambil menjaga cadangan asli setiap saat. Jika melakukan modifikasi pada stylesheet, jangan lupa tentang fitur CSS tambahan yang diperkenalkan beberapa bulan yang lalu.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map