Cara Membuat Situs Web Satu Halaman Dengan Tema WordPress Apa Pun
Diterbitkan: 2018-01-26Kami mendapatkan banyak pertanyaan tentang cara membuat situs web satu halaman atau jika kami menjual tema WordPress satu halaman. Biarkan saya menjawab kedua pertanyaan ini di awal. Setiap tema WordPress bisa menjadi situs web satu halaman dan saya akan menunjukkan betapa sederhananya itu.
Apa itu Situs Web Satu Halaman?
Situs web satu halaman tidak lebih dari situs web dengan semua konten penting dalam satu halaman, biasanya beranda.
Ini sebagian besar digunakan oleh bisnis yang ingin mempromosikan satu produk atau layanan dengan cara yang jelas dan langsung . Beberapa contoh adalah menampilkan portofolio kepada klien Anda, mengatur acara, atau memulai bisnis baru.
Saat berada di situs web satu halaman, klik pada tautan navigasi tidak akan mengirim Anda ke halaman baru tetapi akan melompat atau menggulir ke bawah pada halaman yang sama ke bagian konten yang terhubung dengan tautan. Ini dapat membuat pengalaman pengguna jauh lebih baik dan meningkatkan keterlibatan pengguna.
Ada banyak satu halaman tema WordPress yang tersedia secara online, tetapi seperti yang telah saya katakan, kita dapat mengubah tema apa pun menjadi satu halaman hanya dengan sedikit kerja.
Bagaimana Cara Membuat Situs Web Satu Halaman Dengan WordPress?
Tautan jangkar
Untuk situs web satu halaman dasar, yang kita butuhkan hanyalah menu , konten , dan tautan jangkar . Saya yakin Anda semua tahu apa yang dilakukan menu dan konten, jadi mari kita bicara sedikit tentang tautan jangkar. Anchor link dibuat dari link normal, yaitu menunjuk ke anchor dan anchor itu sendiri. Tautan yang menunjuk ke jangkar adalah tautan normal, yang dimulai dengan karakter #
. Dan jangkar itu sendiri adalah tempat tertentu di suatu tempat di halaman Anda. Mari kita lihat contoh sederhana.
Ini adalah tautan kami di menu yang menunjuk ke jangkar:
<a href="#middle">Go to the middle</a>
Dan ini adalah konten kami dengan jangkar itu sendiri:
<h1>Learning about anchor links</h1> <p> Some lorem ipsum content ….</p> <h2>Middle of the page</h2> <p> Some lorem ipsum content ….</p>
Dalam hal ini, #middle
adalah tautan jangkar kami dan id=”middle”
adalah jangkar kami. Ketika kita mengklik link “Go to the middle” kita akan melompat ke anchor kita dengan judul “Middle of the page”. Itu dia! Ini adalah bagaimana kita dapat membuat situs web satu halaman yang paling dasar. Anda dapat menambahkan jangkar sebanyak yang Anda inginkan di situs web Anda. Mari kita ambil pengetahuan yang baru kita peroleh dan gunakan di situs WordPress.
Buat Tautan Jangkar Dengan Menu WordPress
Hanya untuk tujuan ini, saya telah membuat situs web satu halaman sederhana dengan tema GrowthPress kami, yang akan menjadi contoh praktis kami. Pertama, saya telah membuat halaman baru dan menambahkan beberapa konten. Konten hanya terdiri dari beberapa paragraf dan judul. Kami dapat menambahkan jangkar di hampir semua elemen HTML, tetapi dalam kasus kami, kami akan menambahkannya ke semua judul dalam konten.
Anda dapat melihat dari tangkapan layar, bahwa untuk mengedit HTML konten, kita perlu mengubah editor dari Visual ke Teks. Kita sekarang dapat melihat semua tag HTML di konten kita. Dalam kasus kami, semua judul menggunakan <h2>
dan kami akan menggunakannya untuk menambahkan jangkar. Sama seperti pada tangkapan layar di atas, Anda perlu menambahkan id dengan jangkar pada tag tersebut. Misalnya: <h2 id=”our-anchor”>Some Title</h2>
. Perhatikan bahwa jangkar ditulis tanpa #
, tetapi semua tautan jangkar harus dimulai dengan #
. Setelah kami menambahkan semua jangkar di konten kami, kami dapat menghubungkannya dengan tautan jangkar.
Jika Anda terbiasa dengan WordPress, Anda akan tahu bahwa kami dapat mengubah tautan menu di wp-admin -> Appearance -> Menus dan di sinilah kami membuat tautan jangkar kami.
Dari tangkapan layar, Anda dapat melihat bahwa saya telah memilih Tautan Khusus dan alih-alih URL klasik, saya menambahkan tautan jangkar #about-us
. Sebuah klik pada tautan itu sekarang akan melompat ke anchor id=”about-us”
di konten. Setelah kami menambahkan semua tautan jangkar, situs web satu halaman sederhana kami selesai. Klik tautan yang baru dibuat dan lihat sendiri!
Pengguliran Halus
Ya, saya setuju sekali, situs web satu halaman yang kami buat sampai sekarang memang bagus, tetapi lompatan instan itu tidak sehebat scrolling yang mulus, bukan? Untuk mencapai pengguliran yang mulus, kita perlu menambahkan sedikit kode javascript ke situs web kita.
Sebagian besar tema premium memiliki semacam bidang untuk menambahkan kode khusus. Misalnya, dalam tema kami, Anda dapat pergi ke wp-admin -> Customizer -> Opsi Tema -> Kode Kustom, di mana Anda akan menemukan bidang yang dapat Anda gunakan untuk menambahkan beberapa kode khusus seperti yang akan kami lakukan sekarang.
Jika tema Anda tidak memiliki tempat untuk kode khusus, Anda dapat menggunakan plugin yang sesuai. Saya akan merekomendasikan plugin Insert Headers and Footers dari WPBeginner. Setelah Anda mengaktifkan plugin, Anda akan menemukan bidang untuk menambahkan kode khusus di wp-admin -> Pengaturan -> Sisipkan Header dan Footer.
Rekatkan kode di bawah ini di salah satu bidang (kami sarankan untuk menggunakan skrip di pengaturan footer) dan sekarang Anda memiliki pengguliran yang lancar pada tautan jangkar Anda. Selamat! Anda baru saja membuat situs web satu halaman dengan tema WordPress apa pun!
<script> ( function( $ ) { $(document).on('click', 'a[href*="#"]:not([href="#"])', function(e) { if (location.pathname.replace(/^\//,'') === this.pathname.replace(/^\//,'') && location.hostname === this.hostname) { var hashStr = this.hash.slice(1); var target = $(this.hash); target = target.length ? target : $('[name=' + hashStr +']'); if (target.length) { $('html, body').animate({ scrollTop: target.offset().top }, 1000); window.location.hash = hashStr; return false; e.preventDefault(); } } }); }(jQuery)); </script>
Kode di atas akan menganimasikan efek gulir saat Anda mengklik tautan jangkar dan juga akan memperbarui URL browser saat ini untuk mencerminkan tautan jangkar yang diklik. Periksa hasil akhir kami di situs web satu halaman yang telah selesai.
Bagaimana Mengatur Offset untuk Pengguliran Halus?
Jika Anda telah memperbaiki menu lengket, saya akan merekomendasikan untuk juga mengatur offset, sehingga awal konten dimulai di bawah menu lengket Anda. Untuk mencapai itu, Anda perlu mengedit baris kode ini:
$('html, body').animate({ scrollTop: target.offset().top}, 1000);
Satu-satunya hal yang perlu kita lakukan di sini adalah menambahkan nilai offset kita. Itu harus setidaknya sebesar ketinggian menu lengket tetap Anda.
$('html, body').animate({ scrollTop: target.offset().top - 180 }, 1000);
Dengan itu, kami akan menghindari masalah di mana awal konten Anda bersembunyi di balik menu.
Kelebihan Situs Web Satu Halaman
Sekarang setelah Anda mengetahui cara membuat situs web satu halaman, mari kita bahas kelebihan menggunakan situs web satu halaman.
Situs web satu halaman memberikan pengalaman pengguna seluler yang lebih baik
Situs web satu halaman terdiri dari satu halaman gulir panjang yang sempurna untuk tampilan seluler. Pikirkan tentang Facebook dan Umpan Beritanya. Mau tak mau Anda terus menggulir lebih jauh ke bawah lubang kelinci. Situs web satu halaman dirancang untuk melakukan hal itu dan pengguliran berkelanjutan cocok untuk perangkat seluler.
Mengingat terbatasnya jumlah layar pada perangkat seluler, jauh lebih mudah untuk terus menggulir ke bawah daripada mencari tahu di mana menu bersembunyi dan kemudian mengklik tautan yang benar untuk membuka halaman berikutnya di situs web Anda. Dengan kata lain, situs web satu halaman akan memberikan pengalaman pengguna yang luar biasa bagi siapa saja yang mengunjungi situs web Anda di perangkat seluler mereka.
Situs web satu halaman membutuhkan lebih sedikit teks
Situs web multi-halaman tradisional membutuhkan banyak teks sehingga tidak terlihat terlalu kosong atau, lebih buruk lagi, belum selesai. Bandingkan itu dengan situs web satu halaman yang akan terlihat berantakan dan berlebihan jika Anda memiliki terlalu banyak konten. Dengan demikian, Anda akan ingin menyimpan salinan Anda seminimal mungkin dan menggunakan kalimat dan paragraf pendek untuk menyampaikan informasi yang paling penting.
Manfaat lain dari pendekatan ini adalah kenyataan bahwa menulis salinan dapat menjadi salah satu tugas yang lebih menakutkan yang terkait dengan peluncuran situs web. Situs web satu halaman bisa menjadi pilihan tepat jika salinan situs web Anda tidak sepenuhnya disempurnakan.
Situs web satu halaman bekerja dengan baik dengan gambar
Gambar dapat melakukan keajaiban untuk semua jenis situs web, termasuk situs web satu halaman. Faktanya, ketika Anda menggunakan gambar yang dipasangkan dengan efek paralaks, Anda dapat menghasilkan efek yang menarik secara visual di situs web Anda.

Bahkan jika Anda memutuskan untuk tidak menggunakan efek paralaks, Anda masih dapat menggunakan gambar secara efektif di situs web satu halaman. Anda dapat menggunakannya untuk membedakan antara bagian yang berbeda, belum lagi berbagi galeri foto atau gambar portofolio.
Anda juga dapat memanfaatkan gambar untuk meningkatkan SEO situs web Anda karena gambar cenderung muncul di hasil mesin pencari jika dioptimalkan dengan benar. Karena itu, pastikan untuk menambahkan nama gambar Anda menggunakan judul deskriptif dan menambahkan tag alt ke setiap gambar yang Anda tambahkan ke situs Anda.
Situs web satu halaman dapat meningkatkan keterlibatan dan konversi pengguna
Menurut sebuah penelitian, situs web satu halaman dapat menghasilkan konversi yang lebih tinggi dibandingkan dengan rekan multihalamannya. Alasan di balik ini sederhana: situs web satu halaman biasanya sangat terfokus dan dirancang untuk membuat pengunjung mengambil tindakan.
Ini memiliki pesan yang lebih terfokus dan lebih mudah untuk memahami pengunjung Anda apa yang Anda ingin mereka lakukan ketika mereka mencapai akhir halaman.
Ketika Anda hanya memiliki satu pilihan, mudah untuk mengklik tombol itu atau ajakan bertindak daripada pergi dari halaman ke halaman bertanya-tanya apa yang harus Anda lakukan selanjutnya.
Situs web satu halaman lebih mudah dinavigasi
Perlu juga disebutkan bahwa situs web satu halaman lebih mudah dinavigasi. Karena semuanya ada di satu halaman, sangat sulit untuk tersesat dan menemukan jalan kembali ke awal, terutama di perangkat seluler.
Meskipun Anda dapat menggunakan tautan jangkar untuk melompat ke bagian halaman yang berbeda (seperti yang ditunjukkan dalam artikel ini), gulir kembali ke atas atau ke bawah dan temukan bagian yang Anda inginkan sama mudahnya.
Selain itu, situs web satu halaman yang dirancang dengan baik mengarahkan pengunjung dalam perjalanan yang menceritakan kisah bisnis atau merek Anda secara logis.
Situs web satu halaman memudahkan untuk menargetkan audiens tertentu
Seperti yang disebutkan sebelumnya, situs web satu halaman dirancang untuk membuat pengunjung mengambil tindakan. Anda dapat menggunakan ini untuk keuntungan Anda dan menargetkan audiens yang sangat spesifik yang siap untuk mengambil langkah berikutnya. Dengan mengarahkan mereka melalui bagian yang berbeda dari situs web Anda, Anda dapat mempresentasikan produk atau layanan Anda, menunjukkan kepada mereka bagaimana memecahkan masalah mereka, dan menawarkan solusi dalam bentuk ajakan untuk bertindak.
Pendekatan ini bekerja dengan baik ketika Anda menargetkan kata kunci atau audiens yang sangat spesifik yang sudah tahu bahwa mereka memiliki masalah tertentu dan sedang mencari solusinya.
Kontra Menggunakan Situs Web Satu Halaman
Dengan kelebihannya, mari kita lihat beberapa kerugian menggunakan situs web satu halaman.
Akan lebih sulit untuk menganalisis data Google Analytics
Sekarang, Anda mungkin tahu bahwa Google Analytics dapat memberi Anda banyak informasi berguna tentang pengunjung situs web Anda. Setelah dipasang di situs Anda, Anda dapat melihat halaman mana yang populer, postingan mana yang mendatangkan pengunjung baru, dan halaman mana yang perlu dioptimalkan agar orang-orang bertahan lebih lama di situs Anda.
Dengan situs web satu halaman, Anda terbatas pada satu halaman saja. Pengunjung Anda mendarat di halaman yang sama dan berhenti di halaman yang sama yang membuat lebih sulit untuk mengetahui bagian mana dari situs web Anda yang perlu ditingkatkan. Jika Anda memutuskan untuk menggunakan rute situs web satu halaman, pastikan untuk mendaftar ke alat seperti Hotjar untuk mendapatkan peta panas visual tentang bagaimana orang menggunakan situs web Anda.
Berbagi situs web Anda di media sosial lebih sulit
Dengan situs web satu halaman, Anda hanya memiliki satu URL untuk dibagikan di media sosial. Ini bisa dengan cepat berulang, belum lagi itu tidak memberikan banyak peluang untuk mengirim orang ke berbagai bagian situs web Anda untuk menemukan jawaban atas masalah mereka. Setelah Anda membagikan URL utama Anda, seluruh situs web Anda dibagikan alih-alih halaman atau bagian tertentu seperti yang dapat Anda lakukan dengan situs web multihalaman.
Solusi yang mudah adalah dengan memasukkan blog ke situs web Anda di mana Anda dapat berbagi konten yang berguna dan bermanfaat yang akan menarik audiens Anda. Ini membuatnya lebih mudah untuk membagikan situs web Anda di media sosial sambil tetap menyimpan sebagian besar informasi yang diringkas ke satu halaman .
Satu halaman situs web mungkin membutuhkan waktu lebih lama untuk dimuat
Bergantung pada ukuran situs web satu halaman Anda dan jenis konten yang Anda bagikan, ketahuilah bahwa mungkin perlu waktu lebih lama untuk memuat situs web Anda.
Secara umum, situs web satu halaman cenderung cukup ringan, namun jika Anda memiliki banyak gambar yang tidak dioptimalkan untuk web, Anda akan mengalami waktu pemuatan yang lambat. Hal yang sama berlaku jika Anda memiliki banyak konten video di situs Anda.
Karena itu, penting untuk menyimpan gambar Anda dalam format yang sesuai serta mengompresi ukurannya sebelum menambahkannya ke situs Anda. Hal lain yang perlu dipertimbangkan adalah menggunakan pemuatan lambat untuk gambar dan video agar dimuat saat pengguna menggulir ke bawah ke bagian tertentu situs Anda alih-alih memuatnya segera.
Anda dibatasi dengan penargetan kata kunci
Situs web satu halaman tidak akan memberi Anda banyak peluang untuk menargetkan beberapa kata kunci. Dengan situs web multihalaman, Anda dapat memiliki halaman terpisah untuk setiap kata kunci yang Anda coba targetkan. Sebuah situs web satu halaman tidak bekerja dengan cara yang sama.
Situs web satu halaman, seperti yang disebutkan di bagian pro, dirancang dengan tujuan dan audiens tertentu. Itu biasanya diterjemahkan menjadi penargetan kata kunci tertentu dan variasinya yang berarti Anda lebih baik membuat situs web multihalaman jika Anda perlu menargetkan beberapa kata kunci yang berbeda.
Meskipun tidak ada aturan yang mengatakan Anda tidak dapat memasukkan lebih dari satu kata kunci yang berbeda per halaman, Anda tidak akan dapat mengoptimalkan halaman Anda secara memadai, terutama ketika Anda mempertimbangkan bahwa salinan ringan bekerja lebih baik dengan situs web satu halaman.
Anda tidak dapat menggunakan taktik SEO tingkat lanjut
Berbicara tentang SEO, situs web satu halaman tidak memungkinkan Anda untuk menggunakan taktik SEO tingkat lanjut yang dikenal sebagai siloing. Siloing mengacu pada praktik penataan situs web Anda ke dalam area minat utama sehingga Anda dapat menunjukkan otoritas Anda di area tersebut. Dalam istilah awam, ini adalah praktik membuat kategori dan subkategori untuk mengatur konten Anda.
Manfaat utama dari silo adalah membuka kemungkinan peringkat untuk banyak kata kunci dan frase kata kunci yang mencakup hampir semua pertanyaan yang mungkin dimiliki pengunjung yang tertarik, serta mencakup semua kemungkinan keberatan.
Sementara situs web multi-halaman unggul dalam hal ini, situs web satu halaman akan dengan cepat menjadi terlalu banyak dan berantakan, membuat audiens Anda frustrasi.
Situs web satu halaman dapat kekurangan dalam memberikan detail
Terakhir, karena penyalinan dan pengiriman pesan yang singkat dan ringkas, situs web satu halaman mungkin kurang menyediakan semua detail yang diperlukan bagi pengunjung Anda. Ini kemudian dapat menyebabkan peningkatan jumlah email yang meminta klarifikasi atau membuat pengunjung Anda bingung.
Anda dapat mengatasi masalah ini dengan menambahkan blog ke situs web satu halaman Anda dan memberi pengunjung konten yang lebih mendalam dan menjawab pertanyaan yang muncul.
Haruskah Anda Menggunakan Situs Web Satu Halaman?
Seperti yang Anda lihat, pasti ada keuntungan dan kerugian menggunakan situs web satu halaman. Jadi bagaimana Anda tahu jika situs web satu halaman adalah pilihan yang tepat untuk bisnis Anda?
Jika Anda baru memulai bisnis Anda dan menghasilkan banyak bisnis dari mulut ke mulut, situs web satu halaman memungkinkan Anda menempatkan bisnis Anda secara online tanpa menghabiskan terlalu banyak waktu untuk desain dan pengembangan.
Sebaliknya, jika Anda ingin fokus untuk mendapatkan lebih banyak lalu lintas organik dengan berfokus pada SEO dan jika Anda memperluas operasi bisnis Anda, maka situs web multihalaman akan lebih cocok untuk Anda.
Pada akhirnya, ini masalah preferensi pribadi dan tujuan bisnis Anda. Evaluasi di mana Anda berada dengan bisnis Anda dan catat apa yang ingin Anda capai. Kemudian, pertimbangkan pro dan kontra yang disebutkan di atas sebelum membuat keputusan akhir.
Kesimpulan
Kami benar-benar mendapatkan banyak pertanyaan, menanyakan apakah kami memiliki semacam tema satu halaman dan saya yakin situasinya sama dengan penulis tema lainnya. Artikel ini harus menjelaskan, bahwa semua tema WordPress juga dapat digunakan sebagai situs web satu halaman dan jika Anda mau, Anda dapat mengubah situs web Anda saat ini menjadi satu pager dalam waktu singkat. Kami juga telah membahas pro dan kontra dari situs web satu halaman dan membagikan cara memutuskan apakah ini pilihan yang tepat untuk situs web Anda.
Beri tahu saya jika artikel tersebut membantu Anda memahami situs web satu halaman dengan lebih baik dan beri saya komentar jika Anda memiliki pertanyaan tambahan .