• Beranda
  • Artikel
  • Tech
  • Bagaimana Cara Mengonversi Situs Web HTML Menjadi WordPress Gratis? Memandu

Bagaimana Cara Mengonversi Situs Web HTML Menjadi WordPress Gratis? Memandu

Diterbitkan: 2015-05-18

Pada awalnya, semua website dibuat dengan teks dan HTML statis. Tidak ada WordPress dan perlu mengonversi situs web HTML ke WordPress atau sistem CMS lainnya.

Banyak bisnis masih mengandalkan situs web HTML sederhana untuk kehadiran online mereka. Situs HTML ini biasanya bersifat statis. Ini berarti bahwa bahkan mengubah detail kecil di situs web dilakukan dengan mengedit file pengkodean.

Sekarang lebih dari 20 tahun kemudian, web adalah tempat yang jauh berbeda. Mendukung lebih dari 25% Web , WordPress semakin menjadi sistem manajemen konten (CMS) pilihan bagi pengguna rata-rata.

Situs web jauh lebih kompleks. Mereka memberikan pengalaman yang lebih kaya dan lebih menyenangkan bagi pembuat situs dan pengunjung. Apakah pindah ke WordPress berarti memulai dari awal dan kehilangan semua waktu, energi, dan uang yang dimasukkan ke situs web saat ini?

Daftar isi

Situs HTML

Tidak peduli bagaimana situs Anda dikodekan, setelah pengunjung memuat halaman di situs Anda, browser mengambil semua bagian (termasuk sisi server, gambar dari direktori lain, dll.) dan menempatkan semuanya bersama-sama dalam HTML statis akhir halaman.

Bahkan jika beberapa elemen pada halaman masih dinamis, kode itu sendiri ada di satu tempat yang dapat dipindahkan ke halaman WordPress yang masih berfungsi. Mungkin ada beberapa pengecualian untuk itu tetapi untuk sebagian besar situs di luar sana, itu benar.

Bahkan jika situs Anda terdiri dari somepage.php, yang memanggil file bernama header.inc, dan file bernama footer.php, saat pengguna melihat somepage.php di browser, kode sumber yang dihasilkan ada di satu tempat , seolah-olah itu dikodekan dengan tangan sebagai halaman HTML statis.

Ini adalah jenis kode yang diperlukan untuk mengonversi situs ke WordPress. Siapa pun yang menginstal WordPress dan tema/plugin yang tepat dapat memiliki situs web modern dengan desain dan fungsionalitas tingkat lanjut.

Migrasi Dari Situs HTML Statis ke WordPress Pra-langkah

Jika Anda siap untuk beralih ke WordPress, berikut adalah empat langkah yang perlu diperhatikan:

1. Analisis Situs HTML Anda yang Ada

Periksa situs Anda untuk konten yang tidak relevan atau usang dan jika ditemukan, bersihkan. Periksa sistem navigasi saat ini dan pikirkan bagaimana itu dapat ditingkatkan. Melakukan analisis situs HTML Anda akan membantu Anda memutuskan konten, fitur, dan fungsi apa yang harus dimigrasikan ke WordPress.

Ini akan memberikan gambaran yang jelas tentang plugin apa yang perlu Anda instal untuk mendapatkan fungsionalitas yang sama di platform WordPress.

2. Mengenal WordPress

Instalasi WordPress adalah proses yang cukup mudah. Sebagian besar web host menawarkan instalasi sekali klik. Jika tidak familiar, ada baiknya untuk membaca dan menginformasikan tentang platform baru yang akan dikerjakan situs Anda.

3. Lakukan Pencadangan Situs HTML Anda

Sangat disarankan untuk mengambil cadangan lengkap situs statis Anda untuk menghindari risiko kehilangan data saat bermigrasi.

4. Konversi Situs Web HTML ke WordPress

Dengan asumsi Anda memiliki pengetahuan pengkodean yang cukup, dan situs Anda kecil, opsi terbaik yang mungkin ada di depan Anda adalah membagi kode HTML yang ada menjadi empat bagian (header, footer, sidebar, dan konten) dan kemudian salin konten setiap bagian ke dalam file PHP-nya masing-masing.

Jika situs Anda besar, Anda dapat memanfaatkan plugin HTML ke WordPress, seperti HTML Import 2 atau mempekerjakan seseorang untuk mengubah HTML menjadi WordPress.

Cara Mengonversi Situs Web HTML ke Tutorial WordPress

Bagaimana Anda memilih untuk mengubah situs HTML statis Anda menjadi situs WordPress tidak diragukan lagi akan bergantung pada preferensi pribadi Anda, investasi waktu/moneter yang diinginkan, dan tingkat keahlian dengan kode.

Metode 1

Dengan metode ini untuk Mengonversi Situs Web HTML ke WordPress, Anda akan mempertahankan desain dan tampilan situs yang sama.

1. Unduh halaman HTML dari host Anda saat ini. Gunakan WinHTTrack untuk melakukan ini. Ini adalah alat gratis yang hebat yang sangat mudah digunakan. Pastikan Anda mengambil folder gambar juga (atau di mana pun Anda memiliki gambar di situs lama).

2. Instal WordPress di host web baru Anda.

  • Setel struktur permalink Anda ke "Nama posting" (/%postname%/)
  • Centang kotak, "Hindari mesin pencari untuk mengindeks situs ini" (hanya sampai semuanya selesai)
  • Instal beberapa plugin Mode Pemeliharaan (jika Anda mau) sehingga tidak ada orang selain Anda yang dapat mengakses WordPress baru Anda.
  • Instal plugin WordPress gratis, Impor HTML 2. Gunakan untuk "mengunggah" situs lama ke situs baru Anda. Panduan pengguna untuk mengimpor seluruh direktori halaman HTML Anda.

3. Unggah konten yang baru saja Anda unduh dari langkah 1 ke dalam struktur file host web baru Anda. Letakkan di folder bernama, misalnya, "file-html-untuk-impor". Unggah semua gambar lama ke Perpustakaan Media Anda di WordPress di situs baru Anda.

4. Jalankan Impor

5. Siapkan command prompt DOS dan Excel

  • Pada prompt DOS, navigasikan ke tempat Anda meletakkan file HTML Anda (paling mudah untuk meletakkannya di folder bernama "situs web Anda" dan letakkan folder itu di drive C:\). Kemudian, jalankan perintah ini: i. dir > files.txt
  • Buka file files.txt di Excel.
  • Sekarang ke Excel. Pada dasarnya, Anda akan menggunakan beberapa fungsi Excel, termasuk "menggabungkan" untuk membuat kode "kanonik" yang akan Anda masukkan ke dalam file HTML.
  • Tempatkan kode kanonik yang sesuai di setiap file HTML. Anda dapat melakukan ini, menyewakannya ke agen outsourcing, atau mempekerjakan seseorang untuk menulis kode PHP yang akan melakukan ini secara otomatis.

6. Unggah file HTML ke host web Anda . Letakkan di folder ROOT (yaitu, paling atas) untuk situs web baru Anda. Jangan lupa upload juga folder images ke ROOT.

7. Pastikan semuanya masih berfungsi di situs baru.

8. Hapus centang pada kotak dari Langkah #2 – “Hindari mesin telusur mengindeks situs ini” dan nonaktifkan plugin Impor HTML 2.

9. Ubah DNS di registrar Anda.

10. Pastikan URL situs Anda memiliki IP yang benar (IP baru Anda bukan IP lama) dan SEMUA halaman dimuat dengan benar. Anda mungkin harus menunggu beberapa jam agar server nama diperbarui.

11. Anda dapat menghapus halaman HTML lama setelah beberapa saat, tetapi tidak perlu. Anda tidak akan terkena hukuman "konten duplikat" karena referensi kanonik yang menanganinya.

Anda akan ingin menambahkan pengalihan di file .htaccess Anda yang mengarahkan "halaman .html" lama Anda ke halaman WordPress baru Anda.

Metode 2

Jika tujuan Anda adalah tidak hanya memasukkan konten dari situs HTML statis ke WordPress tetapi juga menduplikasi desain Anda saat ini, ini berarti Anda perlu membuat tema khusus.

Ini hanya melibatkan pembuatan beberapa folder dan file, sedikit salin dan tempel, lalu unggah hasilnya. Anda akan memerlukan editor kode seperti Sublime atau Notepad++ dan akses ke direktori situs HTML dan direktori instalasi WordPress baru Anda.

1.Buat folder tema baru dan file yang diperlukan. Di desktop Anda, buat folder baru untuk menyimpan file tema Anda. Beri nama apa pun yang Anda ingin tema Anda diidentifikasi.

Selanjutnya, buat beberapa file (yang semuanya masuk ke folder tema baru Anda) di editor kode Anda:

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

2. Salin CSS yang ada ke dalam stylesheet baru Jika Anda ingin menduplikasi desain, ini mungkin berarti Anda memiliki setidaknya beberapa CSS yang ingin Anda simpan. Jadi file pertama yang ingin Anda edit adalah file Style.css Anda.

Untuk memulai, tambahkan yang berikut ini ke bagian atas file Anda.

 /*
 Nama Tema: Ganti dengan nama Tema Anda.
 URI Tema: URI Tema Anda
 Deskripsi: Deskripsi singkat.
 Versi: 1.0
 Pengarang: Kamu
 Penulis URI: Alamat situs web Anda.
 */

Setelah bagian ini hanya paste CSS yang ada di bawah ini. Simpan dan tutup file.

3. Pisahkan HTML Anda saat ini

Di sinilah proses memotong dan menempelkan bagian dari kode yang ada ke dalam file berbeda yang Anda buat.

  • Pertama, buka file index.html situs Anda saat ini. Sorot semuanya mulai dari bagian atas file hingga tag pembuka div class="main" . Salin dan tempel bagian ini ke file header.php Anda, simpan dan tutup.
  • Kembali ke file index.html Anda. Sorot elemen samping class="sidebar" dan semua yang ada di dalamnya. Salin dan tempel bagian ini ke file sidebar.php Anda, simpan dan tutup.
  • Di index.html Anda pilih semuanya setelah sidebar Anda dan salin dan tempel ke file footer.php Anda, simpan dan tutup.
  • Dalam file index.html Anda, pilih semua yang tersisa (ini harus menjadi bagian konten utama) dan tempelkan ke file index.php Anda. Simpan, tapi jangan tutup dulu. Anda dapat menutup file index.html Anda sekarang dan melanjutkan ke langkah terakhir. Hampir selesai!

4. Selesaikan file Index.php

Untuk menyelesaikan file index.php tema baru Anda, Anda perlu memastikannya dapat memanggil bagian lain (selain konten utama) yang disimpan di file lain yang telah Anda buat.

Di bagian paling atas file index.php Anda, letakkan baris php berikut.

<?php get_header(); ?>

Kemudian, di bagian paling bawah file index.php Anda, letakkan baris php ini.

<?php get_sidebar(); ?>
<?php get_footer(); ?>

Sekarang Anda memiliki "The Loop". Ini adalah bit utama php yang digunakan WordPress untuk menampilkan konten posting Anda kepada pengunjung. Jadi langkah terakhir dalam membuat file index.php tema baru Anda adalah menambahkan kode di bawah ini di dalam bagian konten.

<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?> ( have_posts() ) : the_post(); ?>
<div id= "post-<?php the_ID(); ?>" <?php post_class(); ?>> <?php post_class(); ?>>
<div class = "post-header" >
<div class = "date" ><?php the_time( 'M j y' ); ?></div> ); ?></div>
<h2><a href= "<?php the_permalink(); ?>" rel= "bookmark" title= "Permanent Link to <?php the_title_attribute(); ?>" ><?php the_title(); ?></a></h2> ><?php the_title(); ?></a></h2>
<div class = "author" ><?php the_author(); ?></div> ><?php the_author(); ?></div>
</div><!-- end post header-->
<div class = "entry clear" >
<?php if ( function_exists( 'add_theme_support' ) ) the_post_thumbnail(); ?> ) ) the_post_thumbnail(); ?>
<?php the_content(); ?>
<?php edit_post_link(); ?>
<?php wp_link_pages(); ?> </div>
<!-- end entry-->
<div class = "post-footer" >
<div class = "comments" ><?php comments_popup_link( 'Leave a Comment' , '1 Comment' , '% Comments' ); ?></div> ); ?></div>
</div><!-- end post footer-->
</div><!-- end post-->
<?php endwhile ; /* rewind or continue if all posts have been fetched */ ?>
<div class = "navigation index" >
<div class = "alignleft" ><?php next_posts_link( 'Older Entries' ); ?></div> ); ?></div>
<div class = "alignright" ><?php previous_posts_link( "alignright" ><?php previous_posts_link( 'Newer Entries' ); ?></div> ); ?></div>
</div><!-- end navigation-->
<?php else : ?>
<?php endif ; ?> ; ?>

Simpan index.php Anda dan tutup. Tema Anda sekarang sudah selesai! Yang tersisa hanyalah mengunggahnya ke situs WordPress Anda.

5. Unggah tema baru Anda

Sekarang Anda akan menyimpan file tema yang dibuat di dalam folder tema baru Anda. Instal WordPress.

Tempatkan folder tema baru Anda di dalam /wp-content/themes/ . Arahkan ke WP Admin > Appearance > Themes dan Anda akan melihat tema yang baru dibuat di sana. Aktifkan! Yang tersisa untuk dilakukan pada saat ini adalah mengisi situs WordPress baru Anda dengan konten situs lama Anda.

6. Salin konten dari situs HTML ke WordPress

Di WP Admin, buka Plugin> Tambah Baru. Cari plugin bernama HTML Import 2 oleh Stephanie Leary. Setelah plugin ini diinstal dan diaktifkan, ikuti panduan pengguna untuk mengimpor seluruh direktori halaman HTML Anda. Setelah ini situs Anda akan terlihat seperti sebelumnya, hanya berjalan di WordPress.

Menggunakan Tema WordPress yang Ada untuk Mengonversi Situs HTML (metode termudah)

Jika langkah-langkah di atas terkesan terlalu intensif atau memakan waktu, ada cara lain. Ini adalah cara termudah.

Alih-alih mengonversi desain HTML yang ada agar terlihat sama di WordPress, Anda dapat memanfaatkan salah satu dari ribuan tema yang tersedia di pasar WordPress.

Ada tema gratis dan tema premium. Setelah Anda memilih tema yang Anda suka (dan paket file zip-nya telah diunduh), instal/aktifkan tema WordPress baru Anda.

Setelah ini selesai, Anda akan memiliki situs web dan tema WordPress baru. Saat Anda melihat pratinjau situs Anda, itu akan kosong. Saatnya mengimpor konten dan menyelesaikan proses untuk mengonversi situs web HTML ke situs WordPress.

Di WP Admin, buka Plugins > Add New dan cari plugin bernama HTML Import 2. Ikuti panduan pengguna untuk mengimpor seluruh direktori halaman HTML Anda. Setelah ini, Anda akan memiliki semua konten lama tetapi tampilan baru.

4 Konversi HTML ke WordPress Dengan Pencocokan Tema

Anda juga bisa menggunakan Pencocokan Tema. Ini menawarkan konversi HTML ke WordPress otomatis. Cukup masukkan situs Anda dan pilih area yang sesuai. Pencocokan Tema mengambil gambar, gaya, dan tata letak dari situs web Anda yang sudah ada.

Konversi-HTML-Situs Web-ke-WordPress-situs-dengan-pencocokan-tema

5 Layanan Konverter HTML ke WordPress

HTML ke WordPress mengubah desain HTML Anda menjadi tema WordPress tanpa Anda perlu menulis satu baris PHP pun.

Anda dapat memilih paket layanan di mana mereka akan mengonversi situs web HTML statis Anda ke WordPress. Opsi ini dapat menambah harga. Anda juga dapat memilih opsi Konverter yang jauh lebih murah.

Layanan Konverter HTML ke WordPress

Konversi sepenuhnya otomatis , dan fungsionalitas tema dapat diperluas hanya dengan menambahkan kelas konverter awalan “wp-” ke dalam HTML Anda.

Konverter membuat template untuk setiap file HTML dan mereferensikan aset Anda dan mengisi semua fungsi php yang diperlukan. Gunakan Bootstrap, Webflow, Dreamweaver atau alat/kerangka kerja apa pun yang Anda sudah nyaman untuk membuat situs web. Asalkan website dibuat menggunakan HTML Anda bisa mengubahnya menjadi sebuah tema.

Apa yang Perlu Dilakukan Setelah Migrasi?

Setelah konversi selesai, Anda perlu melakukan beberapa hal untuk memberikan sentuhan akhir pada situs WordPress Anda.

  • Instal Plug-in yang Diperlukan – Untuk melengkapi situs WordPress baru Anda dengan fungsi yang sama seperti situs HTML, instal plug-in yang menurut Anda berguna.
  • Periksa dan Perbaiki Tautan Rusak – Periksa situs web Anda untuk tautan yang rusak (404 kesalahan) dan jika ditemukan, perbaiki.
  • Siapkan Halaman Kesalahan 404 Khusus – Tambahkan halaman kesalahan 404 khusus untuk membawa pengunjung Anda ke bagian yang relevan dari situs WordPress Anda, jika mereka mencoba mengakses URL apa pun yang tidak ada.
  • Tautan Pengalihan – Untuk memberi tahu mesin telusur bahwa konten situs web Anda telah dipindahkan ke alamat web baru, siapkan pengalihan 301. Untuk tujuan ini, Anda dapat menggunakan Simple 301 Redirect.
  • Aktifkan Pengindeksan Mesin Pencari : Buka " Pengaturan -> Membaca " di dasbor WordPress Anda dan centang " Izinkan mesin telusur mengindeks situs ini " untuk membuat situs Anda diindeks oleh mesin telusur.
  • Hasilkan dan Kirim Peta Situs XML : Untuk memastikan situs Anda akan dimasukkan dalam hasil mesin pencari secepat mungkin, buat peta situs XML dan kirimkan ke Google.

WordPress vs HTML – PRO & KONTRA

Meluncurkan situs web bisnis bukanlah proses yang mudah. Salah satu dilema terbesar adalah apakah memilih situs HTML statis atau menggunakan WordPress.

WordPress – WordPress dianggap sebagai CMS (Content Management System). Versi HTML yang disederhanakan untuk pengguna non-teknisi untuk menambahkan dan memodifikasi hal-hal di situs web mereka.

Situs CMS biasanya dinamis, artinya tidak ada batasan seberapa sering Anda mengubah konten. Anda dapat mengubah semuanya mulai dari gambar hingga seluruh teks.

Antarmukanya sangat sederhana dan ramah pengguna, dan tidak ada yang membutuhkan pelatihan khusus untuk mempelajarinya. Pasar CMS sangat kompetitif, tetapi WordPress selalu mengalahkan persaingan.

Hal lain yang perlu diingat sebelum Anda mulai adalah bahwa ada perbedaan yang signifikan dari WordPress.com ke WordPress.org karena yang terakhir adalah CMS open source. WordPress.com, di sisi lain, berfungsi sebagai layanan hosting blog.

Keuntungan menggunakan WordPress:

  • Ini memberi Anda ribuan plugin untuk menambahkan ke situs fungsionalitas yang hilang.
  • Modifikasi dapat dilakukan kapan saja, dan tidak ada yang membatasi Anda.
  • Dibandingkan dengan penyiapan HTML, WordPress membutuhkan waktu penyiapan yang jauh lebih sedikit.

Kekurangan menggunakan WordPress:

  • Anda tidak bisa hanya mengaturnya, dan melupakannya. Ini membutuhkan perhatian penuh waktu dan pembaruan perangkat lunak, plugin, dan tema secara konstan.
  • Peretas akan menyerang situs web yang tidak terlindungi dengan baik dan tidak diperbarui. Anda berisiko bahwa situs web Anda tidak akan berfungsi sama sekali jika Anda tidak mengikuti pembaruan.
  • WordPress itu mudah, tetapi tidak banyak untuk pemula. Ada banyak tutorial online dan materi komprehensif untuk membantu Anda mempelajari kurva belajar.

Situs web statis HTML – Sebelumnya tidak ada yang namanya template, dan satu-satunya cara untuk membuat situs web adalah dengan menyewa seorang profesional dalam pemrograman untuk melakukannya untuk Anda.

Oleh karena itu, semua situs web dibangun sebagai HTML Statis (Hyper Text Markup Languages). Intinya adalah memiliki situs web. Bukan untuk mengubah konten atau tata letaknya, karena Anda harus menyewa pengembang HTML lagi.

Di situs web HTML, konten disimpan dalam file statis, yang membuatnya sangat sulit untuk dimodifikasi.

Keuntungan situs web HTML:

  • Setelah situs web online, Anda tidak perlu memperbarui atau mencadangkannya. Sebagian besar waktu, tidak ada yang harus diubah di situs web itu.
  • Situs web HTML bersifat dasar dan mudah diatur.
  • Ukurannya dan fakta bahwa mereka menggunakan lebih sedikit sumber daya daripada situs dinamis memberi mereka keuntungan kecepatan yang signifikan dibandingkan dengan situs dinamis, membuatnya memuat lebih cepat.

Kelemahan situs web HTML:

Anda harus profesional dalam bahasa markup. Jika tidak, Anda tidak akan dapat melakukan pembaruan signifikan pada situs web Anda. Menyewa pengembang web berulang kali akan dikenakan biaya, bahkan jika situs web Anda sangat kecil, atau hanya menampilkan informasi sepele.

Kerugian penting lainnya adalah Anda tidak dapat menambahkan plug-in , yang berarti Anda menghadapi kekurangan fungsionalitas yang parah.

Bagaimana Mengonversi HTML ke Ringkasan WordPress

Baik membutuhkan lebih banyak dari situs Anda atau membangun yang baru dengan mempertimbangkan template, proses konversi bisa tampak cukup rumit bagi pemula. Kesabaran dan pengetahuan akan memungkinkan Anda melakukan apa yang perlu Anda lakukan dengan tingkat keberhasilan tertentu.

Setelah situs Anda aktif, Anda dapat bangga mengetahui bahwa Anda belajar bagaimana melakukan sesuatu yang baru dan mampu menerapkan pengetahuan itu ke situs web Anda.

Semoga setidaknya satu metode di atas membantu Anda mengonversi situs web HTML ke WordPress. Jika Anda memiliki metode atau tutorial lain, beri tahu saya. Apakah Anda pernah mengonversi HTML ke WordPress dan apa pengalaman Anda dengannya?