Bikin Company Profile Pribadi dengan Odoo Website App

Bikin Company Profile Pribadi dengan Odoo Website App

    Setelah beberapa artikel sebelumnya soal bikin module custom di Odoo (academy_core), saya coba jalur yang jauh lebih ramah pemula: pakai Website App bawaan Odoo untuk bikin company profile pribadi. Idenya sederhana — belajar Odoo tidak harus mulai dari ORM dan security groups, bisa juga mulai dari yang paling kelihatan hasilnya: website builder drag-and-drop.

Project-nya masih di repo ai-erp-platform yang sama, cukup aktifkan satu app baru. Tujuannya: bikin situs personal branding untuk diri saya sendiri (Mohamad Yusuf Ibrahim, IT Developer) — nanti kalau sudah matang baru dipikirkan soal domain asli dan hosting production. Untuk sekarang, fokus ke proses belajarnya dulu di local.


1 Aktivasi Website App

Langkahnya sama seperti install app Odoo lainnya: buka menu Apps, cari "Website", klik Activate. Bedanya, begitu selesai, Odoo tidak langsung melempar ke halaman kosong — dia membuka wizard bernama Website Configurator.

Catatan: Website Configurator ini semacam "onboarding pintar" — dia akan menyusun kerangka situs (halaman, palette warna, tema) berdasarkan beberapa jawaban singkat, bukan cuma kasih template kosong.

2 Empat Pertanyaan yang Membentuk Situsmu

Wizard-nya menanyakan empat hal, satu per satu:

  1. Jenis situs — pilihan: business website, online store, blog, event website, elearning platform. Untuk company profile personal, jawabannya "a business website".
  2. Industri/jenis bisnis — field bebas dengan autocomplete. Saya isi "IT Development".
  3. Tujuan utama — pilihan: get leads, develop the brand, sell more, inform customers, schedule appointments. Untuk profil personal, paling pas "develop the brand".
  4. Palette warna — pilih dari grid kombinasi warna siap pakai, atau upload logo untuk deteksi warna otomatis. Saya pilih palette dark charcoal-grey supaya kesannya profesional dan techy.

Setelah itu wizard menawarkan halaman/fitur tambahan yang mau ikut dibuat: About Us, Services, Pricing, Privacy Policy, News, Success Stories, Career, Shop, Events, Forum, Live Chat, eLearning, Stores Locator. Untuk company profile personal, saya pilih tiga yang relevan saja: About Us, Services, dan Success Stories (portfolio/testimoni). Sisanya (Shop, Career, Forum, dst) tidak relevan untuk profil personal, jadi saya lewati.

Klik "Build my website", tunggu beberapa detik, dan Odoo langsung menyusun homepage lengkap dengan hero image, teks placeholder yang cukup masuk akal, dan menu navigasi sesuai halaman yang dipilih.

3 Ganti Konten Home dari Placeholder ke Identitas Asli

Hasil otomatis dari wizard itu bagus sebagai kerangka, tapi isinya generik ("Transforming Technology", "Our mission is to empower businesses..."). Untuk edit, klik tombol Edit di kanan atas — ini akan memunculkan panel Blocks / Customize / Theme di sisi kanan, dan setiap elemen di halaman jadi bisa diklik langsung.

Cara paling gampang mengedit teks: triple-click pada teksnya untuk select satu baris/paragraf penuh, lalu ketik penggantinya. Saya ganti:

  • Headline hero → nama saya: Mohamad Yusuf Ibrahim
  • Sub-headline → ringkasan profesional: "Senior Java Backend Engineer — 10+ tahun membangun sistem backend enterprise-grade untuk banking, fintech, SaaS, dan edtech."
  • Tombol CTA → dari "Get Involved" jadi "Contact Me"

Setelah selesai edit satu section, klik Save di kanan atas untuk menyimpan — ini akan langsung meng-update halaman live (statusnya berubah jadi Published).

4 Halaman About Us: Bio dan Skill Asli

Pola editnya sama: masuk mode Edit, klik tiap blok teks, ganti isinya. Untuk About Us, saya ganti:

  • Heading "Building Tomorrow's Technology" → "Building Reliable Backend Systems"
  • Paragraf pengantar → ringkasan 10+ tahun pengalaman di banking/fintech/SaaS/edtech, dengan detail keahlian Java/Spring Boot/microservices dan pengalaman di platform banking teregulasi (ISO 8583, card management systems)
  • Section "Our Services Overview" (placeholder generik) → saya ganti judulnya jadi "Skills & Focus" dan isi dua paragrafnya dengan stack teknis asli: Backend Development (Java, Spring Boot, Jakarta EE, REST API, Microservices, SQL) di paragraf pertama, dan Messaging/Database/DevOps (Kafka, RabbitMQ, Redis, PostgreSQL, MySQL, MongoDB, Docker, CI/CD) di paragraf kedua.

5 Services: Ganti Kartu, dan Kenapa Saya Hapus Section "Our Clients"

Halaman Services otomatis diisi tiga kartu placeholder ("Data Management Solutions", "Software Development Framework", "Agile Development"). Saya ganti jadi tiga penawaran nyata sesuai keahlian:

  1. Backend & API Development — Java, Spring Boot, Jakarta EE, REST API, microservices
  2. Banking & Fintech Systems — ISO 8583, card management systems, integrasi Core Banking System
  3. Event-Driven Architecture & DevOps — Kafka, RabbitMQ, Redis, Docker, CI/CD
Poin penting soal etika konten: di bagian bawah halaman Services, wizard Odoo otomatis membuat section testimoni dengan kutipan dari "Alex R., Tech Startup Founder" dan foto "Jane Doe, CEO of Tech Innovations" — keduanya nama dan jabatan fiktif. Ada juga section "Our Clients" berisi enam logo brand yang juga tidak nyata (Blank Hill, Sea Time Clothing, Eshley Jud, dll).

Untuk company profile personal, ini tidak boleh dibiarkan apa adanya — menampilkan testimoni dan logo klien fiktif seolah-olah nyata itu menyesatkan pengunjung. Yang saya lakukan: kutipan testimoni saya ganti jadi pernyataan filosofi kerja saya sendiri (bukan mengaku-aku sebagai orang lain), dan section "Our Clients" saya hapus total lewat ikon tempat sampah yang muncul saat block di-select.

6 Success Stories Itu Sebenarnya Module Blog, Bukan Halaman Statis

Ini yang menarik: menu "Success Stories" yang tadinya saya kira halaman biasa (seperti About Us), ternyata adalah instance dari module Blog Odoo, dengan "Success Stories" sebagai satu kategori blog terpisah dari "Our blog" (blog default yang juga otomatis dibuat).

Untuk menambah konten, saya klik "+ New" di toolbar admin → pilih tipe konten "Blog Post" → muncul dialog kecil untuk pilih Select Blog (harus diganti manual dari default "Our blog" ke "Success Stories") dan judul post. Setelah Save, Odoo langsung membuka editor artikel blog itu (masih berstatus Unpublished sampai di-publish manual).

Saya isi tiga post mewakili proyek nyata dari riwayat kerja: satu tentang sistem banking untuk fintech Singapura (Card Core EOD & MOBIUS-WEB), satu tentang platform project management (VIPC), dan satu tentang sistem collection tracking untuk perusahaan multifinance (CATS). Tiap post punya Subtitle (saya isi nama perusahaan & periode kerja) dan body text biasa.

7 Contact Us dan Footer

Halaman Contact Us punya dua bagian: form isian (Name, Phone, Email, Company, Subject, Question — ini murni form untuk pengunjung, tidak perlu diedit) dan kotak info kontak di sampingnya (nama perusahaan, alamat, telepon, email — ini teks statis yang bisa diedit langsung).

Saya ganti kotak info itu jadi nama saya, kota (tanpa alamat detail, demi privasi), dan kontak profesional (LinkedIn, email). Footer di bagian paling bawah situs — yang muncul di semua halaman — juga saya sesuaikan dengan cara yang sama.


Gotcha-Gotcha yang Saya Temui

1. Tombol "Edit" kadang perlu diklik dua kali
Kalau halaman baru saja selesai loading dan langsung diklik Edit, kadang tidak ada reaksi karena JavaScript-nya belum siap sepenuhnya. Solusinya sederhana: tunggu sebentar, cek dulu apakah panel Blocks/Customize sudah muncul, baru lanjut edit.
2. Shortcut keyboard bisa merusak konten di editor visual
Saya sempat coba Alt+S untuk memicu tombol Save (karena atributnya data-hotkey="s"), tapi ternyata browser tidak menahan modifier Alt dengan benar saat command dikirim otomatis — hasilnya huruf "s" malah ter-ketik sebagai teks nyasar di salah satu blok gambar. Pelajarannya: di editor visual seperti ini, lebih aman klik tombol Save secara langsung daripada mengandalkan keyboard shortcut.
3. Triple-click bisa menyatukan dua baris teks yang seharusnya beda
Saat mengedit footer (heading + value dalam satu blok, dipisah baris), triple-click yang saya kira hanya memilih satu baris kadang justru memilih seluruh isi blok. Kalau langsung diketik penggantinya tanpa memperhatikan ini, hasilnya dua baris yang tadinya terpisah malah menyatu jadi satu kalimat tanpa spasi (misalnya "Connect on LinkedInlinkedin.com/in/mhyusuf"). Perbaikannya: select ulang seluruh blok, ketik baris pertama, tekan Shift+Enter untuk baris baru di dalam blok yang sama, baru ketik baris kedua.

Kerangka company profile-nya sudah jadi — Home, About Us, Services, Success Stories (blog), dan Contact Us. Langkah berikutnya yang masih di rencana: benar-benar menguji role-based access kalau nanti situs ini butuh multi-user, dan baru mikirin domain + hosting production kalau memang mau go-live.

Comments

Popular posts from this blog

Numpang Kerja Remote dari Bandung Creative Hub

Debugging PHP Web dengan XDebug di Intellij IDEA (PHP STORM)

Membangun AI Development Assistant Lokal