Lalu

Hawk Host adalah penyedia layanan hosting global asal Kanada yang telah beroperasi sejak tahun 2004. Awalnya dikenal dengan nama Devoted Host, perusahaan ini kini bermarkas di Toronto dan telah berkembang menjadi pemain industri yang stabil dengan mengelola infrastruktur di berbagai benua. Hawk Host menonjol karena komitmennya pada solusi mandiri (self-sustaining), di mana sistem dirancang untuk memulihkan diri secara otomatis dari masalah teknis umum. Saya sudah berlangganan layanan mereka selama bertahun-tahun. Infrastruktur Jaringan dan Lokasi Pusat DataSalah satu kekuatan utama Hawk Host adalah jaringan pusat data Tier III dan Tier IV yang tersebar di tujuh lokasi strategis di seluruh dunia. Lokasi-lokasi tersebut meliputi: Amerika Utara: Dallas, Los Angeles, New York City, dan Toronto. Eropa: London. Asia: Singapura dan Hong Kong. Penempatan ini memungkinkan pengguna memilih lokasi yang paling dekat dengan audiens mereka untuk mendapatkan latensi rendah dan kecepatan akses maksimal. Khusus untuk pasar Asia Tenggara, keberadaan node di Singapura dan Hong Kong memberikan keuntungan latensi yang signifikan. Teknologi Server dan Optimasi PerformaHawk Host menggunakan tumpukan teknologi modern untuk memastikan performa tinggi bagi penggunanya: LiteSpeed Web Server: Digunakan pada paket shared, semi-dedicated, dan reseller, LiteSpeed diklaim hingga 900% lebih cepat dibandingkan Apache tradisional untuk konten statis dan 50% lebih cepat untuk pemrosesan PHP. Penyimpanan NVMe: Hawk Host telah mengadopsi teknologi NVMe (Non-Volatile Memory Express) di seluruh lini produk terbarunya, yang menawarkan kecepatan transfer data jauh melampaui SSD standar. Fitur Caching Gratis: Semua paket sudah termasuk server Memcached dan Redis tanpa biaya tambahan untuk mempercepat backend situs web, terutama pada platform seperti WordPress dan e-commerce. Isolasi CloudLinux dan CageFS: Teknologi ini memastikan setiap akun diisolasi dalam lingkungan virtualnya sendiri, sehingga penggunaan sumber daya oleh satu pengguna tidak akan mengganggu pengguna lain di server yang sama. Ekosistem Produk dan LayananHawk Host menawarkan berbagai kategori produk untuk memenuhi kebutuhan dari skala blog pribadi hingga aplikasi besar: Cloud Web Hosting (Shared): Produk inti yang ekonomis namun kuat, mulai dari paket Starter (15 GB NVMe) hingga Max (130 GB NVMe). Semi-Dedicated Hosting: Dirancang sebagai jembatan bagi pengguna yang butuh sumber daya lebih besar daripada shared hosting namun tidak ingin kerumitan mengelola VPS. Paket terbaru (Raptor, Stratos, Apex) menawarkan hingga 8 core CPU dan 10GB RAM. Reseller Hosting: Solusi white-label bagi agensi yang ingin menjual kembali layanan hosting dengan merek sendiri, lengkap dengan lisensi WHMCS pada paket tertentu. Cloud Compute (Cloud VPS): Memberikan akses root penuh dan virtualisasi KVM yang skalabel bagi pengembang. Keamanan dan Tata Kelola DataHawk Host mengintegrasikan berbagai lapisan perlindungan proaktif, termasuk Imunify360 yang mencakup WAF, pemindaian malware otomatis, dan pertahanan intrusi secara real-time. Selain itu, tersedia backup harian gratis yang disimpan di lokasi offsite aman untuk memudahkan pemulihan data jika terjadi kegagalan sistem. Analisis Ekonomi dan HargaHawk Host dikenal dengan strategi harga yang kompetitif dan transparan, menurut saya sangat terjangkau. Harga Pendaftaran: Seringkali dimulai di bawah $3.00 per bulan dengan promo diskon pendaftaran untuk kontrak jangka panjang. Transparansi Perpanjangan: Meskipun harga perpanjangan lebih tinggi dari harga promo awal, peningkatannya dianggap masih wajar dibandingkan penyedia hosting besar lainnya. Garansi Uang Kembali: Tersedia 30-day money-back guarantee bagi pengguna shared hosting yang kurang puas. Pendaftaran Domain: Bertindak sebagai registrar untuk berbagai ekstensi TLD dengan harga bersaing, seperti .com di harga promo sekitar $9.99. Catatan: Sekarang Anda bisa bayar via QRIS, ini sangat memudahkan bagi mereka yang tidak punya kartu kredit. Batas Teknis (Resource Limits)Hawk Host sangat transparan mengenai batas sumber daya (LVE Limits) untuk setiap paketnya: Concurrent PHP Processes: Paket shared hosting dibatasi pada 10 hingga 15 koneksi PHP simultan. Ini merujuk pada proses aktif pada satu instan waktu, bukan jumlah total pengunjung, sehingga dengan caching yang baik, situs tetap bisa melayani ribuan pengunjung per jam. Inodes: Batas inode cukup murah hati, mulai dari 500.000 pada paket dasar hingga 5.000.000 pada paket tingkat atas. Dukungan PelangganDukungan teknis tersedia 24/7/365 melalui sistem tiket, live chat, dan dokumentasi basis pengetahuan (knowledge base) yang luas. Komunikasi dalam bahasa Inggris, tidak tersedia bahasa Inonesia. Tim dukungan sangat kompeten dalam menangani masalah teknis, terutama terkait manajemen server dan WordPress. Hawk Host juga menyediakan layanan migrasi gratis bagi pengguna baru yang ingin pindah dari penyedia hosting lama.

Panduan lengkap berdasarkan pengalaman membangun lalu.pro — dengan Invision Community 5.0.18. Target: Pengguna IPS 5 yang ingin membangun homepage editorial dengan data live dari berbagai aplikasi IPS (Forum, Pages, Downloads). Tingkat: Menengah (butuh dasar HTML/CSS, tidak butuh PHP advance). PrasyaratSebelum mulai, pastikan Anda punya: Sebelum mulai, pastikan Anda punya: Teknis Invision Community 5.0.x ter-install (panduan ini di-test di 5.0.18) Aplikasi Pages aktif (wajib — ini yang memungkinkan custom homepage) AdminCP access sebagai administrator Akses cPanel atau file manager (untuk backup tema, opsional tapi sangat direkomendasikan) Pengetahuan HTML dasar (tag, attribute, nested element) CSS dasar (selector, properties, flexbox, grid) Konsep template tag (mirip Twig, Liquid, atau Blade — tidak perlu PHP) Mengerti perbedaan client-side (HTML/CSS) vs server-side (PHP) rendering Aplikasi IPS yang Direkomendasikan untuk Live Data Forum (untuk fetch topik diskusi) Pages dengan custom database (untuk artikel) Downloads (untuk file/resources) Calendar (untuk events — opsional) Persiapan Konten Minimal 3-5 topik forum sudah dipost Minimal 3-5 artikel sudah di-publish di Pages database Minimal 2-3 file sudah di-upload di Downloads Tanpa konten ini, section live data akan tampak kosong saat testing. Konsep IPS 5 yang Wajib DipahamiSebelum nyentuh kode, pahami dulu konsep-konsep ini. Banyak frustrasi muncul karena pengguna tidak tahu vocabulary IPS 5. 1. Pages — Aplikasi Pembuat HalamanPages adalah aplikasi IPS yang memungkinkan Anda membuat halaman custom di luar struktur forum standar. Homepage custom Anda akan jadi sebuah Page. Path: AdminCP → Pages 2. Page TypesSaat membuat Page baru, ada dua tipe utama: Tipe Kapan Dipakai Tutorial Ini Pakai? Page Builder Visual drag-and-drop dengan widget Tidak Manual HTML/template tag custom penuh Ya Manual memberi Anda kontrol penuh atas HTML, sementara Page Builder cocok untuk yang tidak mau repot ngoding. 3. Use Suite HTML Wrapper — Setting Paling KrusialIni setting yang sering bikin bingung. Ada dua mode: Mode A: Suite Wrapper ON (Direkomendasikan untuk Production)✅ Konten Anda di-wrap dalam template global IPS (header, footer, sidebar, scripts) ✅ Security IPS aktif (CSRF, session, auth) ✅ JavaScript dan PHP IPS jalan native ✅ Konsisten dengan halaman lain (forum, artikel detail) ❌ Tidak bisa custom <head>, <body>, atau full HTML Kapan pakai: Saat Anda mau pakai header & footer bawaan IPS, dan hanya custom area konten tengah. Mode B: Suite Wrapper OFF (Full Custom)✅ Full kontrol dari <!DOCTYPE html> sampai </html> ✅ Bisa pakai font, CSS, JS dari mana saja ❌ Harus handle security sendiri ❌ Tidak otomatis dapat update template IPS ❌ Header/footer/user dropdown IPS hilang ❌ Login/logout/notifications bawaan IPS tidak otomatis ada Kapan pakai: Saat homepage benar-benar berbeda total dari sisa situs (misal, landing page marketing). 4. Blocks — Mesin Live DataBlocks adalah komponen reusable yang bisa menampilkan data dari aplikasi IPS. Ada 4 tipe block di IPS 5: Tipe Fungsi Contoh Penggunaan Plugin Feed otomatis dari aplikasi IPS Topic Feed, Record Feed, File Feed Manual HTML HTML + expression tag + PHP inline Counter, custom widget Editor Konten statis pakai WYSIWYG editor Welcome message, announcement Template Reusable dengan input fields Multi-purpose container Tutorial ini akan beberapa pakai Plugin (untuk feed) dan Manual HTML (untuk stats counter). 5. Block TemplatesTampilan default block IPS sering tidak match dengan desain Anda. Solusinya: Block Template — custom template yang bisa Anda terapkan ke block tertentu. Path: AdminCP → Pages → Templates → Add → block template Block Template menggunakan template tag IPS ({{foreach}}, {$variable}, dll) — bukan PHP murni. 6. Template Tags vs ExpressionDua jenis sintaks yang akan sering Anda lihat: Template Tag (logic flow): {{if $count > 1000}} {{foreach $items as $item}} ... {{endforeach}} {{endif}}Expression (eksekusi PHP): {expression="number_format($count)"} {expression="$record->_title"}Aturan: gunakan {{...}} untuk logic, {expression="..."} untuk output PHP. 7. Default Page SettingSetelah membuat homepage, Anda harus set sebagai default agar muncul saat user buka root domain (https://situs.com/). Path: AdminCP → System → Settings → Site Features → Default Page Fase 1 — Setup Halaman HomepageStep 1.1: Backup Tema Anda (Wajib!)Sebelum modifikasi apapun, backup tema aktif: AdminCP → Customization → Appearance → Themes └─ Hover icon download di samping tema → Save .xml file Simpan file .xml ini di komputer lokal. Kalau ada yang rusak, Anda bisa restore. Step 1.2: Buat Page BaruPath: AdminCP → Pages → Add Page Pilih Content Editor-nya Manual HTML Lengkapi Page Details dengan isian seperti dalam tabel di bawah. Isian mencakup: Field Isi dengan Catatan Page Name Homepage Display name internal Page Filename home URL slug (tanpa ekstensi), jika dikosongkan otomatis namanya mengikuti isian Page Name Page Folder Select Biarkan kosong untuk root, centang No Parent Use suite HTML wrapper ON (centang) Critical setting Page Title Komunitas Blogger Indonesia Untuk SEO <title> Content Kode HTML Lihat step 1.3 Meta Description (deskripsi singkat) Untuk SEO Klik Save & Edit. Step 1.3: Struktur HTML DasarKarena Suite Wrapper ON, TIDAK butuh <!DOCTYPE>, <html>, <head>, atau <body>. IPS akan menambahkannya otomatis. Anda cukup tulis konten yang ada di dalam <body> saja. Template dasar yang bisa Anda pakai sebagai starting point: <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Geist:wght@300;400;500;600;700&family=Geist+Mono:wght@400;500;600&display=swap" rel="stylesheet"> <style> /* Reset & base */ * { margin: 0; padding: 0; box-sizing: border-box; } :root { --bg: #ebe7e0; --ink: #181818; --accent: #ff5c2b; /* ... variabel lainnya ... */ } /* Style section di sini */ </style> <!-- HERO SECTION --> <section class="hero"> <h1>Selamat datang di komunitas kami</h1> <p>Deskripsi singkat tentang komunitas Anda.</p> </section> <!-- SECTION LAIN --> <section class="features"> <!-- ... --> </section>Itu saja kerangka dasarnya. Step 1.4: Penting — Cara Paste Kode di Editor IPSEditor IPS Pages punya mode Invision HTML Template dan Plain Text. Klik tab Content, secara default terpilih editor Invision HTML Template. Salin kerangka HTML pada langkah 1.3 di atas. Paste di kolom yang tersedia. Save. Setelah Save tentukan View Page, centang saja semua agar homepage dapat dilihat oleh semua pengunjung. Step 1.5: Set Homepage Sebagai DefaultSetelah halaman terbuat, jadikan default, langsung saja klik ikon bintang, lalu geser tombol Set as default page ke kanan (ON). Klik Save. Sekarang akses https://situs-anda.com/ — homepage Anda muncul. Catatan: Jangan lupa atur aplikasi Pages menjadi default juga. Step 1.6: VerifikasiBuka homepage di browser baru (incognito) untuk pastikan tampil benar: Tampil tanpa error Header & footer IPS muncul (karena Suite Wrapper ON) Konten custom Anda di tengah Font Google Fonts loaded (cek dengan Inspector → Network) Sampai di sini Anda sudah berhasil membuat homepage. Tapi masih sangat sederhana, hanya berisi teks selamat datang. Selanjutnya kita akan menambahkan beberapa block live. Fase 2 — Live Data IntegrationBagian ini yang membuat homepage Anda hidup — menampilkan data real dari forum, artikel, dan files. 2.1 Strategi Konversi BertahapUrutan pekerjaan saya saat membuat homepage lalu.pro adalah per section. Urutan Section Tipe Block Tingkat Kesulitan 1 Stats counter (member, topic, artikel) Manual HTML Mudah 2 Latest articles Plugin (Record Feed) Sedang 3 Hot topics Plugin (Topic Feed) Sedang 4 Latest files (Download) Plugin (File Feed) Sedang Tapi saya hanya akan memandu Anda membuat stat counter dulu agar Anda melihat tampilannya dan memahmi alur kerjanya. 2.2 Stats Counter — Member CountKita perlu membuat sebuah block. Path: AdminCP → Pages → Blocks → Create New Block → pilih "Manual HTML Setelah klik tombol Next, isi form Details dan Content. Title: Stat Members Count Template Key: lalu_stat_members, (tanpa spasi) Description: (boleh kosong) Content (paste persis): {expression="number_format( \IPS\Db::i()->select( 'COUNT(*)', 'core_members', array( 'completed=?', 1 ) )->first() )"}Penjelasan kode: \IPS\Db::i() — akses database IPS select('COUNT(*)', 'core_members'...) — hitung jumlah member 'completed=?', 1 — hanya yang sudah verifikasi email number_format(...) — format dengan koma (2,847) Klik Save. Klik Save sekali lagi (set view page). 2.3 Stats Counter — Topic CountSekarang buat block baru lagi, langkah-langkahnya seperti block member counter. Isiannya: Title: Stat Topics Count Template Key: lalu_stat_topics Content: {{$count = \IPS\Db::i()->select( 'COUNT(*)', 'forums_topics', array( 'approved=?', 1 ) )->first();}} {{if $count >= 1000}} {expression="round( $count / 1000, 1 )"}<em>k</em> {{else}} {expression="number_format( $count )"} {{endif}}Penjelasan: Hitung topic yang approved (approved=1) Kalau ≥1000, tampilkan format 14k, 1.5k Kalau <1000, tampilkan angka penuh 2.4 Stats Counter — Article CountCek dulu Database ID Articles: AdminCP → Pages → Databases └─ Cari "Articles" → catat angka ID di kolom paling kiri Misal ID = 1, maka tabel-nya adalah cms_custom_database_1. Buat block dengan isian berikut: Title: Stat Articles Count Template Key: lalu_stat_articles Content (ganti angka 1 dengan ID Anda): {expression="number_format( \IPS\Db::i()->select( 'COUNT(*)', 'cms_custom_database_1', array( 'record_approved=?', 1 ) )->first() )"}2.5 Pasang Stats Block di HomepageDi Page Content homepage, di tempat yang sesuai: <div class="hero-stats"> <div class="stat"> <div class="stat-num">{block="lalu_stat_members"}</div> <div class="stat-label">Member aktif</div> </div> <div class="stat"> <div class="stat-num">{block="lalu_stat_topics"}</div> <div class="stat-label">Diskusi</div> </div> <div class="stat"> <div class="stat-num">{block="lalu_stat_articles"}</div> <div class="stat-label">Tutorial</div> </div> </div>Anda bisa mencoba kode yang siap pakai berikut: <style> /* Reset & base */ * { margin: 0; padding: 0; box-sizing: border-box; } :root { --bg: #ebe7e0; --ink: #181818; --accent: #ff5c2b; --muted: #6b6b6b; --card: #ffffff; --radius: 12px; --gap: 1.5rem; } body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; background: var(--bg); color: var(--ink); line-height: 1.6; padding: 2rem 1rem; } /* HERO */ .hero { max-width: 960px; margin: 0 auto 3rem; text-align: center; padding: 3rem 1.5rem; } .hero h1 { font-size: clamp(1.75rem, 4vw, 2.75rem); font-weight: 700; line-height: 1.2; margin-bottom: 1rem; } .hero h1::after { content: ""; display: block; width: 60px; height: 4px; background: var(--accent); margin: 1rem auto 0; border-radius: 2px; } .hero p { font-size: 1.1rem; color: var(--muted); max-width: 600px; margin: 0 auto 2.5rem; } /* Hero stats */ .hero-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); max-width: 700px; margin: 0 auto; } .stat { background: var(--card); padding: 1.5rem 1rem; border-radius: var(--radius); border: 1px solid rgba(0, 0, 0, 0.06); transition: transform 0.2s ease; } .stat:hover { transform: translateY(-3px); } .stat-num { font-size: 2rem; font-weight: 700; color: var(--accent); line-height: 1; margin-bottom: 0.5rem; } .stat-label { font-size: 0.9rem; color: var(--muted); } /* Features section */ .features { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; } /* Responsive */ @media (max-width: 600px) { .hero-stats { grid-template-columns: 1fr; } .hero { padding: 2rem 1rem; } } </style> <!-- HERO SECTION --> <section class="hero"> <h1>Selamat datang di komunitas kami</h1> <p>Deskripsi singkat tentang komunitas Anda.</p> <div class="hero-stats"> <div class="stat"> <div class="stat-num">{block="lalu_stat_members"}</div> <div class="stat-label">Member aktif</div> </div> <div class="stat"> <div class="stat-num">{block="lalu_stat_topics"}</div> <div class="stat-label">Diskusi</div> </div> <div class="stat"> <div class="stat-num">{block="lalu_stat_articles"}</div> <div class="stat-label">Tutorial</div> </div> </div> </section>Save → Clear cache → Refresh. Lihat hasilnya, harusnya seperti berikut: Saya harap Anda memahami kerjanya dan bisa berkreasi.