Advertisement
  1. Code
  2. WordPress

Cara Membuat Template Halaman Arahan WordPress

by
Difficulty:IntermediateLength:MediumLanguages:

Indonesian (Bahasa Indonesia) translation by ibnuhadis83 (you can also view the original English article)

Final product imageFinal product imageFinal product image
What You'll Be Creating

Salah satu tujuan dari sebuah situs web adalah untuk menghasilkan prospek. Hal ini dapat terjadi dengan beberapa cara: Anda mungkin memiliki formulir agar orang-orang menghubungi Anda untuk penawaran tertentu, Anda mungkin mendorong orang untuk membuat sebuah akun saat membeli barang di situs Anda, atau Anda mungkin memiliki magnet utama yang Anda berikan kepada orang-orang sebagai imbalan untuk alamat email mereka.

.Jika Anda menggunakan magnet utama atau Anda memiliki sebuah halaman di situs Anda yang khusus dirancang untuk menjual satu barang — apakah itu berlangganan, layanan atau produk — maka Anda ingin mencegah orang-orang mengklik dari halaman tersebut tanpa membeli atau memberi Anda alamat email mereka.

Halaman semacam ini disebut halaman arahan. Ini adalah halaman yang dirancang untuk menjadi bagian dari corong pemasaran Anda, untuk menghasilkan prospek atau untuk menjual sesuatu. Tujuan dari halaman sangat sederhana, dan Anda tidak ingin orang melakukan hal-hal lain setelah mereka mendarat di atasnya.

Untuk meminimalkan kemungkinan orang menavigasi sebelum mereka membeli atau mendaftar, Anda ingin mengurangi jumlah tautan di halaman arahan Anda. Seharusnya tidak ada widget, tidak ada menu navigasi. Anda tidak ingin orang-orang meninggalkannya untuk menjelajahi situs Anda. Bahkan tautan ke halaman beranda di tajuk harus pergi, bersama dengan tautan apa pun di colphon Anda di bagian paling bawah halaman.

Dalam tutorial ini saya akan menunjukkan Anda cara membuat template halaman untuk tema Anda yang mencapai itu. Ini tidak akan berisi tautan apa pun di luar konten halaman. Pengunjung ke halaman tidak akan memiliki pilihan selain menekan tombol Buy atau Sign Up.

Untuk melakukan ini kami akan bekerja dengan beberapa file dalam tema kami.

  • Kami akan membuat sebuah template halaman kustom baru untuk halaman arahannya.
  • Kami akan mengedit file headernya sehingga ketika template itu ditampilkan, tautannya tidak ada.
  • Kami akan mengedit file footer untuk menghapus widget dan tautan apa pun di dalam colophon.

Jadi, mari kita mulai!

Apa yang Anda Butuhkan

Untuk mengikuti tutorial ini, Anda akan membutuhkan:

  • Instalasi pengembangan WordPress — jangan tambahkan halaman arahan ke situs Anda yang aktif sampai Anda mengujinya.
  • Tema yang dapat Anda edit. Jika itu tema pihak ketiga, buat sebuah tema anak dan edit itu.
  • Editor kode.

Halaman Awal

Saya telah membuat sebuah dummy halaman di situs saya untuk digunakan sebagai halaman arahan. Berikut adalah apa yang tampak seperti menggunakan template halaman normal:

the landing page using a standard page template the landing page using a standard page template the landing page using a standard page template

Selama tutorial ini, saya akan menghapus menu navigasi, sidebar dan area widget di footer, dan memastikan tidak ada konten di luar yang dapat diklik.

Membuat Template Halaman Arahan

Pertama Anda perlu membuat template halaman arahan. Lakukan ini dengan salah satu dari dua cara berikut :

Jika Anda bekerja dengan tema Anda sendiri, buatlah duplikat dari page.php dan ganti namanya.

Jika Anda bekerja dengan tema pihak ketiga, buat tema anak. Buat duplikat page.php dari tema induk dalam tema anak dan ganti namanya.

Jangan berikan nama file yang diawali dengan page- karena ini akan membingungkan WordPress jika Anda kemudian membuat halaman dengan siput yang Anda gunakan setelah page-. Saya memanggil landing-page-template.php saya.

Sekarang buka template fie Anda. Tambahkan baris kode ini di bagian atas:

Simpan ini dan Anda sekarang akan melihat bahwa Anda dapat memilih template baru ketika Anda membuat halaman baru di situs Anda:

Picking a page template in the page editing screenPicking a page template in the page editing screenPicking a page template in the page editing screen

Sekarang hapus panggilan sidebar dari file. Temukan baris ini:

... dan hapus. Simpan file Anda. Template halaman baru Anda sudah siap. Tapi kamu belum selesai.

Mengedit File Header

Langkah selanjutnya adalah mengedit file header.php, untuk menghapus tautan apa pun saat template halaman itu digunakan. Untuk ini kita akan menggunakan tag kondisional is_page_template ().

Buka file header.php Anda dan temukan kode untuk judul situs Anda.

Catatan: Jika Anda menggunakan tema pihak ketiga, buat file header.php di tema anak Anda yang merupakan duplikat dari tema induk dan edit itu.

Dalam tema saya terlihat seperti ini:

Editlah sehingga membaca sesuatu seperti ini, membuat penyesuaian untuk tema Anda sendiri:

Jika template halaman arahan digunakan, nama situs akan tetap ditampilkan, tetapi tidak akan ditampilkan sebagai tautan.

Anda juga perlu menghapus navigasi. Temukan kodenya untuk menu utama Anda. Dalam tema saya terlihat seperti ini:

Edit sehingga semua kode untuk menu ditempatkan di dalam tag kondisional yang memeriksa bahwa kami TIDAK menggunakan template halaman arahan:

Jika ada menu atau tautan lain di file header Anda, kelilingi mereka dengan tag kondisional yang sama — hal yang sama berlaku untuk setiap area widget.

Sekarang simpan file header.php dan tutup.

Mengedit File Footer

Tahap terakhir adalah memastikan bahwa setiap area widget tidak ditampilkan di footer.

Kami akan menggunakan tag kondisional yang sama hanya untuk area output widget jika tidak menggunakan template halaman arahan.

Buka template footer.php Anda (atau buat duplikat pada tema anak Anda jika relevan).

Temukan kode untuk menampilkan widget Anda. Ini milik saya:

Sekarang bungkus dengan tag kondisional dengan cara yang sama seperti yang Anda lakukan di file header.

Selanjutnya, kita perlu untuk mengubah colophon. Ini mungkin termasuk tautan ke beranda Anda dan / atau ke situs WordPress.

Ini milik saya:

Sekarang gunakan tag kondisional untuk menampilkan colophon tanpa tautan di halaman arahan:

Periksa kembali file footer Anda untuk tautan lain dan jika ada, bungkus juga dengan tag kondisional.

Mengatur Styling

Anda mungkin menemukan bahwa setelah menghapus sidebar dari template halaman arahan Anda, Anda perlu menyesuaikan styling untuk kontennya. Jika area konten masih hanya mengambil dua pertiga layar, Anda dapat menggunakan kelas body yang dihasilkan oleh WordPress untuk template halaman untuk memperbaikinya.

:Jadi, katakanlah Anda memiliki gaya berikut untuk konten dan sidebar Anda:

Anda harus menambahkan beberapa gaya tambahan di bawah itu untuk menargetkan kelas konten di template halaman arahan Anda:

Anda harus menyesuaikan ini untuk memperhitungkan setiap margin atau padding yang Anda gunakan tetapi ini memberikan Anda gambaran umum.

Halaman Akhir

Ini adalah halaman arahan saya tanpa tautan apapun:

the landing page with all links removedthe landing page with all links removedthe landing page with all links removed

Ini terlihat sedikit telanjang sekarang tetapi Anda akan mengisinya dengan banyak konten menarik yang bertujuan mendorong orang untuk membeli atau mendaftar — gambar, tombol merah besar, hal semacam itu! Dan Anda dapat melihat disana bahwa tidak ada apapun yang mengalihkan perhatian pengunjung dari konten halaman.

Saya berharap halaman arahan Anda memberikan Anda banyak bisnis. Semoga berhasil!

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.