Konversi Template HTML ke Tema WordPress

Meskipun teknologi web telah berkembang pesat, masih ada situs web yang dibuat hanya dengan HTML. Jika Anda kebetulan memiliki salah satunya, Anda mungkin bertanya-tanya bagaimana cara mengonversi template HTML menjadi tema WordPress.

Untungnya, Anda memiliki beberapa opsi jika Anda ingin mengonversi file HTML tersebut ke WordPress. Teknik yang tersedia berkisar dari konversi manual langsung hingga bermitra dengan para ahli yang dapat menangani semua pekerjaan berat.

Pada artikel ini, kita akan membahas empat pendekatan berbeda untuk konversi template HTML. Untuk masing-masing, kami akan memberikan petunjuk dan sumber daya yang dapat membantu Anda membawa situs web berbasis HTML ke dalam lipatan WordPress. Ada banyak hal yang harus dibahas, jadi mari selami!

Konversi HTML Secara Manual

Opsi pertama dalam hal konversi adalah pendekatan manual. Karena ini adalah proses yang cukup praktis, Anda harus memastikan bahwa Anda memiliki akses ke file untuk situs web asli dan yang baru.

Biasanya, Anda akan menggunakan aplikasi Secure File Transfer Protocol (SFTP) untuk tujuan ini. Setelah Anda mengakses situs web Anda, Anda dapat melanjutkan dengan langkah-langkah berikut.

Langkah 1: Buat Folder Tema

Pertama, Anda harus membuat folder untuk menyimpan file tema baru Anda, dan beri label dengan nama tema baru Anda. Dengan menggunakan editor kode Anda, Anda kemudian dapat membuat lima file spesifik:

• style.css
• index.php
• header.php
• footer.php
• sidebar.php

Untuk saat ini, Anda dapat mengosongkan file-file ini, dan menyimpannya ke folder yang baru saja Anda buat.

Langkah 2: Salin dan Tempel CSS Anda yang Ada

Prioritas Anda selanjutnya adalah menyesuaikan file Cascading Style Sheet (CSS). Di sinilah Anda akan menguraikan semua elemen gaya yang berbeda untuk situs Anda.

Di bagian atas, sebaiknya tambahkan beberapa informasi tentang file tersebut. Sebenarnya, jika menyangkut WordPress, ada beberapa elemen yang diperlukan agar tema dapat ditampilkan di Direktori Tema.

Di bawah informasi itu, Anda kemudian ingin menempelkan gaya CSS apa pun yang ada dari situs web asli Anda yang ingin Anda bawa ke tema baru Anda.

Langkah 3: Pisahkan HTML yang Ada

Di situs web asli Anda, kode HTML yang menunjukkan area header, footer, sidebar, dan konten utama Anda kemungkinan besar ada di file index.html Anda. Sekarang, Anda harus membagi setiap elemen tersebut ke dalam file baru yang Anda buat untuk tema WordPress Anda.

Misalnya, di file index.html situs web asli, Anda dapat menemukan tag <div> pertama dengan kelas 'main'. Segala sesuatu yang mendahului tag ini kemudian dapat disalin dan ditempelkan ke file header.php baru Anda.

Anda kemudian akan mengulangi proses ini untuk tag 'sidebar' dan 'footer'. Salin kode yang terdapat di setiap elemen tersebut, dan tempelkan ke dalam file PHP masing-masing.

Sekarang, yang tersisa adalah bagian utama dari file index.html Anda. Inilah yang membentuk tata letak konten utama situs web berbasis HTML Anda. Anda harus menyalin kode yang tersisa ini, dan menempelkannya ke file index.php baru Anda.

Langkah 4: Konfigurasi File Index.php Anda

Langkah Anda selanjutnya adalah memastikan file indeks baru Anda dapat menemukan file yang diperlukan untuk memungkinkan tema Anda menampilkan struktur dan gaya situs Anda. Untuk mencapai ini, Anda akan menggunakan tag template WordPress. Ini digunakan untuk memberi tahu tema untuk mengambil file header, footer, dan sidebar.

Misalnya, Anda dapat membuat template Anda menampilkan file header yang Anda buat dengan menggunakan tag berikut:

get_header();

Anda akan menempatkan ini di file template index.php Anda, atau di halaman berikutnya di mana Anda ingin menampilkan header. Hal yang sama berlaku untuk catatan kaki Anda.

Ada bagian penting lain dari template baru Anda yang perlu Anda pahami juga. Ini disebut loop WordPress – potongan kode PHP yang memberi tahu template untuk menarik posting. Itu juga dapat disesuaikan untuk mengontrol berapa banyak posting yang ditampilkan.

Langkah 5: Unggah Tema Baru Anda

Sekarang setelah tema baru Anda siap beraksi, Anda harus menempatkan foldernya ke dalam direktori wp-themes/content/ untuk situs web Anda:

Setelah Anda mengunggah file, Anda dapat masuk ke dashboard WordPress Anda dan arahkan ke Appearance > Themes. Di sini, Anda akan melihat tema baru Anda tercantum dan dapat mengklik Aktifkan dan mulai menggunakannya.

Mengimpor Konten HTML Dengan Plugin

Cara lain untuk menangani proses ini adalah dengan menggunakan plugin untuk mentransfer konten dari situs berbasis HTML lama Anda. Sayangnya, hanya ada sedikit alat yang tersedia yang kompatibel dengan versi terbaru WordPress. Anda dapat memeriksa uji coba gratis dari Pengimpor Situs WP, namun:

Plugin ini dapat memindai seluruh situs web Anda dan membuat katalog konten yang dapat dipindahkan. Ini bekerja paling baik jika HTML Anda terorganisir dengan baik dan 'bersih' untuk memulai. Anda juga dapat mengimpor konten seperti menu dan tautan.

Menggunakan Tema Anak

Cara lain untuk memindahkan situs HTML Anda ke WordPress adalah dengan tema anak. Ini memiliki fungsionalitas dan gaya dasar yang sama dengan tema induknya, tetapi Anda akan dapat mempertahankan penyesuaian dan penyesuaian apa pun yang Anda buat, bahkan jika Anda memperbarui induknya.

Langkah 1: Pilih Tema

Ada banyak tema gratis yang dibangun dengan baik untuk dipilih di Direktori Tema WordPress. Setelah Anda memilih salah satu yang Anda suka, Anda harus menginstalnya agar filenya tersedia di direktori file situs web Anda:

Namun, Anda tidak perlu mengaktifkan tema induk ini.

Langkah 2: Buat Folder untuk Tema Anak Anda

Selanjutnya, Anda harus mengakses file Anda dengan aplikasi FTP, dan membuat folder baru di direktori wp-content/themes Anda. File ini harus memiliki nama yang sama dengan tema induk Anda, dengan menambahkan "-anak" di bagian akhir.

Misalnya, jika Anda ingin membuat tema anak untuk Twenty Nineteen, Anda dapat membuat folder bernama twentynineteen-child:

Pengaturan ini berarti bahwa tema anak Anda akan dapat menarik fungsi dan gaya dari tema induk secara otomatis, setelah Anda mengatur sisa file tema yang diperlukan.

Langkah 3: Siapkan Lembar Gaya

Langkah Anda selanjutnya adalah mengatur file style.css Anda. WordPress memerlukan beberapa informasi spesifik dalam style sheet untuk membuat hubungan tema induk-anak berfungsi. Anda juga dapat menempelkan informasi gaya tambahan dari file HTML asli jika diperlukan.

Langkah 4: Siapkan File Function.php

Sekarang Anda pada dasarnya memiliki dua tema yang sedang Anda kerjakan, Anda harus memberi tahu WordPress bahwa tema anak Anda bergantung pada CSS induknya. Untuk itu, Anda dapat menggunakan panggilan PHP wp_enqueue_style() .

Pertama-tama Anda akan membuat file function.php , dan menempatkannya di folder tema anak Anda. Ini adalah file tempat Anda akan menjalankan fungsi enqueue yang menguraikan dependensi dan hierarki tema.

Langkah 5: Aktifkan Tema Anak Anda

Setelah Anda mengunggah file baru ini ke server situs web Anda, Anda dapat kembali ke dasbor WordPress dan menavigasi ke Appearance > Themes . Di sana, Anda sekarang akan melihat tema anak Anda siap digunakan.

Klik Aktifkan pada tema anak Anda untuk menetapkannya sebagai tema situs web Anda. Kemudian Anda siap untuk mulai menyalin konten situs web HTML Anda ke situs WordPress baru Anda.

Beli Layanan Konversi Situs

Jika Anda tidak memiliki waktu atau sumber daya untuk melakukan konversi sendiri, Anda juga dapat melihat layanan konversi. Selain itu, jika Anda membutuhkan lebih banyak sumber daya atau bantuan untuk memigrasikan konten WordPress lainnya, di WP Engine kami menawarkan banyak solusi dan sumber daya untuk migrasi dan konversi.

1. HireWPGeeks

HireWPGeeks adalah opsi konversi layanan lengkap. Ini akan menangani semua pekerjaan berat, dan Anda akan berakhir dengan situs web WordPress berbasis tema yang fleksibel, responsif, yang lengkap dengan semua konten Anda. Anda harus menghubungi perusahaan untuk mendapatkan penawaran, tetapi Anda dapat merencanakan layanannya mulai dari $89.

2. Solusi FantasTech

Solusi FantasTech adalah layanan konversi HTML-ke-WordPress lainnya. Itu mengiklankan konversi yang sangat profesional dari HTML ke templat tema WordPress kelas atas yang dikodekan dengan baik. Perlu diingat bahwa biaya mulai dari $297 untuk satu halaman. Halaman tambahan masing-masing mulai dari $147, dengan harga pasti tergantung kerumitan.

Sesuaikan Pengalaman Situs Anda Dengan WP Engine

Ini mungkin tampak seperti usaha besar, tetapi mengonversi situs web HTML Anda ke WordPress dapat membuka banyak peluang lain. Dengan platform yang sangat fleksibel dan dapat diperluas ini, Anda akan menjadi lebih gesit dan mampu menyebarkan konten baru dengan cepat.

Di sini, di WP Engine, kami yakin sumber daya pengembang yang tepat dapat memberi dampak besar pada proyek Anda. Selain solusi inovatif, kami menawarkan paket dan tingkatan harga untuk semua anggaran!