dua puluh Seventeen adalah tema default WordPress paling serbaguna yang pernah ada. Namun, opsi yang dibangun ke dalam tema meninggalkan sesuatu yang diinginkan.
Dalam tutorial ini, saya akan menunjukkan kepada Anda lima metode untuk menyesuaikan tema ini agar sesuai blog Anda. Kami akan mulai dengan dasar-dasarnya dan beralih ke penyesuaian yang lebih sulit dan berdampak.
Setelah selesai, Anda dapat mengubah Twenty Seventeen menjadi situs yang indah dan modern untuk bisnis atau blog. Kamu tidak percaya padaku? Lihat, inilah yang bisa Anda buat:
#1 Buat menu tautan sosial
Nah, bagian pertama ini lebih dari sekadar peretasan. Tetapi personalisasi hanya dapat dilakukan pada Twenty Seventeen.
Twenty Seventeen memiliki menu menarik untuk tautan sosial di catatan kaki.
Masalahnya adalah bahwa beberapa pengguna melaporkan bahwa mereka mengalami kesulitan mencari tahu cara menambahkan tautan jejaring sosial mereka ke menu ini. Untungnya, ini sangat sederhana sekali Anda tahu cara melakukannya.
Yang harus Anda lakukan adalah membuat menu dengan tautan ke jejaring sosial Anda dan menetapkannya ke lokasi Menu Tautan Sosial.
- Mari kita telusuri prosesnya.
- Mulailah dengan membuka "Customizer" (Appearance> Customize).
- Pilih opsi “Menu” lalu pilih “Menu Tautan Sosial”.
- Ubah nama menu baru Anda.
- Tambahkan tautan ke setiap jejaring sosial yang tersedia.
- Centang kotak di sebelah " Tautan Sosial '.
Setelah selesai, menu Anda akan terlihat seperti ini:
Langkah terakhir adalah mengklik tombol "Simpan dan Publikasikan" di Penyesuai untuk menyimpan menu baru. Tautan Anda ke jejaring sosial sekarang akan ditampilkan di menu di bagian bawah halaman.
# 2 Ubah tanda tangan "Proudly powered by WordPress"
Ada dua alasan mengapa Anda mungkin ingin mengubah teks di footer yang menyatakan bahwa situs Anda "Proudly powered by WordPress." "
Mungkin Anda ingin memperluasnya, menambahkan teks tambahan: “Dengan bangga didukung oleh WordPress, dirancang oleh WebPress Designs, dan dihosting oleh LAMPress hosting yang. "
Mungkin Anda ingin mengubah tanda tangan sepenuhnya untuk sesuatu yang lebih pribadi.
Hal pertama yang perlu Anda lakukan adalah membuat dan mengaktifkan tema anak (petunjuk: jika Anda ingin menyederhanakan hidup Anda, unduh tema anak sudah dipersiapkan untuk itu).
Setelah Anda membuat dan mengaktifkan tema anak Anda, salin file "footer.php". Kemudian buka file "footer.php" ini dan temukan bagian kode ini: get_template_part ('template-parts / footer / site', 'info');.
Sekarang Anda memiliki dua opsi. Anda dapat mengomentari baris ini dengan menambahkan "//" tepat sebelum kode, atau Anda dapat mempertimbangkan untuk menggantinya dengan teks footer kustom Anda sendiri. Berikut adalah kode yang akan ditambahkan untuk membuat teks footer.
#3 Menu Navigasi yang Disempurnakan
Selain membuat menu navigasi fungsional pada halaman navigasi, kami juga akan memperbaiki efek hover menu navigasi dan menambahkan pengguliran halus untuk meningkatkan pengalaman keseluruhan.
Pertama, kami akan mulai menambahkan kode berikut pada tema (anak) Anda:
/ * Kode navigasi satu halaman * / jQuery (document) .ready (function () {/ * Tambahkan padding dan id ke setiap bagian halaman depan * / jQuery ("h2.entry-title") .each (function () {var panelId = jQuery (this) .html (). toLowerCase (). replace (/ s + / g, "-"); jQuery (this) .wrapInner (function () {return " ";})}) / * Hapus penyorotan tautan navigasi * / jQuery ('# top-menu li'). RemoveClass ('current-menu-item current_page_item'); / * Tambahkan penyorotan saat klik * / jQuery ('# top -menu li a '). on (' click ', function (event) {jQuery (this) .parent (). parent (). find (' li '). removeClass (' current-menu-item '); jQuery (ini) .parent (). addClass ('current-menu-item');}); / * Periksa URL saat ini dan sorot navigasi untuk halaman saat ini * / jQuery ('# top-menu li a'). each (function () {var pageUrl = jQuery (location) .attr ('href'); var navUrl = jQuery (this) .attr ('href'); if (navUrl == pageUrl) {jQuery (this) .parent (). addClass ('current-menu-item');}})})
Anda dapat menambahkan ini kode pada file JavaScript dimuat oleh tema anak (apa yang direkomendasikan) atau menggunakan plugin yang memungkinkan Anda menambahkan JavaScript ke situs Anda. Pastikan untuk memuat kode setelah jQuery dimuat.
Lihat komentar di kode untuk mendapatkan gambaran lengkap tentang apa yang terjadi.
Selain itu, kami dapat membuat pergerakan ke setiap bagian menjadi lebih lancar dengan menginstal dan mengaktifkan plugin gratis: jQuery Scroll Halus.
Tentu saja, Anda masih perlu membangun menu navigasi dengan menambahkan tautan khusus ke setiap bagian menggunakan nama halaman yang ditampilkan di bagian ini.
Misalnya, untuk menautkan ke bagian "Tentang", Anda harus membuat tautan khusus dan menggunakan " #about Sebagai jangkar tautan. Untuk lebih jelasnya, lihat Bagaimana menyesuaikan tema " Dua puluh Tujuh belas WordPress '.
Dengan sedikit usaha Anda akan sampai pada hasil yang meyakinkan:
Ini tentu saja tidak semua yang bisa kita lakukan dengan Twenty Seventeen, kita nanti akan menawarkan tutorial lain tentang Twenty Seventeen.
aneh,
karakter beraksen tidak diterima! Saya berakhir dengan tanda tanya, bukan ada ide?
ps: terima kasih untuk tips ini pula!
Halo Nico,
Terkadang, gunakan ini sebagai gantinya:
é
'(appostrophe)
Halo,
Saya mengikuti instruksi Anda tetapi ikon saya hanya muncul di versi seluler blog saya dan bukan di versi pc, jika Anda dapat membantu saya, itu akan luar biasa!
Merci,
Julie
Bonsoir,
dapatkah Anda membagikan tangkapan layar?
Halo,
Anda harus memastikan bahwa style menu benar-benar dimuat. Anda juga dapat memeriksa kode menu untuk memastikan bahwa tag yang membawa ikon ada.