Drupal_Design

Setting Layout Drupal melalui Block

Bahasan ini melengkapi posting saya pada kategori drupal, setelah sebelumnya kita telah sukses melakukan instalasi, tahapan berikutnya adalah konfigurasi site baru kita. Beberapa pertanyaan yang sering muncul ke saya tentang drupal ini adalah bagaimana merubah posisi layoutnya ?. Dalam seting perwajahan drupal, nanti akan kita kenal istilah block. Block inilah yang nantinya berguna untuk melakukan perubahan-perubahan posisi layout, begitupun kita dapat menambahkan block baru jika diperlukan, dan hebatnya lagi ini bisa diseting di user mana kita munculkan, serta pada saat apa-apa saja kita hidden. Hebat bukan ?. Oke, dalam tulisan ini akan coba kita bahas dan langsung praktekkan.

Catatan : tutorial dibawah ini merupakan edisi lanjutan tulisan sebelumnya disini, jika ada perbedaan url, user-password, dsb terhadap instalasi drupal anda mohon bisa disesuaikan sendiri.

1. Tentu saja di PC anda pastikan service apache dan mysql running. Klik 2x pada c:\xampp\xampp-control. Penampakannya seperti ini :

5

 

jika belum pada posisi running silakan klik start di sisi kanan sebelah Apache dan mysql.

2. Buka browser anda, masuk ke url http://localhost/coba , kemudian diikuti oleh login menggunakan user : admin, password : 123456 pada sisi sebelah kiri disini.

17

3. Setelah berhasil login, maka klik AdministerSite BuildingBlock seperti terlihat dibawah ini

18

Block ini merupakan seting region atau wilayah theme kita, pada theme garland yang sedang kita pakai ini maka kita akan mendapatkan 5 region yakni : Left sidebar (sisi kiri), Right sidebar (sisi kanan), Content (sisi tengah), header (atas) dan footer (bawah).  Region ini apa gunanya ?. kita bisa mengatur widget untuk ditempatkan pada sisi mana saja yang kita mau. Pada theme lainnya tentu saja berbeda-beda, ada yang 9 region, 15 bahkan 20.

4. Oke, setelah masuk kita nanti akan ketemu halaman seperti ini, kemudian pada praktek kali ini kita akan memindahkan letak User Login yang sebelumnya berada pada sisi kiri (Left Sidebar) menjadi sebelah kanan (Right Sidebar), seperti dibawah ini

20

Setelah itu diikuti dengan klik tombol Save Block di bagian bawah. Perhatian, segala macam perubahan yang tanpa diikuti oleh klik Save/simpan maka akan menjadi tidak berpengaruh apapun, ini juga diperlukan untuk konfigurasi yang lain.

21

 

Nah, untuk mengecek perubahannya, bisa dilakukan logout terlebih dahulu dikarenakan widget user login hanya muncul pada user yang belum login.

22

nah sekarang sudah pindah ke sisi sebelah kanan bukan ?. Nampak seperti di bawah ini

23Membuat block baru

Materi berikutnya adalah bagaimana membuat block baru yang kita inginkan. Block baru ini berguna untuk memunculkan informasi jika block-block yang tersedia tidak cukup mewadahi keinginan kita. Sebagai contoh kita ingin membuat block yang berisikan kata-kata mutiara/kalimat bijak.

1. Masuk kembali pada Administer–Site Building–Block, kemudian klik pada Add Block

24

 

2. Pada halaman Add Block, 

25

 

silakan isi Block Description dengan kata-kata yang memudahkan kita untuk menggambarkan block, semisal : Kata-kata Mutiara, kemudian pada Block Title isikan dengan kata yang nanti akan diposisikan sebagai judul block baru nanti, misalnya : Kata-kata bijak.

Nah, pada Block body inilah kita mengisikan kata-kata mutiara yang hendak ingin dituliskan, semisal : Hidup hanya sekali, buatlah hidup yang berarti.

Sampai disini sebenarnya block sudah siap untuk di Save dan ditampilkan ke pengunjung, namun nampaknya koq kurang ‘menggigit’ dengan seting standar ini.

nah, kemudian kita akan seting dengan opsi khusus. Misalkan block Kata-kata mutiara ini akan kita seting hanya untuk user yang telah login saja dan hanya muncul pada halaman depan. Bagaimana caranya ?.

Perhatikan pada bagian Role specific visibility settings

26

pada opsi Show block for specific roles: silakan checklist pada Authenticated Users artinya adalah block ini hanya akan muncul pada user yang telah login.

kemudian pada Show block on specific pages: silakan pilih pada Show on only the listed pages. (hanya muncul pada halaman yang didaftar) kemudian pada daftar tuliskan <front>. Artinya block baru ini hanya akan muncul pada halaman depan saja. bagaimana dengan halaman lainnya?. maka block ini akan hidden/ tersembunyi. Sedianya daftar ini bisa juga diisi oleh halaman-halaman lainnya, sehingga block ini bisa kita set pada halaman-halaman tertentu, namun akan kita bahas pada tutorial berikutnya saja yah :).

Oke, sekarang sudah bisa di tekan Save block untuk memprosesnya. Jika kemudian terlihat halaman baru dengan muncul kata The block has been created. artinya telah sukses terbuat.

27

 

Perhatikan pada bagian Disabled, kata-kata mutiara masih terdapat disana, maksudnya apa ?. Drupal akan membuatnya sementara disabled/tidak diaktifkan sampai kita menempatkannya pada region yang kita tentukan, misalnya kita ingin membuatnya nampak pada sisi sebelah kanan, maka kita akan klik seperti ini : Pilih Right sidebar dilanjutkan dengan klik Save block

28  Setelah Save block kita tekan, maka block ini akan pindah  pada bagian Right sidebar, seperti ini

29Sampai disini, pekerjaan  kita telah selesai. Untuk mengetes keberhasilannya silakan logout dan cek dibagian sisi kanan, apakah block ini terlihat. Kemudian, bandingkan dengan ketika anda telah melakukan login. Bandingannya seperti ini :

ketika telah logout

30

ketika telah login block kembali terlihat

31

Berikutnya anda juga bisa mengecek, jika masuk pada halaman lain (selain halaman depan) apakah block ini akan terlihat.

Oke, seting block telah kita lakukan, harapannya anda telah menguasai materi ini saat ini.

Selamat mencoba !

Salam hangat,

Dedy.


Sekilas info…

e-book Drupal gratis.. mau ?

Dalam rangka maulid nabi Muhammad SAW, DedySetyo.Net membagi-bagikan e-book drupal gratis karangan David mercer setebal 284 halaman. Terhitung sampai dengan 31 Januari 2013 saja. Penampakannya kayak gini :

buku_drupal

Setelah saya cek di amazon.com ternyata harganya $40 alias sekitar Rp.400.000, –

amazon_buku_drupal

ini bagi yang mau lho ya.. saya nggak maksa dan nggak ambil tarif sepeser pun.. he he

Caranya begini :

1. Share tulisan ini ke status FB anda dengan cara klik tombol ‘share’ facebook dibawah. Penampakannya kayak gini –> fb

2. Tulis di wall fb saya Dedy Setyo Afrianto sebagai laporan kalo sudah anda share, jangan lupa tulis emailnya ya.. 🙂

dalam waktu 1 x 24 jam, insyaAllah akan saya kirim ke email anda.. mudah2an tidak ada listrik mati atau perjalanan dinas mendadak (kalau itu hal lain.. he he), kalau kelupaan mhn diingatkan ajah..

Oke. demikian update hari ini..

Selamat membaca !


About dedy setyo

Tetap bangga dan mencintai pekerjaannya sebagai Pengajar, Pendidik, Peneliti, Pegiat teknologi dan narasumber dalam ranah pendidikan khususnya media pendidikan spesialisasi media digital, e-learning dan Open Source untuk pendidikan. Selengkapnya disini. Bisa dihubungi melalui e-mail : dedy@dedysetyo.net atau Call/SMS : 087770030903 WA : 085718904956 atau FB, atau

Leave a Reply

Your email address will not be published. Required fields are marked *

Silahkan jawab soal ini : * Time limit is exhausted. Please reload the CAPTCHA.