Cara Membuat Tema WordPress Kustom dari Awal (2022)

Apakah Anda ingin membuat tema WordPress khusus untuk memberikan tampilan unik pada situs Anda?

Membangun tema WordPress dulunya tidak mungkin tanpa pengembang mahal atau memiliki pengetahuan pengkodean sendiri. Tetapi hari ini, beberapa plugin WordPress memberi Anda kemampuan untuk membuat tema kustom Anda sendiri menggunakan fungsionalitas drag and drop sederhana.

Pada artikel ini, kami akan menunjukkan cara membuat tema WordPress kustom Anda sendiri tanpa menulis kode.

Untuk melompat ke bagian tertentu dari tutorial, Anda dapat menggunakan tautan cepat sebelumnya:

1. Instal Plugin SeedProd
2. Pilih Template Tema
3. Sesuaikan Bagian Tema WordPress Anda
4. Terhubung Dengan Layanan Surat
5. Publikasikan Tema WordPress Kustom Anda

Bagaimana Cara Membuat Tema WordPress Dari Awal?

Tema WordPress dibangun menggunakan kombinasi PHP, CSS, JavaScript, dan HTML. Ini adalah bahasa pengkodean yang membutuhkan banyak pelatihan untuk dipelajari. Jadi, jika Anda sendiri bukan pengembang, satu-satunya pilihan Anda adalah menyewa agen pengembangan untuk membangun tema untuk Anda, yang bisa sangat mahal.

Namun berkat SeedProd, Anda sekarang dapat membuat tema WordPress kustom Anda sendiri tanpa coding. Muncul dengan antarmuka seret dan lepas sederhana yang dapat digunakan siapa saja, dan ini memungkinkan Anda menyesuaikan setiap aspek desain tema dengan mudah.

Mengapa SeedProd?

SeedProd adalah plugin pembuat halaman arahan yang paling ramah pengguna untuk WordPress.

Ini memberikan penyesuaian tingkat tinggi dan dilengkapi dengan berbagai fitur tambahan termasuk:

• Pembuat tema
• Lebih dari 150 templat halaman arahan
• Seret dan lepas pembuat
• Integrasi pemasaran email
• 2 juta stok foto
• dan banyak lagi.

Dengan fitur-fitur ini, Anda dapat dengan cepat membuat halaman arahan di situs web Anda dalam tema WordPress yang ada. Tapi sekarang, SeedProd telah menambahkan fitur baru yang memungkinkan Anda membuat tema WordPress kustom Anda sendiri menggunakan desain seret dan lepas yang sama untuk kemudahan penggunaan maksimal.

Mari kita lihat bagaimana Anda dapat membangun tema WordPress menggunakan SeedProd.

Cara Membuat Tema WordPress Kustom Menggunakan SeedProd

Kami akan berasumsi bahwa Anda sudah memiliki situs web WordPress yang dihosting di domain untuk tutorial ini. Jika tidak, Anda dapat melihat panduan ini tentang membuat situs web WordPress.

Jika Anda ingin mengganti tema WordPress yang ada dengan yang akan Anda buat, kami sarankan untuk menggunakan situs pengembangan pengujian untuk itu. Dengan cara ini, Anda tidak berisiko secara tidak sengaja menyebabkan kesalahan apa pun di situs utama Anda. Layanan hosting WordPress teratas seperti Bluehost menawarkan lingkungan pengembangan untuk WordPress.

Terakhir, pastikan untuk membuat cadangan situs Anda sebelum membuat tema Anda. Ini memastikan Anda selalu dapat memulihkan situs Anda ke keadaan stabil jika terjadi kesalahan. Anda dapat menemukan berbagai opsi dalam daftar plugin cadangan WordPress ini.

Setelah Anda melakukan persiapan ini, saatnya untuk mulai membuat tema WordPress kustom tanpa kode!

Langkah 1. Instal Plugin SeedProd

Pertama-tama, instal plugin SeedProd di situs WordPress Anda. Anda dapat melihat petunjuk untuk menginstal plugin WordPress jika Anda belum pernah menginstal plugin sebelumnya.

Anda akan memerlukan setidaknya lisensi SeedProd Pro untuk membuka kunci fitur pembuat tema. Untuk mengaktifkan lisensi Pro, buka area akun SeedProd Anda dan klik pada tab Unduhan . Gulir ke bawah untuk menemukan kunci lisensi Anda dan salin.

Kemudian, buka area admin WordPress Anda dan buka SeedProd »Pengaturan. Kemudian masukkan kunci yang Anda salin ke bidang Kunci Lisensi dan tekan Verifikasi .

Sekarang, buka SeedProd »Pembangun Tema. Ini adalah dasbor tempat semua elemen tema Anda yang berbeda akan hidup.

Sekarang ada dua cara untuk membuat tema Anda dengan SeedProd: buat sendiri setiap bagian dari tema Anda atau gunakan template yang sudah jadi dan edit bagian yang tidak Anda sukai.

Setiap tema WordPress terdiri dari bagian yang berbeda termasuk:

• tajuk
• catatan kaki
• Beranda
• Postingan Tunggal
• Halaman tunggal
• Arsip atau Halaman Blog
• Bilah samping

Membuat setiap bagian ini dari awal bisa jadi sedikit menakutkan jika ini adalah pertama kalinya Anda membuat tema. Dalam hal ini, ada cara yang lebih mudah untuk melakukannya.

SeedProd hadir dengan berbagai templat tema pra-bangun yang mengatur struktur keseluruhan untuk tema lengkap Anda. Dengan cara ini, semua bagian yang berbeda secara otomatis ditambahkan ke struktur, tetapi Anda masih dapat menyesuaikan setiap bagian sesuai keinginan Anda.

Untuk sisa tutorial, kami akan menggunakan salah satu tema SeedProd untuk menunjukkan kepada Anda langkah-langkahnya, karena ini adalah metode paling ramah pemula untuk membuat tema WordPress kustom.

Langkah 2. Pilih Template Tema

Fitur pembuat tema memiliki beberapa tema pra-bangun yang dimodelkan setelah situs web bisnis dari berbagai jenis. Untuk melihat tema yang tersedia, klik tombol Tema .

SeedProd hadir dengan templat untuk berbagai bisnis dan industri termasuk agen pemasaran, restoran, perusahaan perawatan hewan peliharaan, dan banyak lagi.

Kita akan menggunakan tema Starter untuk contoh ini. Segera setelah Anda memilih tema, SeedProd akan secara otomatis membuat semua bagian individual dari tema tersebut.

Anda juga dapat mematikan bagian tema yang berbeda jika Anda tidak membutuhkannya untuk situs web Anda. Untuk menonaktifkan bagian mana pun, Anda dapat menggunakan tombol sakelar di bawah judul Diterbitkan.

Anda dapat mengubah pengaturan untuk setiap bagian dari tema Anda dengan mengklik tombol Edit Kondisi .

Ini akan membuka modal di mana Anda dapat mengubah nama, jenis, prioritas, dan mengonfigurasi kondisi kapan dan di mana bagian ini akan muncul di situs web Anda.

Dalam kebanyakan kasus, Anda dapat membiarkan pengaturan ini menjadi default dan beralih ke menyesuaikan setiap bagian tema.

Langkah 3. Sesuaikan Bagian Tema WordPress Anda

Sekarang setelah semua komponen penting dari tema Anda ditetapkan, kami dapat menyesuaikan desain masing-masing agar terlihat persis seperti yang kami inginkan.

Untuk mulai mengedit, gerakkan kursor ke bagian tema dan klik Edit Desain .

Untuk tutorial ini, kita akan menyesuaikan header, footer, homepage, dan halaman blog. Prinsip penyesuaian yang sama berlaku untuk semua halaman lainnya.

Header dan Footer

Untuk mulai mengedit header, klik tombol Edit Design yang muncul saat Anda mengarahkan kursor ke Header. Ini akan membawa Anda ke antarmuka pembuat tema seret dan lepas SeedProd. Arahkan dan klik area header untuk membuka opsi penyesuaian, yang akan muncul di panel sebelah kiri.

Secara default, header memiliki logo SeedProd. Anda dapat menggantinya dengan logo bisnis Anda dengan sangat mudah. Klik pada gambar untuk menghapus atau menggantinya dengan mengunggah logo Anda sendiri.

SeedProd memungkinkan Anda untuk mengubah ukuran dan perataan logo Anda. Anda juga dapat menambahkan tautan khusus ke logo. Misalnya, Anda mungkin ingin mengarahkan pengguna ke beranda saat mereka mengeklik logo.

Anda juga dapat mengubah warna latar belakang header. Cukup gerakkan mouse Anda ke area header sampai Anda melihat garis biru. Klik untuk menemukan menu opsi baru di panel sebelah kiri. Sekarang, Anda dapat mengubah warna header dan memilih warna solid atau bahkan gradien.

Sekarang, klik pada tab Advanced untuk mengakses lebih banyak pengaturan seperti bayangan, spasi, batas, posisi, dan lainnya.

Setelah selesai membuat semua perubahan, klik tombol Simpan di kanan atas pembuat dan klik tombol silang untuk keluar ke dasbor pembuat tema utama.

Jika Anda ingin menyertakan header di situs Anda, Anda bisa mengulangi langkah yang sama untuk mengedit desain footer Anda.

Selanjutnya, kita akan mengedit Homepage.

Beranda

Beranda adalah bagian depan situs web Anda. Biasanya, ini berisi elemen penting yang menentukan siapa Anda, apa yang Anda lakukan, dan memberikan bukti sosial melalui ulasan dan testimonial.

Template Tema Pemula yang kami gunakan memiliki semua bagian utama yang biasanya Anda temukan di beranda situs web bisnis, termasuk:

• daerah pahlawan
• Bagian fitur
• Testimonial
• bagian FAQ

Anda dapat mengubah setiap blok halaman ini termasuk gambar, teks, tombol, warna, dan tata letak.

Dalam gif di bawah ini, kami akan menunjukkan kepada Anda betapa mudahnya mengedit berbagai bagian halaman menggunakan tindakan seret dan lepas sederhana.

Gunakan pengaturan dan blok di menu sebelah kiri untuk mengedit desain sampai Anda benar-benar puas. Setelah Anda membuat semua perubahan, pastikan untuk memeriksa pratinjau seluler.

Jika ada elemen situs yang tampak rusak dalam tampilan seluler, Anda dapat kembali mengedit dan melakukan penyesuaian hingga terlihat sempurna.

Saat Anda puas dengan beranda Anda, tekan tombol Simpan dan kembali ke dasbor pembuat tema SeedProd Anda.

Halaman Blog

Sekarang mari buat halaman blog khusus untuk situs Anda. Di dasbor pembuat tema Anda, klik tautan Edit Desain di bawah bagian Indeks Blog, Arsip, Pencarian untuk mulai mengeditnya.

Di sini, Anda dapat menambahkan atau menghapus berbagai elemen seperti konten posting, kutipan, bio penulis, dan banyak lagi menggunakan antarmuka seret dan lepas. Klik salah satu posting yang ditampilkan di halaman ini untuk mengakses lebih banyak pengaturan.

Pengaturan ini memungkinkan Anda untuk mengubah jenis, tata letak, pagination Posts Query. Anda juga dapat mengubah kontrol detail tambahan yang akan muncul dengan setiap posting seperti tanggal posting, penulis, gambar unggulan, kutipan, dan banyak lagi.

Setelah Anda menyesuaikan halaman blog, klik Simpan dan kembali ke dasbor Anda sekali lagi.

CSS global

Bagian CSS Global mengonfigurasi pengaturan global untuk warna, tipografi, tata letak, dan gaya tema Anda.

Dari dasbor Pembuat Tema, klik Edit Desain di bawah bagian CSS Global dari tema Anda.

Misalnya, Anda dapat memilih warna dan font Tombol yang ingin Anda tampilkan di seluruh situs Anda.

Demikian pula, Anda dapat mengubah font teks, latar belakang, tata letak, dan bahkan menambahkan CSS khusus ke tema Anda. Perubahan ini akan berlaku di seluruh situs Anda dan memastikan konsistensi gaya.

Setelah selesai menyesuaikan pengaturan sesuai keinginan Anda, klik tombol Simpan .

Langkah 4. Terhubung Dengan Layanan Surat

SeedProd memungkinkan Anda terhubung dengan layanan pemasaran email Anda, yang merupakan langkah penting jika Anda ingin menyertakan formulir berlangganan atau pendaftaran dalam tema Anda.

Faktanya, jika Anda menginstal WPForms di situs Anda, itu secara otomatis terintegrasi dengan SeedProd. Jadi, Anda dapat menyematkan formulir apa pun yang Anda buat dengan WPForms di bagian mana pun dari tema Anda menggunakan SeedProd.

Setelah Anda membuat formulir, Anda perlu memastikan bahwa layanan pemasaran email Anda terhubung dengan SeedProd sehingga Anda dapat mengirim dan menerima email yang terkait dengan formulir tersebut.

Untuk menghubungkan layanan pemasaran email Anda dengan tema SeedProd Anda, klik tab Connect di bilah atas layar pembuat tema saat Anda mengedit bagian mana pun dari tema.

Klik mailer mana pun dari daftar dan ikuti petunjuk di layar untuk menyelesaikan integrasi dengan tema SeedProd Anda. Setelah selesai, entri formulir optin Anda akan secara otomatis ditambahkan ke milis Anda.

Langkah 5. Publikasikan Tema WordPress Kustom Anda

Tema Anda sekarang siap untuk digunakan! Untuk menghidupkan tema Anda, buka dasbor pembuat tema Anda dan klik tombol sakelar Aktifkan Tema SeedProd di kanan atas layar.

Sekarang, mari kita lihat tema WordPress kustom yang baru dibuat!

Ini adalah beranda tema dengan tajuk:

Dan inilah halaman blognya.

Dan itu saja! Anda baru saja membuat tema WordPress kustom pertama Anda tanpa kode!

Selanjutnya, Buat Formulir Kontak untuk Situs WordPress Anda

Sekarang setelah Anda memiliki situs WordPress baru, Anda harus mempertimbangkan untuk menambahkan formulir kontak agar pengunjung dapat dengan mudah menghubungi Anda. WPForms adalah pembuat formulir WordPress yang paling ramah pengguna dengan lebih dari 5 juta instalasi aktif.

Anda tidak hanya dapat mengembangkan milis Anda dengan WPForms, tetapi juga melakukan sejumlah aktivitas lain seperti mengumpulkan sumbangan untuk organisasi nirlaba Anda.

Buat Formulir WordPress Anda Sekarang

Siap untuk membuat formulir Anda? Mulailah hari ini dengan plugin pembuat formulir WordPress termudah. WPForms Pro menyertakan banyak templat gratis dan menawarkan jaminan uang kembali 14 hari.

Jika artikel ini membantu Anda, silakan ikuti kami di Facebook dan Twitter untuk tutorial dan panduan WordPress gratis lainnya.