Pengenalan Block - Dasar-dasar Drupal

region tema bartik pada cms drupal

Pengenalan block pada drupal. Block di drupal sama halnya dengan widget pada bloger. Di drupal block terbentuk dari dua cara, yaitu block yang dibuat sendiri atau dibuat secara manual dan block yang otomatis tercipta dari  module-module drupal ataupun settingan lain pada drupal.  Block yang dibuat dapat ditempatkan di region tema drupal.

Untuk mengenal lebih jauh block drupal, saya akan membahas bagian bagian dari menu blocks. Agar lebih paham, klik menu structure dan pilih blocks. Maka akan tampil jendela baru, pada tampilan jendela tersebut terdapat menu Demonstrate block regions (Bartik). Mengapa yang didalam kurung adalah kata Bartik? Ya karena disini tema default web saya adalah tema bartik. Jika kita klik link demonstrate block regions (Bartik) maka kita akan melihat region-region tema bartik. Region-region inilah tempat dimana nanti block ditempatkan. Jika kita akan menambahkan atau membuat block sendiri dapat dengan mengklik menu add block.

Dibawah itu terdapat nama block region dan operations seperti contoh dibawah ini 

Nomor 1 pada gambar diatas menunjukan nama block yang ada baik block standar drupal ataupun block yang telah dibuat. Nomor 2 merupakan penempatan block, jika berstatus none berarti block tersebut disable atau tidak akan tampil, disinilah tempat dimana kita dapat mengatur penempatan sebuah block.  Gambar 3 adalah konfigurasi block dan jika di klik akan muncul settingan seperti di bawah ini :

Keterangan gambar diatas :

Pages – menampilkan block pada semua halaman atau halaman tertentu saja, jika pada halaman tertentu pilih pilihan only the listed pages dan masukkan alamat halaman yang akan ditampilkan block

Content types – menampilkan block pada jenis konten type atau jenis artikel tertentu

Roles – menampilkan block berdasarkan status user

Users – memberikan hak akses user untuk melakukan edit pada block tersebut

Itulah penjelasan singkat mengenai block pada drupal, contoh penggunaan block adalah ketika kita akan menempatkan sebuah iklan, hal ini tidak bedah jauh dengan widget yang ada pada bloger

Cara mudah modifikasi tema blog atau web dengan menggunakan firebug

Belajar modifikasi tema template blog. Kali ini saya akan share sebuah addson browser yang berfungsi untuk membantu kita dalam modifikasi tampilan blog. Kadang beberapa tema blog yang kita gunakan ada sedikit yang tidak sesuai dengan keinginan kita. Dan ketika merubahnya langsung dari dasbor bloger kita harus melakukan penyimpanan untuk melihat hasil modifikasi tersebut pada blog.

Dengan menggunakan add ons firebug yang ada pada browser, kita dapat langsung melihat hasil dari modifikasi tampilan blog tanpa harus menyimpannya terlebih dahulu. Keuntungan menggunakan add ons ini adalah kita tidak perlu takut akan tampilan blog yang salah di modifikasi karena pada saat menggunakan add ons ini code hasil modifikasi belum tersimpan dalam blog sebelum kita melakukan penyimpanan terlebih dahulu. Ketika menggunakan firebug setiap code css yang kita rubah, akan langsung dilihat hasilnya pada browser.

Baca Juga : Memasang Meta Tag Deskripsi dan Keyword di Blog

Menginstal firebug pada browser sama halnya dengan cara menginstal add ons wappalyzer yang pernah saya bahas, jadi saya akan bahas cara penggunaannya saja. Untuk menggunakan firebug cukup dengan klik icon firebug yang ada pada browser sampai muncul jendela firebug pada bagian bawah browser seperti contoh dibawah :

Ketika jendele firebug telah muncul klik icon inspect no 1 pada gambar diatas, lalu klik bagian template yang akan di modifikasi. Sebagai contoh saya akan merubah Judul blog saya yang sebelumnya berwarna putih menjadi warna merah. Ketika kita klik judul blog makan akan muncul file code css disebelah kanan yang menunjukan style dari judul blog (no 3).

Pada gambar diatas setelah kita klik judul blog, selanjutnya kita klik tag <a href…….. </a> (no 1) dan perhatikan disebelah kanan yang saya tandai dengan angka 2, terdapat code css yang menunjukan style dari h1 atau judul blog. Disitu dilihat bahwa color warna dari header h1 sudah saya ganti menjadi #ff0000 (warna merah) yang sebelumnya adalah #ffffff (warna putih).

Baca Juga : Membuat Artikel Terkait Atau Related Post di Blog

Dari contoh diatas penggunaan firebug sangatlah mudah, sehingga jika kita sudah yakin akan style yang kita terapkan tadi kita dapat langsung menggantinya di menu edit html pada blog. Sebaiknya kita juga harus paham sedikit tentang bahasa pemograman css dan html sehingga sangat mudah dalam mendesain sendiri tampilan blog kita.

Itulah cara mudah modifikasi blog dengan menggunakan firebug

Menginstal Modul CKEDITOR di DRUPAL

Tutorial cara instal modul CKEditor di drupal – menambahkan ckeditor pada drupal sama halnya dengan cara menginstal modul lain pada drupal, hanya kita harus menambahkan file file ckeditor yang di download pada situs resminya dan biasanya hal ini yang terlewatkan. Disinilah letak kesalahan pada saat pertama kali instal modul ini dan saya pun pernah mengalaminya.

Sebelum kita memulai cara menginstal modul ckeditor pada drupal, kita siapkan dulu modul dan file ckeditor. Pertama download modul ckeditor untuk drupal disni, dan file ckeditornya disitus resmi ckeditor disini.

Langkah –langkah penginstalan modul ckeditor :

1. Ekstrak file ckeditor yang di download di situs drupal copy dan tempatkan pada folder modules yang ada pada c > xamp > htdocs > freezon (atau nama site drupal anda) > sites > all > modules. Dan aktifkan modul pada menu modules yang ada pada halaman administrator. jika masih bingung cara instal modul di drupal dapat mengikuti panduan cara instal modul di drupal 
2.  Setelah berhasil mengaktifkan modul ckeditor, kemudian ekstrak file ckeditor yang di download di situs ckeditor dan tempatkan pada folder ckeditor yang ada didalam folder modul ckeditor untuk drupal.

Jika sudah mengikuti langkah-langkah diatas dengan benar, kembali ke home dengan mengklik menu home, kemudian klik add content dan pilih content artikel. Perhatikan pada bagian body jika sudah muncul beberapa teks editor, berarti penginstalan modul ckeditor telah berhasil.

Satu lagi hal yang perlu di ketahui dalam penggunaan modul ini , yaitu ketika akan membuat sebuah artikel, text format yang berada tepat dibawah body diganti dengan mode full html agar supaya artikel yang di edit bisa tampil sempurna. Namun karena secara default mode text formatnya adalah filtered html, kita dapat merubahnya agar selalu menjadi full html dengan cara, klik menu configurasi cari CONTENT AUTHORING dan klik menu text formats, kemudian geser full html pada urutan pertama.

Mengganti Tema Template Pada Drupal

Cara merubah tema cms drupal – Mengganti tema atau template di CMS drupal dapat dilakukan dengan mudah dan cepat, Karena telah banyak disediakan tema tema gratisan untuk website berbasis cms drupal. Ada yang disediakan langsung di web drupal maupun website penyedia tema-tema gratisan.

Ada 2 tipe tema yang dapat di download dan diterapkan pada cms drupal pertama tema yang sudah lengkap yaitu tema yang tinggal siap pakai dan tema yang hanya menyediakan rangka dasar dan perlu dilakukan design tambahan dan keahlian khusus dalam bahasa pemograman seperti css html dan php contohnya pada tema omega dan zen.

Kali ini saya akan bahas tentang bagaimana cara mengganti tema pada drupal dengan menggunakan tema yang sudah siap pakai. Lakukan pencarian tema yang di website drupal ataupun di website lain penyedia tema drupal. Lakukan pencarian di google dengan kata kunci ‘download free template drupal’ Sebagai contoh disini saya mengunduh tema marinelli yang saya unduh langsung di web drupal.

Untuk mengganti tema drupal ikuti langkah-langkah berikut :

Ekstra tema yang telah di download kemudian tempatkan dalam folder c://xamp/htdocs/drupalku/sites/all/themes. Buka browser masuk ke website drupal dengan menggunakan login admin, kemudian klik menu appereance. Scroll mouse kebawah dan cari nama tema yang telah di download lalu klik enable and set default. contoh dibawah ini saya mengaktifkan tema marinelli dengan mengklik enable and set default.

Tunggu hingga proses pergantian tema selesai. Klik Home untuk melihat hasil perubahan tema web drupal anda.

Cara Mengetahui Teknologi yang digunakan oleh sebuah website

Untuk mengetahui apakah sebuah website itu dibangun menggunakan cms dan fitur-fitur apa yang terdapat  pada website tersebut, kita hanya tinggal menambahkan ekstensi pada browser yaitu ekstensi wappalyzer. Ekstensi ini dapat di download pada google aplikasi, Mozilla ekstensi atau langsung pada website wappalyzer.

Gambar diatas merupakan contoh penggunaan wappalyzer pada browser google chrome. Dari hasil diatas di ketahui bahwa website tersebut menggunakan cms drupal, jquery bahasa pemograman php, google analytic dll.

Berikut cara menambahkan ekstensi wappalyzer pada browser google chrome dan Mozilla firefox

1.    Pada Google Chrome
Klik pada menu aplikasi yang terdapat disudut sebelah kiri browser kemudian klik menu store. Pada kotak pencarian tulis kata wappalyzer kemudian enter. jika Ekstensi wappalyzer telah ditemukan tekan tanda + untuk menginstalnya kedalam browser.

2.    Pada Mozilla FireFox
Klik menu Firefox dan pilih add ons, pada kotak pencarian klik wappalyzer kemudian tekan enter untuk pencarian ekstensi tersebut. Jika sudah muncul kemudian klik install. Setelah itu restart browser untuk mengaktifkan add ons wappalyzer.

Jika anda ingin mengetahui teknologi yang digunakan dalam pembuatan sebuah situs, dapat langsung mengunjungi situs tersebut, secara otomatis wappalyzer akan memperlihatkan teknologi apa yang digunakan pada site itu yang dapat berubah cms, framework ataupun script-script java.

Contoh pada browser firefox hasil dari website yang menggunakan cms drupal

Ekstensi ini biasa saya gunakan untuk melihat-melihat pengembangan website yang berbasis cms, terutama website drupal untuk dijadikan contoh dalam belajar pembuatan web menggunakan cms drupal

Cara Install Modul di CMS Drupal

Untuk meningkatkan performa drupal, kita perlu melakukan instalasi beberapa modul. Adapun cara install modul drupal akan saya bahas di tutorial kali ini. Menginstal Modul pada drupal tidaklah begitu rumit, kita hanya menempatkan modul tersebut ke dalam folder modul yang telah disediakan di folder utama drupal dan tinggal mengaktifkannya pada administrator.

Pada contoh kali ini kita akan belajar install modul pathauto yang berfungsi untuk merubah alamat url website sesuai dengan nama judul artikel yang kita buat. Namun dalam penginstalan modul pathauto kita memerlukan modul bantuan yaitu modul token. Jika module token tidak terinstal maka modul pathauto juga tidak bisa dilakukan instalasi.

Download modul pathauto dan modul token di web drupal. Ekstrak modul tersebut dan tempatkan kedalam folder modules yang berada pada c://xamp/htdocs/drupalku/sites/all/modules. Buka browser ketikan alamat url web drupal anda dan  Login dengan menggunakan user admin pada web drupal klik menu modules cari modul token dan pathauto kemudian centang kedua modul tersebut dan klik save configuration.

Setelah itu untuk menguji apakah modul pathauto sudah terinstal, cobalah untuk membuat sebuah artikel dengan judul sesuai dengan keinginan kemudian save. Buka artikel tersebut dan cek url yang ada pada address url browser, jika url browser sudah sesuai dengan nama artikel yang anda buat, berarti modul pathauto telah berhasil terinstal.

sampai disini kita telah selesai menginstall modul pathauto. Dan untuk menginstal modul-modul lain di drupal prosesnya sama dengan cara diatas, Tinggal settingan ataupun konfigurasi modul yang berbeda-beda sesuai dengan jenis modul itu sendiri.

Cara Instal Drupal

Cara Install Drupal - Sebagai pengguna setia drupal saya berbagi pengalaman tentang bagaimana cara install cms drupal. Kita dapat menggunakan CMS Drupal untuk membuat website secara cepat. Disini saya menggunakan drupal 7 sebagai contoh. Nah bagi yang baru dengar kata drupal dan bertanya-tanya tentang apa itu drupal dapat langsung search di om google ya heheh.

Untuk menginstal CMS Drupal kita hanya membutuhkan waktu sekitar 10 menit saja namun sebelumnya kita harus mempersiapkan aplikasi seperti xampp untuk webserver. Pertama-tama download cms drupal disini kemudian ekstrak file drupal dan tempatkan di folder C > xampp >htdocs dan rename folder drupal 7 menjadi drupalku.

Sebelum melanjutkan penginstalan buat sebuah database untuk drupal. buka browser dan ketikkan localhost/phpmyadmin dan buat database dengan nama drupalku.

lanjut tahap pertama penginstalan drupal, buka browser dan ketikkan localhost/drupalku kemudian enter dan akan muncul tampilan pertama tahap instalasi drupal. pilih profil standart kemudian klik save and continue. pada pilihan bahasa pilih english dan klik save and continue.

Selanjutnya pada tampilan Database Configuration, database type pilih mysql, mariadb or equivalent, database name isi dengan nama database yang telah dibuat tadi yaitu drupalku, database username isikan dengan root password biarkan kosong dan kemudian klik save and continue. Proses instalasi sedang berjalan.

Setelah proses instalasi telah selesai, tinggal mengkonfigurasi site drupal. Site name isi dengan nama site kita contoh drupalku, site e-mail address isi dengan alamat email, username isi dengan admin, password isi sesuai dengan keinginan dan yang terakhir dafault country isi dengan indonesia dengan timezone sesuai daerah masing-masing kemudian klik save and continue.

tampilan akhir dari instalasi drupal. untuk memperlengkap fitur-fitur dalam cms drupal kita tinggal menambahkan modul-modul drupal.

Cara Upload Website / Situs dengan Menggunakan FileZilla

Kali ini saya akan share sedikit tentang bagaimana cara upload website dari komputer lokal ke web hosting. Aplikasi yang saya gunakan adalah FileZilla salah satu aplikasi gratis yang digunakan untuk upload situs ke webhosting. Sebenarnya kita dapat upload web langsung dari cpanel hosting, namun proses uploadnya memakan waktu yang lama.

Pertama-tama lakukan konfigurasi, yaitu berupa username, host dan port yang digunakan untuk koneksi ke cpanel webhosting. ada dua cara untuk melakukan konfigurasi di FileZilla yaitu dengan cara manual atau dengan cara konfigurasi file.

Konfigurasi User, password dan host FileZilla secara manual
Masuk kedalam cpanel webhosting anda, kemudian klik menu FTP Account. kemudian pada tampilan Special FTP Account klik salah satu account anda dan lihat konfigurasinya seperti gambar dibawah ini

Isi Host yang ada pada aplikasi FileZilla dengan FTP Server, username isi dengan FTP Username dan port gunakan port 21. setelah itu klik quick connect

Konfigurasi FileZilla dengan menggunakan konfigurasi file
Masuk kedalam cpanel webhosting anda, kemudian klik menu FTP Account. kemudian pada tampilan Special FTP Account klik salah satu account anda dan lihat konfigurasinya seperti gambar dibawah ini

Klik FTP Configuration File untuk mendownload File konfigurasi. kemudian buka aplikasi FileZilla klik menu File dan pilih import, masukkan file konfigurasi yang telah didownload tadi dan klik import. 

Setelah berhasil mengimpor file, klik menu file - site manager dan pilih nama account hasil import lalu klik connnect maka akan muncul tampilan login yang tinggal diisikan password saja.