STUDI KASUS

Pembuatan Website HydrantSystem.co.id dari Nol Setelah Website Lama Hilang

Willya Randika |
Featured image website HydrantSystem.co.id

Pada studi kasus ini, titik awalnya bukan redesign biasa, tapi kondisi darurat: website lama sudah tidak bisa dipulihkan karena hosting dan domain tidak diperpanjang terlalu lama, sementara backup juga tidak tersedia.

Website yang dibangun ulang adalah hydrantsystem.co.id, sebagai kelanjutan dari website sebelumnya di firesystem.co.id.

Ringkasan Singkat & Key Takeaways

Titik Awal

Website lama hilang, tanpa backup

Solusi

Rebuild total dari nol

Stack Utama

GeneratePress + GenerateBlocks

PageSpeed Desktop

100 / 98 / 100 / 92

Jika website lama Anda sudah hilang dari server dan tidak ada backup, diskusikan dulu via konsultasi gratis agar langkah recovery dan rebuild-nya tepat.

Timeline Proyek: Dari Fix Cepat ke Rebuild Total

10 Juni 2024: Insiden 404 Setelah Migrasi Hosting

Pada 10 Juni 2024, tim PT Rasa Nday Suksindo menghubungi saya karena website mereka saat itu, firesystem.co.id, mengalami masalah: semua halaman selain homepage menampilkan 404 Not Found setelah migrasi ke Hostinger.

Masalah seperti ini termasuk kasus klasik di WordPress dan biasanya terkait konfigurasi permalink atau rewrite rules. Setelah klien menjelaskan gejalanya, perbaikan bisa saya selesaikan dalam hitungan menit.

29 Oktober 2025: Website Lama Sudah Tidak Bisa Dipulihkan

Klien kembali menghubungi saya pada 29 Oktober 2025 untuk mengaktifkan kembali website yang sebelumnya nonaktif karena domain dan hosting tidak diperpanjang.

Tantangannya:

  • Sudah lebih dari satu tahun tidak diperpanjang.
  • Data website lama sudah dihapus dari sisi provider.
  • Tidak ada backup dari pihak klien.

Artinya, opsi restore tidak tersedia. Satu-satunya langkah realistis adalah membangun website dari nol.

Setelah diskusi via call, kami sepakat untuk rebuild total, lalu saya siapkan proposal penawaran dan mulai eksekusi pembangunan ulang.

Pendekatan Teknis dan Arsitektur

Fondasi Tema dan Builder

Stack utama yang saya gunakan:

  • GeneratePress sebagai tema dasar.
  • GenerateBlocks sebagai page builder.

Alasannya sama seperti mayoritas proyek saya: ringan, fleksibel, dan lebih aman untuk maintainability jangka panjang dibanding stack yang terlalu berat.

Hero Homepage Lebih Hidup dengan Video AI

Untuk meningkatkan kesan pertama di homepage, saya menggunakan Gemini AI untuk menghasilkan video singkat yang diletakkan di area hero. Hasilnya, section pembuka terasa lebih hidup tanpa perlu menambah elemen berat yang tidak perlu.

Hero HydrantSystem

Halaman Produk Tanpa WooCommerce (Sengaja)

Salah satu keputusan terpenting di proyek ini adalah tidak memakai WooCommerce untuk kebutuhan katalog produk.

Kenapa?

  • Kebutuhan bisnis tidak memerlukan cart, checkout, dan order automation.
  • Proses transaksi dilakukan manual melalui WhatsApp.
  • Mengaktifkan WooCommerce hanya untuk mendapatkan halaman shop/single product akan menambah beban fitur yang tidak dipakai.

Sebagai gantinya, saya membangun halaman shop dan single product menggunakan:

  • CPT khusus via Secure Custom Fields (SCF),
  • layout dan template melalui GeneratePress Elements.

Dengan cara ini, pengalaman visual tetap seperti halaman produk profesional, tapi arsitektur tetap lebih ringan dan sesuai kebutuhan bisnis.

Plugin yang Digunakan

Berikut plugin yang dipakai pada proyek ini:

  1. Carousel Slider Block
    Untuk testimonial berjalan, dokumentasi video, dan gallery photo.

  2. Fluent Snippets
    Untuk custom snippets.

  3. GenerateBlocks
    Sebagai page builder utama.

  4. GP Premium
    Untuk fitur tambahan GeneratePress Pro.

  5. LiteSpeed Cache
    Dipilih karena Hostinger menggunakan LiteSpeed Web Server, jadi ini opsi cache paling masuk akal.

  6. NinjaFirewall (WP Edition)
    Untuk lapisan keamanan tambahan.

  7. Safe SVG
    Untuk penggunaan aset logo berbasis SVG.

  8. Secure Custom Fields (SCF)
    Untuk CPT dan custom fields.

  9. Slim SEO
    Plugin SEO yang ringan dan sesuai kebutuhan proyek.

  10. WA Floating Chat
    Plugin internal kami untuk WhatsApp floating chat.

  11. WC Product Gallery
    Untuk gallery di halaman single product, agar tetap terasa seperti experience WooCommerce, tetapi dengan data yang dikelola lewat custom fields.

Before vs After

Homepage

Homepage lama (before):

Homepage before HydrantSystem

Homepage baru (after):

Homepage after HydrantSystem

Halaman Tentang

Halaman Tentang after HydrantSystem

Halaman Shop / Produk

Halaman Shop HydrantSystem

Hasil Performa (Desktop)

Hasil PageSpeed desktop:

  • Performance: 100
  • Accessibility: 98
  • Best Practices: 100
  • SEO: 92

PageSpeed Desktop HydrantSystem

Dampak Bisnis dan Operasional

Setelah rebuild:

  • Website kembali aktif dengan struktur yang lebih modern.
  • Tampilan lebih profesional dan relevan dengan positioning bisnis.
  • Pengelolaan konten lebih mudah untuk kebutuhan harian.
  • Arsitektur teknis tetap ringan karena fitur hanya dibangun sesuai kebutuhan riil.

Pelajaran dari Proyek Ini

  1. Website tanpa backup tetap bisa diselamatkan secara bisnis lewat rebuild yang tepat.
  2. Tidak semua website produk perlu WooCommerce, terutama jika alur transaksi manual via WhatsApp.
  3. Memilih stack ringan dan fokus kebutuhan riil hampir selalu memberi hasil lebih stabil jangka panjang.

Ingin Rebuild Website Anda dengan Pendekatan Serupa?

Jika website Anda sudah tidak bisa dipulihkan, atau Anda ingin membangun ulang dengan stack yang lebih ringan dan maintainable, kita bisa mulai dari audit kebutuhan dulu.

Lihat juga jasa pembuatan website dan jasa custom plugin WordPress sesuai scope proyek Anda.

Willya Randika

Willya Randika

Founder Harun Studio & web developer, blogger, serta hosting reviewer. Telah membantu pemilik bisnis meraih kesuksesan dengan design, development dan maintenance sejak 2021.

Artikel Terkait

Baca juga insight lain yang masih relevan dengan topik ini.