1. Install Joomla
Berikut ini adalah proses instalasi Joomla di LocalHost Xampp:
Langkah 1: buat file baru di XAMPP\htdocs (Nama Sesaui Project web yang akan di
buat)
2. extract joomla tadi kepada file yang telah di buat tadi
3. setelah itu,buka localhost/namafolder. ingat nama folder tadi.jika sudah, tampilan awal
seperti ini
4. isi satu-satu.site name untuk nama situs.dan description untuk pendeskripsian dari situs
tersebut. Admin email bisa di isi acak.username dan password harus diisi dengan benar buat
login nantinya.jika sudah, klik next
5. selanjutnya, database akan tampil seperti ini
6. Untuk type database kita pilih dulu MySQL.untuk mengetahui perbedaan
MySQL,MySQLi,dan PDO,bisa di lihat di bawah ini
7. Host name jgn di ubah dan usernamenya harus root.password bisa di lewat.database namenya
diambil dari database yang telah kita buat sebelumnya.lalu klik next
8. Setelah itu, tampilan depan seperti ini.di finalisation, kita pilih Blog English (GB) Sample
Data. lalu klik install
9. lalu tampilan seperti ini. klik Remove instalation folder
2. Folder Media
Joomla adalah salah satu CMS populer untuk membuat berbagai tipe website dengan cepat
dan mudah. Joomla mengalami perkembangan yang cukup pesat dengan hadirnya
berbagai fitur baru yang kompleks dan stabil sehingga lebih mudah digunakan. Dengan
Joomla, website tidak hanya menampilkan konten teks saja, tetapi juga gambar, video dan
suara (file multimedia). Konten gambar, video dan suara dapat dikelola lebih mudah dan
dijalankan dengan baik di Joomla.
Di Joomla, file gambar, video dan suara perlu disiapkan dan diunggah ke folder Media
digunakan. Ada baiknya bila Anda membuat folder baru terlebih dahulu untuk menyimpan
berbagai tipe file berbeda, misalnya folder khusus untuk menyimpan file gambar, video
atau suara. Untuk tipe file yang sama, Anda juga dapat membuat folder untuk maksud
pengelompokan agar mudah dikelola atau dicari saat digunakan.
Joomla menyediakan area khusus yang disebut Media untuk mengunggah dan mengelola
file-file pendukung seperti gambar, video dan suara. File-file tersebut dapat diunggah
untuk dikelompokkan di dalam folder. Bila belum ada folder yang mewakili sebagai
tempat penyimpanan file-file tersebut, Anda dapat membuat folder baru dengan mudah di
area Media. Berikut ini adalah cara membuat folder baru di area Media dari Joomla.
Masuk terlebih dahulu ke area administrator (backend) Joomla dan kemudian klik menu
Content > Media.
Di laman Media yang muncul, klik tombol Create New Folder yang terletak di bagian atas
untuk mulai membuat folder baru.
Di dalam kotak teks yang kosong, di samping kiri tombol Create Folder, tuliskan nama
folder baru yang ingin dibuat, misalnya contoh123 dan kemudian klik tombol Create
Folder.
Apabila proses pembuatan folder baru berjalan lancar, Folder baru (contoh123)
ditampilkan di area Media sebelah kanan.
4. Article
Mari kita mulai dengan beberapa pengertian. Di Joomla, sebuah Artikel adalah beberapa
informasi tertulis yang ingin anda tampilkan di situs. Biasanya, ia mengandung teks dan
dapat juga berisikan gambar-gambar maupun jenis-jenis konten lainnya. Umumnya di
situs Joomla, artikel-artikel itulah yang membentuk informasi terbesar yang tampil di
situs web.
Penting untuk dipahami bahwa di Joomla, konten situs (contohnya Artikel) itu adalah
proses yang benar-benar terpisah dari pembuatan situs - tentang bagaimana bentuknya di
suatu halaman. Jadi, untuk memahami Artikel, yang terbaik adalah memikirkannya
sebagai Konten murni, terlepas dari bagaimana ia ditampilkan. Sebagai contoh, artikel
yang sama mungkin akan ditampilkan dengan jenis dan bentuk huruf, warna, tajuk dan
latar belakang yang berbeda dari artikel lainnya, dan ia bisa saja tampil di tempat yang
berbeda-beda pada suatu halaman. Syarat artikel :
Pertama => klik content lalu pilih article setelah itu => klik new pada kiri atas lalu isikan
title sesuai dengan perusahaan yang di buat
Setelah itu isikan gambar dan juga deskripsi perusahaan yang di buat kurang lebihnya
seperti di bawah, dan jika sudah blok semua tulisan deskripsi ubah menjadi rata tengah
seperti pada gambar dengan mengeklik tools pada tepat di bawah tools view, untuk font
disini menggunakan 12 untuk paragraph dan sub judul yaitu 18 dan juga di bold atau
cetak tebal
Setelah itu klik pada image and link isikan gambar penunjang di perusahaan yang di buat
seperti di bawah ini, sebelumnya aplod terlebih dahulu gambar yang akan diisikan di
halaman home tersebut.
Pada halaman Profil juga sama namun untuk isi deskripsi sesuaikan seperti di bawah ini
Rata Kiri (LAYANAN, PORTOFOLIO dan BLOG)
Pada setiap article ukuran gambar yaitu 100% yang berfungsi ketika dilihat pada tampilan
smartphpne gambar mengikuti ikuran layar ponsel tersebut tidak kekecilan dan juga tidak
kebesaran. Untuk caranya yaitu tambahkan gambar ke dua di bagian content lalu gambar
tersebut di klik kanan yang akan muncul sebagai berikut,sesuaikan seperti di bawah ini
Caption di gambar body setiap article dibuat rata tengah, pake huruf kecil semua kecuali
awal kalimat dan huruf pertama kata baku
Terdapat CTA yang bisa dihubungi
CTA tersebut di buat menngunakan module yang berfungsi sebagai buttom klik menuju
whatsapp agar memudahkan pengunjung jika berminat dengan jasa yang di tawarkan
Read More adalah sebagai penampil kalimat pada saat sebuah article sebelum di buka
pada tampilan yang full. Caranya yaitu yang pertama letakan cursore pada akhir kalimat
yang akan di tampilkan lalu klik => tools Read More dan akan muncul garis putus putus
untuk sekilas caranya sebagai berikut :
Sekilas contoh pembuatan artikel pada halaman Layanan, Portofolio dan Blog :Artikel
sendiri merupakan isi atau kontek dari beberapa menu seperti :
Menu Layanan
Menu Portofolio
5. Category
Di Joomla, Kategori-Kategori menyediakan suatu metode opsional yang berguna untuk
menyusun artikel. Begini cara kerjanya, satu Kategori mengandung banyak artikel dan
Kategori-Kategori lainnya. Satu Artikel bisa saja hanya berada di dalam satu Kategori.
Jika suatu kategori berada di bawah kategori yang lainnya, maka ia disebut Subkategori.
Sebagai contoh, anggaplah anda memiliki sebuah tata letak Blog Kategori untuk Kategori
"Peliharaan", dan anggaplah anda mengatur artikel berdasarkan urutan pertama kali ia
dibuat. Pada saat anda menambah sebuah Artikel baru ke dalam Kategori "Peliharaan", ia
akan secara otomatis tampil di halaman blog "Peliharaan" sebagai Artikel yang pertama.
Anda tidak perlu melakukan apa-apa lagi selain menambah Artikel dan menetapkannya
ke dalam Kategori "Peliharaan".
Cukup mudah.
Menyusun Artikel di dalam Pengelolaan Artikel
Jika anda memiliki banyak artikel, alasan kedua mengapa kita menggunakan kategori
adalah, ia mempermudah pengelompokan artikel sehingga anda dapat dengan mudah
menemukannya. Contohnya, di Pengelolaan Artikel, anda dapat menyaring artikel-artikel
itu berdasarkan Kategori. Jadi, apabila anda memiliki lebih dari 200 artikel di situs, maka
anda dapat dengan mudah menemukan sebuah Artikel karena anda tahu Kategorinya.
6. Modul
Tahu nggak Sob, kalau Joomla memiliki modul yang bermacam? Nah, modul ini yang
nantinya bisa dipasang di situs kamu sebagai tambahan loh. Salah satunya adalah modul
Login.
Di tutorial kali ini, kamu akan belajar cara membuat modul Slider DJ-ImageSlider
(Banner)- DJ-ImageSlider, by DJ-Extensions - Joomla Extension Directory
DJ- ImageSlider yaitu untuk memperindah tampilan
Caranya :
Pertama liat dulu di Modul bisa dilihat di bagian Extensions – Modules. Misal
belum ada modulnya bisa download di google
https://extensions.joomla.org/category/photos-a-images/slideshow/ tinggal di pilih sesuai
keinginan.
Lalu di install modul nya. Caranya masuk dibagian Extensions – Manage – Install
Klik Or browser for lite
7. Plugin
Apa itu Plugins Joomla? Plugins Joomla adalah sebuah software yang memiliki fungsi
tertentu, yang memungkinkan aplikasi atau program menjalankan fitur tambahan sesuai
jenis plugin yang digunakan pada Joomla.
1) EasyImageCaption
Plugin ini digunakan agar ada caption di setiap gambar.
Link Download = https://extensions.joomla.org/extension/easyimagecaption/
Cara membuatnya : (Install terlebih dahulu ( sama seperti install modul sebelumnya ))
Ø Kemudian pilih articles
Ø Pilih artikel yang mau diubah ( klik salah satu )
Ø Tampilannya seperti ini
Ø Lalu kalo mau lihat ada gambar atau tidak untuk intro lihat di menu image and
link.
Ø Tampilannya seperti ini, lalu klik icon seperti mata untuk melihat, dan di caption
ini untuk memberikan nama image nya.
Into Image yaitu tampilan gambaran yang akan ditampilkan di sebuah halaman,
misal seperti halaman blog
Ø Hasilnya seperti dibawah
Ø Lalu kalo mau lihat ada gambar atau tidak untuk full article image, Tampilannya
seperti ini, lalu klik icon seperti mata untuk melihat, dan di caption ini untuk
memberikan nama image nya.
Full Article Image yaitu tampilan gambaran yang akan ditampilkan bagian
halaman artikelnya jadi misal di klik salah satu blog artikelnya nanti akan muncul
gambarnya.
Ø Hasilnya seperti dibawah
Ø Untuk melihat termasuk dikategori apa, bias dilihat di samping kanan
· Mengubah posisi menu
Ø Masuk ke tools joomla, lalu pilih menu Menus
Ø Kemudian pilih Main Menu
Ø Tampilannya seperti ini, kemudian ketika mau mengubah posisi menu tinggal klik
tekan (titik 3 nya) lalu tarik sesuai keinginan mau di taruh di posisi mana.
Ø Kemudian hapus isi artikel dan diganti dengan yang anda inginkan.
· Cara mengganti gambar pada artikel
Ø Mengganti gambar di intro artikel lihat di menu image and link.
Ø Tampilannya seperti ini, klik select
Ø Kemudian pilih gambar yang diinginkan, klik insert
Ø Untuk mengganti gambar di dalam (body artikel) klik image
Ø Kemudian pilih gambar yang diinginkan, klik insert
Ø Kemudian klik gambar yang telah dipilih, lalu klik image
Ø Atur sesuai dengan standar aturan joomla, Dimensions diisi 100% lalu klik Ok
· Mengisi gambar di media
Ø Masuk ke tools joomla, lalu pilih menu Content
Ø Kemudian pilih Media
Ø Kemudian klik upload, klik choose files
Ø Kemudian pilih gambar yang ingin dimasukan, klik open, lalu kli start upload
· Aturan gambar
Ø Untuk gambar biasanya menggunakan sesuai dengan kebutuhan, lebih baiknya
agar gambar ukurannya sama bias diedit terlebih dahulu di ppt maupun canva agar
ukurannya sama. Menggunakan ukuran 16 : 9
Ø Atur sesuai dengan standar aturan joomla, Dimensions diisi 100%
· Management media
Agar di media terlihat rapi, bias membuat folder agar terpisah pisah agar terlihat rapid
dan memudahkan untuk mencari gambarnya.
Untuk membuat folder baru klik creat new folder lalu klik creat folder
· Membuat caption
Ø Install pluginnya caranya seperti install modul, lalu masuk ke bagian Plug in
Ø Kemudian cari yang easyImageCapttion di klik agar berubah tanda centang
Kategori pada sebuah website akan sangat berguna jika ingin mengelompokan artikel menjadi
beberapa bagian. Hampir semua Content Management System sudah memiliki fitur ini, termasuk
Joomla. Berikut ini adalah langkah-langkah cara menambahkan kategori pada Joomla.
4. Jika sudah selesai membuat kategori Joomla, silahkan klik tombol Save hingga muncul
keterangan bahwa perubahan berhasil dilakukan.
Menambahkan Artikel
Untuk menambahkan artikel pada kontrol panel Joomla, Anda bisa pilih tab menu New Article.
Selanjutnya, Anda akan diarahkan pada halaman membuat artikel baru. Tampilannya seperti
pada gambar di bawah ini.
Pada halaman di atas, Anda bisa menyimpan artikel, melakukan publikasi (publish), menarik
artikel dari publikasi (unpublished), dan mengarsipkan artikel (archive).
Setelah postingan artikel yang sudah Anda tambahkan disimpan dan publish, maka akan muncul
artikel baru di website Anda.
Article
Pertama => klik content lalu pilih article setelah itu => klik new pada kiri atas lalu isikan
title sesuai dengan perusahaan yang di buat
Setelah itu isikan gambar dan juga deskripsi perusahaan yang di buat kurang lebihnya
seperti di bawah, dan jika sudah blok semua tulisan deskripsi ubah menjadi rata tengah
seperti pada gambar dengan mengeklik tools pada tepat di bawah tools view, untuk font
disini menggunakan 12 untuk paragraph dan sub judul yaitu 18 dan juga di bold atau
cetak tebal
Setelah itu klik pada image and link isikan gambar penunjang di perusahaan yang di buat
seperti di bawah ini, sebelumnya aplod terlebih dahulu gambar yang akan diisikan di
halaman home tersebut.
Pada halaman Profil juga sama namun untuk isi deskripsi sesuaikan seperti di bawah ini
7) Rata Kiri (LAYANAN, PORTOFOLIO dan BLOG)
Pada setiap article ukuran gambar yaitu 100% yang berfungsi ketika dilihat pada tampilan
smartphpne gambar mengikuti ikuran layar ponsel tersebut tidak kekecilan dan juga tidak
kebesaran. Untuk caranya yaitu tambahkan gambar ke dua di bagian content lalu gambar
tersebut di klik kanan yang akan muncul sebagai berikut,sesuaikan seperti di bawah ini
9) Caption di gambar body setiap article dibuat rata tengah, pake huruf kecil semua kecuali
awal kalimat dan huruf pertama kata baku
10) Terdapat CTA yang bisa dihubungi
CTA tersebut di buat menngunakan module yang berfungsi sebagai buttom klik menuju
whatsapp agar memudahkan pengunjung jika berminat dengan jasa yang di tawarkan
11) Memiliki Slogan Websitnya (HOME)
Beri Read More (LAYANAN, PORTOFOLIO dan BLOG)
Read More adalah sebagai penampil kalimat pada saat sebuah article sebelum di buka
pada tampilan yang full. Caranya yaitu yang pertama letakan cursore pada akhir kalimat
yang akan di tampilkan lalu klik => tools Read More dan akan muncul garis putus putus
untuk sekilas caranya sebagai berikut :
Isikan semua pada setiap halaman di website yang dibuat, sebagai contoh pada halaman
layanan copy judulnya lalu => klik publishing akan muncul seperti pada gambar ke dua
Page break digunakan untuk memecah satu artikel yang panjang menjadi beberapa halaman.
Dengan teknik Page break anda dapat membuat daftar konten dalam sebuah tabel dimana bagian
konten halaman ditampilkan dengan link dan mewakili isi bagian dari artikel yang panjang tadi.
Selain dengan tabel konten yang berupa link, page break akan membagi halaman menjadi
beberapa halaman yang menampilkan link Prev dan Next atau pagination dalam format angka
pada artikel yang anda buat. Untuk mengunakan Page break di Joomla anda harus mengaktifkan
plugin “Page Break“. Plugin ini adalah plugin bawaan Joomla. Jadi ketika anda menginstall
Joomla maka secara otomatis Joomla akan menginstallkan plugin ini.
Jika belum aktif, anda bisa mengaktifkannya melalui menu “Plugins” >> temukan Plugin “Page
Break” >> klik pada tombol “Enable“.
Cobalah buatlah artikel yang panjang berisi 10 paragraf dan anda bagi setiap dua paragraf
menjadi BAB I, II, III dan seterusnya.
Tempatkan kursor pada bagian artikel yang ingin anda pecah kemudian klik tombol “Page
Break” yang bisa anda temukan pada bagian bawah teks editor.
Isi “Page Title” dan “Table of Content Alias” kemudian klik pada tombol “Insert Page Break“
Jika sudah cobalah klik icon “Save” untuk menyimpan artikel yang sudah anda pecah menjadi
beberapa halaman.
Teknik ini sering digunakan pada portal portal berita yang membagi isi berita ke dalam beberapa
halaman yang ditampilkan dalam format pagination Prev Next atau pagination dalam format
angka. Dengan membagi artikel dalam beberapa halaman, pengunjung lebih nyaman untuk
membacanya.
Mari kita anggap kita akan membuat sebuah bidang dengan opsi-opsi seperti ditunjukkan dalam
gambar berikut.
Masuk ke
Module Main Men, Untuk Show Title yang sudah digaris bawahi Harus di Show dikarenakan
Navigasi Main Menu Harus Tampil Di Laman Website.
Untuk di Bagian Position Klik Tombol kebawah dan ketikan Menu dikarenakan Kita akan
Memasukan Module Main Menu di Template Website.
Untuk Mengetahui Posisi Dari Template Yang Sudah Kita Install Bisa Meniru Gambar diatas
dengan Mengetikan /?tp=1 di Domain Url, Bisa dilihat Muncul Posisi Module Dari Templat
Yang Sudah Kita Install, Kemudian Praktekan Penempatan Module Sesuai Kebutuhan Anda
Bisa dilihat Hasil dari yang sudah Dipraktekan Dibagian Toolbar Muncul Module Main Menu
Hasil dan Terapkan Module Video di Posisi Yang kamu Inginkan Kemudian Save
Done