• Durasi baca: 2 menit

Hari ini aku menghabiskan cukup banyak waktu untuk menyempurnakan fitur blog di website yang sedang aku bangun dengan Joomla.

Awalnya aku memastikan tampilan artikel tampil dengan baik, termasuk ukuran gambar header yang ideal. Aku juga penasaran bagaimana caranya membuat tombol "Create Article" bisa dipakai langsung oleh user dari frontend dan akhirnya berhasil!

Ternyata fitur ini memerlukan hak akses yang sesuai (Author atau Editor), dan harus disematkan lewat menu bertipe "Create Article" yang bisa diatur dari backend Joomla.

Artikel yang Tidak di Kategorikan 

Masalah berikutnya muncul ketika artikel yang sudah kutulis tidak muncul. Setelah dicek, ternyata penyebabnya adalah karena tidak secara otomatis masuk ke kategori artikel yang benar.

Aku pun mencari cara agar artikel yang dikirim langsung tersimpan di kategori “Article-Blog” secara otomatis  solusinya adalah dengan mengatur kategori default saat membuat menu "Create Article".

Halaman Login

mengatur supaya nama tersembunyi

Tantangan lain adalah menata tampilan login. Ternyata template sudah menyediakan tombol login di bagian atas, jadi aku ingin login dilakukan dari satu halaman saja tanpa ada tulisan tambahan di menu navigasi.

Aku belajar bahwa aku bisa menyembunyikan link login di menu dengan cara menyetel opsi "Hide from menu" dan tetap mengarahkan tombol login ke halaman khusus login itu.

Setelah itu, aku beralih ke pengaturan warna tombol “Log in” yang tampilannya biru dan tidak sesuai dengan tone warna webku. Aku mencoba mencari pengaturan warnanya lewat tab-tab di bagian Preset Template seperti:

  • Body
  • Menu
  • Footer
  • Top Bar

Tapi tidak ada satupun yang menyediakan pengaturan Primary Color atau Button Color. Semua hanya berisi pengaturan latar belakang dan warna teks.

Artinya, warna tombol itu tidak dikendalikan langsung oleh preset visual, melainkan melalui class Bootstrap btn-primary. Solusi terakhir dan paling efektif yang kudapatkan adalah menggunakan Custom CSS untuk menimpa (override) warna default tombol.

Dengan bantuan ChatGPT, aku dapatkan potongan kode CSS khusus yang bisa kutaruh di tab Custom Code pada pengaturan template. Di sana aku bisa mengatur tombol agar tampil dengan warna yang aku inginkan, dan teksnya tetap kontras agar mudah dibaca.

Search Bar

langkah mengatur fitur search

Hari ini aku juga fokus adalah pada fitur pencarian (search bar) yang ternyata tidak berfungsi sebagaimana mestinya. Awalnya kupikir hanya masalah kecil, tapi ternyata banyak hal yang saling berhubungan dan perlu aku pelajari untuk bisa menyelesaikannya dengan benar.

Masalah pertama yang aku temui adalah ketika pengguna mengetik sesuatu di search bar dan menekan enter, bukannya diarahkan ke halaman hasil pencarian, mereka malah kembali ke halaman home.

Ini tentu membingungkan dan tidak user-friendly. Setelah kucoba berkali-kali, hasilnya tetap sama. Aku mulai curiga bahwa search bar ini belum dikonfigurasi dengan benar.

Aku lalu memeriksa bagian menu di backend Joomla. Di sana aku menemukan sebuah menu bernama Search Result, dengan Menu Item Type yang sudah benar yaitu Search (com_finder).

Tapi anehnya, ketika aku mengakses search bar, tetap tidak muncul hasil pencarian. Dari sinilah aku menyadari bahwa kemungkinan menu “Search Result” ini belum ditautkan dengan benar oleh sistem pencarian di Joomla.

Setelah bertanya ke chatgpt dan mengecek diskusi di forum, aku baru tahu kalau komponen pencarian (com_finder) di Joomla memang perlu adanya halaman menu yang bertugas sebagai tempat hasil pencarian ditampilkan.

Jadi, halaman menu “Search Result” yang sudah kubuat sebenarnya memang diperlukan agar pencarian bisa bekerja. Namun, masalah baru muncul karena menu ini muncul di bagian navigasi utama (navbar) dan secara tampilan jadi mengganggu.

Tampilan Navbar yang Jadi Berantakan

Lalu aku belajar dua cara untuk mengatasi masalah ini:

Cara pertama, yang paling direkomendasikan, adalah dengan memindahkan item menu “Search Result” ke dalam menu tersembunyi (hidden menu).

Ini adalah teknik umum di Joomla: kita bisa membuat menu khusus bernama “Hidden Menu” yang tidak dilampirkan pada modul navigasi manapun. Menu ini tetap aktif secara fungsional, tapi tidak akan ditampilkan di tampilan pengguna.

Dengan cara ini, search bar bisa diarahkan ke halaman tersebut tanpa harus menampilkan link “Search Result” di navbar. Aku akhirnya membuat hidden menu dan memindahkan “Search Result” ke sana. Hasilnya: search bar berfungsi dan tampilan navbar tetap bersih. 

Cara kedua, sebagai alternatif atau solusi cepat, adalah menyembunyikan menu tersebut menggunakan CSS. Ini solusi cepat, tapi bukan jangka panjang. Cocok kalau kita tidak ingin repot membuat hidden menu. 

Selain itu, aku juga jadi lebih memahami struktur routing Joomla, bagaimana index.php?option=com_finder&view=search bekerja sebagai penunjuk halaman hasil pencarian, serta bagaimana modul search di template bisa diarahkan dengan benar.

Membuat Fitur Contact Us

menambahkan kontak

Awalnya, aku mengira bahwa jika ingin membuat halaman kontak, tinggal pilih menu item tipe “Contact” lalu pilih kontak yang sudah dibuat. Tapi dalam kasusku, aku tidak menggunakan SP Page Builder ataupun com_contact.

Jadi aku harus membangun sendiri halaman contact secara manual, langsung di artikel atau custom module, dengan menyisipkan HTML dan mungkin kode tambahan seperti JavaScript atau CSS. 

Langkah pertama yang kulakukan adalah membuat halaman baru khusus untuk “Contact Us”. Aku menggunakan menu item tipe “Single Article”, lalu membuat artikel baru yang isinya adalah form HTML sederhana.

kategori kontak

Setelah form ditampilkan, muncul beberapa tantangan baru seperti, Tampilan form tidak rapi karena tidak mengikuti style dari template. Jadi aku harus menambahkan CSS secara manual agar sesuai dengan desain website-ku.

Pelajaran penting hari ini

  • Setiap search bar Joomla butuh halaman menu yang aktif dengan tipe com_finder.
  • Menu hasil pencarian sebaiknya disimpan di hidden menu agar tidak muncul di navbar.
  • Developer tools di browser sangat berguna untuk troubleshooting elemen UI.
  • Jangan lupa menguji seluruh alur dari input ke output (dari search sampai hasil tampil).

Hari ini cukup produktif. Meskipun ada bagian-bagian Joomla yang cukup membingungkan di awal, aku mulai lebih paham bagaimana mengakali keterbatasannya dengan CSS manual. Semoga besok aku bisa mulai mengatur tampilan halaman artikel lebih lanjut.

Hari ini lumayan melelahkan tapi sangat memuaskan. Satu demi satu fitur blog-ku mulai lengkap dan siap digunakan oleh pengguna. Aku jadi makin paham bagaimana Joomla bekerja dan mulai menikmati prosesnya.

You are not authorised to post comments.

Comments powered by CComment