Cara mengedit Header di WordPress – 3 Metode Mudah

Header adalah salah satu area terpenting dari situs web mana pun. Itu ada di bagian atas halaman dan muncul di hampir setiap halaman situs Anda sehingga Anda harus menyesuaikannya dan menggunakannya dengan cerdas. Banyak pengguna kami meragukan hal ini, jadi inilah panduan langkah demi langkah tentang cara mengedit header di WordPress .

WordPress yang dihosting sendiri adalah Sistem Manajemen Konten (CMS) terbaik dan paling nyaman di luar sana untuk membuat apa pun yang Anda inginkan. Saat Anda memulai sebuah situs, yang Anda butuhkan hanyalah mendaftar ke hosting, menginstal WordPress, dan menulis konten. Sesederhana itu. Namun, jika Anda ingin melepaskan semua kekuatan WordPress dan memanfaatkannya sebaik mungkin, Anda harus menyesuaikannya.

Salah satu penyesuaian paling sederhana dan penting yang dibutuhkan setiap pengguna adalah mengubah tajuk situs web. Pada artikel ini, kami akan menunjukkan kepada Anda bagaimana Anda dapat mengedit header di WordPress tanpa menyewa freelancer apa pun .

Apa tajuk WordPress?

Di WordPress, header adalah elemen di bagian atas halaman web. Elemen ini muncul di setiap halaman situs dan biasanya berisi logo, menu untuk mengakses berbagai bagian situs, bilah pencarian, dan informasi kontak. Di toko eCommerce, juga umum untuk melihat keranjang dan produk yang Anda tambahkan ke dalamnya. Misalnya, di QuadLayers, header adalah bilah atas yang Anda lihat di setiap halaman.

Mengapa mengedit header di WordPress?

Header adalah salah satu area terpenting di situs web Anda. Ini adalah hal pertama yang dilihat pengunjung saat mereka membuka situs Anda dan, seperti yang mungkin Anda ketahui, kesan pertama itu penting. Menurut sebuah studi baru-baru ini, pengguna memutuskan dalam 0,05 detik apakah mereka menyukai situs web Anda atau tidak, dan karenanya apakah mereka akan tetap tinggal atau pergi.

Selain itu, penelitian yang dilakukan oleh Nielsen Norman Group, menunjukkan bahwa rata-rata pengunjung tetap berada di situs hanya selama 10-20 detik. Tidak masalah jika konten Anda bagus. Jika mereka tidak menyukai apa yang mereka lihat dan tinggalkan, mereka tidak akan pernah mendapatkan konten yang luar biasa itu. Jadi, Anda harus memiliki header yang menarik yang membuat pengguna tetap berada di situs Anda .

Header WordPress juga memiliki informasi penting untuk membantu pengguna menavigasi situs Anda dan banyak ajakan bertindak (CTA). Jadi, untuk memaksimalkannya, Anda harus menyesuaikan header .

Cara mengedit header di WordPress – 3 Metode

Ada beberapa cara untuk mengedit header di WordPress. Di sini, kami telah menguraikan 3 cara ramah pemula yang dapat Anda ikuti:

1. Menggunakan plugin
2. Mengedit file header.php tema
3. Dengan klien FTP

Mari kita lihat lebih dekat satu per satu.

1) Sesuaikan Header menggunakan plugin

Jika Anda lebih suka plugin WordPress daripada coding dan memodifikasi file inti, ini adalah pilihan terbaik. Di repositori plugin WordPress, ada plugin gratis yang tersedia yang disebut "Sisipkan Header dan Footer". Alat sederhana ini tidak memerlukan konfigurasi kompleks tambahan. Jadi, mari kita lihat langkah demi langkah bagaimana Anda dapat mengedit header menggunakan plugin Insert Headers and Footers.

1. Pertama, masuk ke backend WordPress Anda.

Buka Plugin > Tambah Baru . Dari sana, Anda dapat menginstal plugin WordPress baru dengan mencari repositori atau dengan mengunggah file plugin. Di bilah pencarian, ketik Sisipkan Header dan Footer .

3. Pilih opsi yang benar dan instal. Kemudian, aktifkan.

4. Sekarang, kita siap untuk mengkonfigurasinya. Di bawah bagian Pengaturan , Anda akan melihat Pengaturan Sisipkan Header dan Footer seperti yang ditunjukkan di bawah ini.

Di sana, Anda akan melihat bahwa Anda dapat mengedit tiga bagian:

• tajuk
• Tubuh
• catatan kaki

Jika Anda menambahkan kode di bagian header, kode itu akan terlihat sebelum tag </head> . Hal yang sama berlaku untuk tubuh dan footer. Kode akan muncul sebelum tag </body> dan </footer> masing-masing. Dalam hal ini, Anda sedang mengedit header, jadi cari tag </head> . 5. Di Scripts di bagian Header , tambahkan kode yang ingin Anda tuju di bawah tag head.

6. Setelah Anda menambahkan kode, jangan lupa untuk menyimpan perubahan dengan mengklik Simpan .

7. Itu dia! Kode akan ditambahkan ke header Anda. Secara keseluruhan, menggunakan Sisipkan Header dan Footer sangat sederhana sehingga merupakan pilihan yang sangat baik bagi mereka yang ingin mengedit header WordPress mereka tanpa kerumitan atau coding.

2) Ubah file Header.php tema

Jika Anda ingin memiliki kontrol lebih besar atas header Anda dan memiliki beberapa keterampilan pengkodean dasar, ada opsi lain. Jika Anda tidak suka menggunakan terlalu banyak plugin untuk menghindari memperlambat situs web Anda atau Anda tidak ingin menggunakan plugin Sisipkan Header dan Footers , jangan khawatir. Di sini kami akan menunjukkan kepada Anda bagaimana Anda masih dapat mengedit header WordPress Anda dengan sedikit pengkodean langkah demi langkah .

Untuk melakukan ini, Anda harus memodifikasi file inti tema. Jadi, sebelum Anda mulai, kami sarankan Anda membuat tema anak. Anda dapat membuatnya secara manual atau menggunakan plugin tema anak. Setelah Anda membuat tema anak, mari kita lihat bagaimana Anda dapat memodifikasi file header menggunakan dasbor admin WordPress .

1. Pertama, masuk ke bagian admin.

2. Di bawah bagian Penampilan , Anda akan melihat Editor Tema .

3. Di sini Anda dapat membuat perubahan pada file inti tema. Secara default, editor akan menarik file style.css tema saat ini untuk diedit dan akan terlihat seperti ini.

4. Di sisi kanan, Anda akan melihat semua file dan folder yang tersedia di direktori tema Anda saat ini.

5. Gulir ke bawah daftar sampai Anda menemukan header.php (di bawah Theme Header).

6. Pilih file, dan itu akan terbuka di editor Anda. Untuk membuat panduan ini, kami menggunakan tema GeneratePress WordPress sehingga terlihat seperti ini.

7. Sekarang, kesenangan dimulai. Saat mengedit file header.php dan menambahkan kode kustom Anda, pastikan Anda menambahkan potongan di antara tag <head> dan </head> . Dalam hal ini, kita akan menambahkan contoh teks tepat sebelum tag </head> .

8. Klik Perbarui File untuk menyimpan perubahan. Jika Anda melihat pesan File berhasil diedit , perubahan disimpan dengan benar. Anda dapat memverifikasinya dengan membuka frontend situs Anda dan melihat sumbernya.

Itu dia! Begitulah cara Anda mengedit header di WordPress melalui file header.php . Ini juga berguna untuk menambahkan beberapa penyesuaian lain ke header. Mari kita lihat beberapa di antaranya.

Tambahkan kode Pelacakan

Jika Anda ingin menambahkan kode pelacakan Google Analytics, kode/kode verifikasi iklan otomatis Google AdSense, Facebook Pixel, atau bahkan kode verifikasi konsol pencarian Google, Anda harus meletakkannya tepat sebelum tag </head> . Jika Anda melakukan ini, pastikan Anda telah memperbarui file setelah menambahkan cuplikan, jika tidak, itu tidak akan berfungsi.

KIAT PRO: Ubah Ukuran Font dan Gaya Header WordPress

Dalam beberapa kasus, selain mengedit teks, Anda mungkin ingin mengubah font atau gaya header WordPress. Mari kita lihat bagaimana Anda bisa melakukannya. Untuk mengubah gaya header Anda, Anda perlu tahu sedikit tentang CSS. Namun, di sini kami akan menunjukkan kepada Anda bagaimana Anda dapat mengedit ukuran font dengan cara yang sangat sederhana.

1. Untuk menambahkan sedikit kode CSS ke blog Anda, Anda harus pergi ke bagian Appearance , dan klik Customize .

2. Di sana, Anda akan menemukan beberapa opsi konfigurasi. Anda dapat mengonfigurasi seluruh situs web Anda sesuai dengan konfigurasi tema yang Anda instal dan beberapa tema premium seperti Divi atau GeneratePress juga memungkinkan Anda memiliki konfigurasi khusus di penyesuai.

3. Meskipun konfigurasi ini mungkin berbeda tergantung pada tema WordPress Anda, Anda akan dapat memahami bagaimana melakukannya dengan satu contoh. Dalam kasus kami, kami menggunakan tema GeneratePress Lite WordPress jadi kami mengklik CSS tambahan .

4. Di sini, Anda dapat mengedit kode CSS dari tema yang ada untuk menyesuaikan header Anda. Pertama, periksa sumber halaman untuk menemukan kelas CSS yang tepat. Dalam kasus kami, ini adalah judul utama jadi itulah yang harus kami edit.

Misalnya, katakanlah Anda perlu mengubah gaya font header Anda dan membuatnya miring. Cukup tambahkan:

 .judul utama {

gaya font: miring;

}

Dan itu saja. Anda telah mengubah gaya font header WordPress Anda. Selain itu, Anda dapat menetapkan CSS khusus untuk mengubah hal-hal lain seperti:

• Font-family : font: Arial – Ini akan mengubah font menjadi “Arial”
• Ukuran: ukuran font: 16px – Ini akan mengubah ukuran font menjadi 16 piksel jadi jika Anda ingin menetapkan ukuran 24 misalnya, cukup tulis 24, bukan 16 dalam kode.

3) Edit Tajuk Melalui FTP

Ini juga merupakan cara yang mudah untuk pemula. Jika Anda memiliki masalah dengan editor tema WordPress, Anda dapat menggunakan klien FTP . Untuk tutorial ini, kami menggunakan FileZilla karena ini adalah favorit kami, tetapi jika Anda menyukai yang lain, apapun bisa. Sekarang, mari kita lihat cara mengedit header WordPress melalui FTP.

1. Untuk menghubungkan FTP ke server Anda, Anda memerlukan akun FTP. Dari cPanel hosting, Anda dapat membuatnya. Kemudian, dengan nama pengguna, nama host, port kata sandi, hubungkan klien FTP dengan server Anda.

2. Di sisi kiri, Anda akan melihat penyimpanan lokal, dan di sisi kanan, penyimpanan server. Untuk mengedit file header, buka direktori tema aktif Anda.

3. Jalurnya adalah / wp-content/themes/theme-name/ . Di sana, Anda akan melihat file header.php .

4. Klik kanan padanya dan pilih opsi pengeditan. File akan disimpan ke penyimpanan lokal Anda dan akan dibuka dengan editor file seperti Notepad atau Notepad++.

5. Di sini buat perubahan yang Anda inginkan tepat sebelum tag </head> . Setelah melakukan perubahan, simpan file, dan unggah kembali ke server.

6. Itu dia! Anda telah mengedit file dan mengubah header WordPress situs Anda! Anda dapat memverifikasi perubahan dengan melihat kode sumber situs web. Perlu dicatat bahwa metode ini memiliki satu kelemahan utama.

Setelah Anda mengubah tema, Anda akan kehilangan semua penyesuaian sebelumnya, jadi jika Anda berencana untuk mengubah tema di masa mendatang, ini mungkin bukan pilihan terbaik untuk Anda. Di sisi lain, jika Anda perlu memodifikasi tajuk tema baru Anda dengan kode lama, salin-tempel sederhana akan berhasil.

Bonus

Beberapa tema WordPress seperti Newspaper, Newsmag, dan lainnya memungkinkan Anda untuk mengedit header tema. Sebagian besar tema WordPress hadir dengan panel tema khusus. Dari sana, Anda dapat menyesuaikan tema. Sebagai contoh, lihat panel tema yang ditawarkan oleh tema WordPress Koran di bawah ini.

Untuk menambahkan kode Google Analytics, tim menambahkan bagian khusus ke panel.

Kode akan ditambahkan ke bagian <head> situs web Anda. Setelah menambahkan kode, cukup simpan perubahannya, bersihkan cache situs web Anda, dan Anda siap melakukannya! Jika tema Anda tidak mendukung ini untuk mengedit header, Anda dapat menggunakan salah satu metode yang disebutkan di atas.

Apa yang harus ditambahkan di Header?

Jadi sekarang setelah Anda tahu cara mengedit header WordPress Anda, mari kita lihat apa yang dapat Anda tambahkan ke dalamnya:

• Kode Pelacakan Google Analytics
• Kode verifikasi
• Kode Iklan Otomatis
• Piksel Facebook
• Kode Verifikasi Search Console
• Kode Warna Bilah Seluler
• Gambar dan Video
• Kode Verifikasi Pinterest

Seperti yang Anda lihat, hampir setiap verifikasi dapat dilakukan melalui modifikasi header. Plus, jika Anda membutuhkannya, Anda juga dapat menambahkan widget ke header Anda. Ini mungkin terlihat oleh pengunjung situs web Anda dan itu bisa sangat berguna karena Anda dapat menggunakan widget untuk menambahkan tombol CTA, menampilkan iklan, atau apa pun yang Anda inginkan.

Bagaimana cara menambahkan gambar ke header di WordPress

Kustomisasi lain yang mungkin adalah menambahkan gambar ke header WordPress . Untuk melakukannya cukup ikuti langkah-langkah ini:

1. Masuk ke dasbor admin WordPress Anda
2. Pergi ke Penampilan > Tajuk . Harap dicatat bahwa beberapa tema tidak memiliki opsi header sehingga Anda harus membuka Appearance > Theme Editor > Header dan memodifikasi file PHP header
3. Lalu, buka bagian Gambar Header dan klik Tambahkan Gambar Baru
4. Setelah itu, pilih gambar yang ingin Anda gunakan di header Anda
5. Kemudian, Anda akan pergi ke bagian Pangkas Gambar di mana Anda dapat memutuskan bagian mana dari gambar yang ingin Anda tampilkan.
6. Setelah selesai, klik Publikasikan .
7. Itu dia! Anda telah menyesuaikan header WordPress dengan gambar baru

Saat Anda menambahkan gambar ke header Anda, ingatlah untuk:

• Gunakan foto yang menarik perhatian pengunjung dan komunikasikan apa yang Anda lakukan dan nilai-nilai Anda
• Gunakan gambar yang sesuai dengan branding Anda dan konsisten dengan apa yang ingin Anda komunikasikan. Misalnya, jika Anda adalah merek olahraga, jangan tunjukkan gambar makanan cepat saji atau mobil. Ini mungkin terdengar jelas tetapi ada banyak situs di mana gambar tidak sesuai dengan apa yang mereka lakukan dan akhirnya membingungkan pelanggan

Bagaimana cara menambahkan video ke header di WordPress

Untuk beberapa bisnis, mungkin masuk akal untuk menambahkan video ke header untuk menarik perhatian pengguna. Jadi di sini, kami akan menunjukkan cara melakukannya dengan 2 cara berbeda.

1. Tambahkan video YouTube ke header
2. Tambahkan video mp4

Mari kita lihat lebih dekat setiap metode.

1) Tambahkan video YouTube

Sebelum memulai dengan langkah-langkah ini, buka YouTube dan salin URL video yang ingin Anda tambahkan ke header WordPress. Setelah itu, lakukan hal berikut:

1. Masuk ke dasbor admin WordPress Anda
2. Lalu, pergi ke Appearance > Header
3. Di sana, buka bagian Media Header dan rekatkan URL video YouTube di bidang yang sesuai di bawah Video Header
4. Tekan Terbitkan dan hanya itu

2) Tambahkan video mp4

Opsi kedua untuk menambahkan video ke header WordPress adalah mengunggah file video mp4. Perlu diingat bahwa berat file tidak boleh lebih dari 8 MB . Selain itu, dimensi perlu disesuaikan dengan ukuran wadah tema Anda. Jadi, untuk menambahkan video mp4 ke header, di dasbor WordPress, Anda harus:

1. Pergi ke Penampilan> Header
2. Kemudian, buka bagian Media Header tekan Pilih Video di bawah Video Header
3. Cari file dan unggah ke Perpustakaan Media
4. Kemudian tekan Pilih Video dan Publikasikan
5. Itu dia! Anda telah menambahkan video ke header WordPress!

CATATAN : Salah satu keuntungan dari metode YouTube adalah memungkinkan Anda untuk menambahkan video apa pun, sedangkan jika Anda mengunggah file video, file tersebut tidak boleh lebih besar dari 8 MB dan harus menyesuaikan dengan ukuran tema.

BONUS: Cara mengakses tag header di WordPress

Dua cara termudah untuk mengakses tag untuk mengedit header Anda di WordPress adalah:

• Dari dashboard WordPress : Buka Appearance > Theme Editor > file header.php . Di dekat bagian atas file, Anda akan melihat <head> dan </head>. Cukup tambahkan kode Anda di antara tag.
• Via URL : Atau, Anda dapat mengakses tag header dengan menambahkan /wp-admin/theme-editor.php?file=header.php ke URL domain Anda. Misalnya, untuk QuadLayers, itu akan menjadi http://quadlayers.com/wp-admin/theme-editor.php?file=header.php .
  Jika Anda menggunakan Jaringan WordPress, Anda harus menggunakan tautan lain: http://quadlayers.com/wp-admin/network/theme-editor.php (ingat untuk mengubah URL dengan domain Anda)

Bagaimana jika tema saya tidak memiliki file header.php?

Beberapa tema anak tidak memiliki file header.php sendiri. Jika itu kasus Anda, ada 2 opsi untuk menyesuaikan tajuk Anda:

• Pindahkan tajuk tema induk ke tema anak dan edit dari sana
• Gunakan pengait: Untuk menambahkan kode dan mengedit header Anda, Anda dapat menambahkan yang berikut ini ke file functions.php dari tema anak.

 fungsi QL_fungsi_anda() {
 echo 'kode Anda';
 }
 add_action('wp_head', 'QL_fungsi_anda');

Perhatikan bahwa ini adalah contoh kode untuk memberi Anda struktur, Anda harus menyesuaikannya dan menambahkan kode Anda sendiri ke dalamnya.

Saya sudah mencoba mengedit header WordPress tetapi tidak berhasil

Katakanlah Anda mengikuti setiap langkah tutorial ini tetapi kodenya tidak ditambahkan ke header situs Anda. Pertama, pastikan Anda telah mengedit file yang tepat dan menambahkan kode ke bagian yang tepat. Jika Anda telah melakukan semuanya dengan benar dan masih tidak berhasil, ada satu solusi sederhana. Jika Anda menggunakan plugin caching WordPress di situs Anda untuk mengoptimalkan kecepatan dan kinerja, cukup mengosongkan cache akan memperbaiki masalah ini dalam banyak kasus.

Kesimpulan

Singkatnya, ini adalah cara sederhana untuk mengedit tajuk situs web WordPress mana pun. Untuk pemula, sebaiknya gunakan plugin Insert Headers and Footers karena mudah digunakan dan dikelola.

Di sisi lain, jika Anda tidak berencana untuk segera mengubah tema WordPress Anda, mengedit file header.php tema adalah pilihan yang sangat baik untuk Anda.

Terakhir, penting untuk dicatat bahwa jika Anda mengedit file header.php dari tema WordPress Anda dan mengubah tema, semua penyesuaian akan hilang meskipun Anda juga dapat menyalin dan menempelkannya. Jadi, pilih di antara opsi yang tersedia dan cari tahu mana yang terbaik untuk Anda.

Jika selain header Anda juga ingin menyesuaikan footer situs Anda, lihat panduan kami tentang cara mengedit footer di WordPress.

Masih, butuh bantuan? Jangan ragu untuk berkomentar di bawah dan kami akan membantu Anda dengan apa pun yang Anda butuhkan!