Membangun Website

Dengan DRUPAL 7

LPTSI UNSOED http://lptsi.unsoed.ac.id

INSTALASI DRUPAL 7
Drupal 7 hadir dengan berbagai macam kekuatan dan kemudahan pemakaian termasuk
kemudahan instalasi dibandingkan versi sebelumnya. Versi 7 ini sangat cocok bagi
pengguna yang baru pertama kali mengenal Drupal atau bagi yang sudah terbiasa
menggunakan CMS engine selain Drupal semisal WordPress atau Joomla.

Banyak modul-modul yang bermanfaat yang dulunya harus diinstall tersendiri melalui
penambahan modul sekarang sudah bisa digunakan langsung dalam Core Drupal terbaru
ini.

PERSYARATAN SISTEM

 (Drupal 7.12) - Corporate X Premium Theme v2.0

 Web Server
o XAMP (Windows), server root nya difolder C:\xampp\htdocs\
o AppServ (Windows), server root nya difolder C:\Appserv\www\
o MAMP (OSX), server root nya difolder Aplications/MAMP/htdocs/
o WebServer (Linux), server root nya biasnya difolder /home/user/public_html/
 Database
o MySQL, MariaDB, or equivalentSQLite
o PostgreSQL
 Web Browser (IE, Mozzila Firefox, Chrome, Opera, dll)

LANGKAH-LANGKAH INSTALASI
1. Gunakan Web Browser, arahkan ke folder / domain / subdomain di mana folder
Drupral tadi diekstrak/diletakan. Sebagai contoh nama foldernya "corporate", Jika
menggunalan webserver lokal maka secara default ketiklah
"http://localhost/corporate" (tanpa tanda petik 2) dan ketiklah
“http://domain.com/corporate” jika menggunakan jasa hosting.

2. Pilihlah Corporate X v2.1 (Drupal 7.12), di “Select an installation profile” dan klik
“Save & continue”

1
3. Pilih bahasa dihalaman "Choose language" kemudian click "Save and Continue",
secara default tema drupal ini berbasis bahsa Inggris.

4. Setup Infomasi Database dihalaman "Database configuration" dan klik "Save and
Continue".
Catatan: Jika anda belum mempunyai/membuat database, buatlah via
phpMyAdmin atau Aplikasi MySQL yang lainnya. Setalah anda melanjutkan, maka
proses instalasi akan dimulai

2
5. Konfigurasi dasar informasi website anda dihalaman "Configure Site". Isikan semua
pada kolom untuk kebutuhan dasar informasi dari website anda, mulai kolom Site
name * sampai dengan kolom UPDATE NOTIFICATIONS. kemudian "Save and
Continue".

Sekarang anda bisa melihat website yang sudah terinstal seperti gambar dibawah
ini.

3
4
DESAIN LAYOUT & ELEMENT DARI THEME CORPORATE

Region #1: Header

Jump Menu: Main menu
Main menu
Search form

Region #2: Slideshow

Corporate X - Advanced jQuery SlideShow

Region #3: Content

Widgets: addthis-share
Contact Us
Main page content

5
Region #4: Second sidebar
Portfolio Block
Adds Block
Products Categories
Recent comments

Region #5: Footer

Logo Block
Latest News
Footer Menu
Follow Us

6
MENGGANTI LOGO & FAVICON

Hal pertama yang mungkin perlu dilakukan dengan membangun website baru adalah
mengubah/menggati logo dan favicon.

 Logo: untuk ukuran disesuaikan dengan bawaan dari template/theme.

 Favicon: sebuah icon “shortcut” di sebelah URL di address bar browser, dan
ukurannya 16x16 pixel

Silakan menuju ke halaman Administrasi tema website Anda (Corporate Premium Drupal
7 Theme v2.0 ), Admin > Appearance > Settings

Mengganti Logo
 Langkah 1: dibagian “Toggle display”, pastikan checkbox "Logo" dalam kondisi
tercentang (checked)
 Langkah 2: dibagian “Logo image settings”, hilangkan tanda centang (uncheck)
pada checkbox “Use the default logo”.

 Langkah 3: Jika Anda sudah mengunggah (upload) logo ke server, ketikan alamat
path di “Path to custom logo”. Jika belum, klik tombol Choose File (Browse)
temukan logo yang ingin Anda gunakan pada PC Anda, kemudian geser ke bagian
bagian bawah layar dan klik “Save configuration”.

7
 Apakah langsung ada perubahan ? Jika tidak coba lakukan " power refresh" (Ctrl +
F5) untuk menghilangkan cache yang ada di browser.

Mengganti Favicon
 Langkah 1: Dibagian “Shortcut icon settings”, hilangkan tanda centang pada “Use
the default shortcut icon”.
 Langkah 2: Jika Anda sudah mengunggah (upload) icon ke server, ketikan alamat
path di “Path to custom icon”. Jika belum, klik tombol Choose File (Browse)
temukan icon yang ingin Anda gunakan pada PC Anda, kemudian geser ke bagian
bagian bawah layar dan klik “Save configuration”. (files bertipe PNG dan GIF adalah
pilihan yang terbaik, ada beberapa versi browser dari Internet Explorer (IE) yang
tidak mengenali file bertype JPG untuk sebuah shortcut icons.)

Jika tidak terjadi perubahan, lakukan lagi "power refresh" (Ctrl + F5) untuk
menghilangkan cache yang ada di browser.

INFORMASI WEBSITE (DESKRIPSI)

 Langkah 1: Mengganti informasi (tema) dari website Anda. Silahkan menuju KE

menu Admin > Configuration > Site Information
 Langkah 2: selain mengganti nama Website, yang sudah dilakukan pada saat
instalasi, Anda juga dapat menambah slogan, Pilihan lainnya termasuk juga
merubah tampilan halaman depan (front page) & bentuk tampilan halaman jika
terjadi kesalahan.

8
9
MENGELOLA KONTEN
Paga bagian ini menunjukkan bagaimana mengelola konten di Drupal. Biasanya dalam
sebuah website terdapat 2 kategori konten
 Konten Stasis (Statis Page) : biasanya untuk konten yang link tautanya digunakan
kan dihalaman “menu”, seperti halaman Sejarah, Visi & Misi, dll
 Konten Dinamis (Dinamic Page): isi konten dinamis selalu diperbaharui dan
bertambah sesuai keinginan pemilik website atau bahkan pengguna website.

Membuat Konten Baru

 Langkah 1: Gunakan menu bar diatas, klik di menu > Content > Add content

 Langkah 2: Pilih jenis konten (content type) yang dibutuhkan, dalam konteks ini kita
akan membuat konten statis, maka pilih jenis konten “Basic Page”
 Langkah 3: Masukan semua informasi ke dalam konten tersebut, Anda dapat
menggunakan CKEditor untuk penulisannya dengan mengklik pada bagian “Text
format” Pilih Filtered HTML, Full HTML atau Plain text. Klik Save untuk
mengakhiri penulisan konten.

10
Merubah Konten
 Langkah 1: Gunakan menu bar diatas, klik di Admin > Content
 Langkah 2: Pilih konten yang akan diedit, kemudian klik link edit

 Langkah 3: Edit isi informasi konten tersebut sesuai dengan kebutuhan, seperti
Tittle, Teks Body, Tag, Images atau yang lainnya, kemudian klik tombol Save.

Menghapus Konten
 Langkah 1: Gunakan menu bar diatas, klik di Admin > Content
 Langkah 2: Pilih konten yang akan dihapus, kemudian klik link delete

11
MANA JEMEN MENU
Setelah Anda membuat beberapa halaman atau artikel (konten), Anda mungkin ingin
menambahkan link ke dalam menu. Untuk mengelola menu, kita harus menuju ke menu
bar yand ada diatas kemudian klik Structure > Menus

Membuat Menu
 Langkah 1: Menuju ke menu Admin > Structure > Menus, klik di Add menu

 Langkah 2: Silakan isi semua informasi yang diperlukan untuk Menu Baru Anda.
Kemudian, klik Save.

12
  Path: bisa berisikan alamat link internal seperti node/82 atau sejarah atau eksternal
link seperti http://dikti.go.id. Bisa juga dituliskan <front> untuk menuju ke link
halaman depan (front page).
 Menu link title: link teks yang sesuai dengan item ini yang akan muncul di menu.
 Enabled: enable/Aktif atau disable/Tidak Aktif
 Expanded: Jika opsi ini diplih dan jika menu tersebut mempunyai anak menu (menu
Item), akan selalu terbuka saat kursor mengarah ke menu tersebut
 Parent item and weight: Urutan posisi pada menu

Merubah Menu
 Langkah 1: Di halaman jendela menu, klik link Edit Menu disalah satu item menu
yang akan dirubah.

 Langkah 2: Ganti seluruh informasi yang diperlukan, kemudian klik Save.

Menghapus Menu
 Langkah 1: Di halaman jendela menu, klik link Delete disalah satu item menu
yang akan dihapus

13
MENGELOLA BLOCKS
Seperti yang Anda lihat dibagian "DESAIN LAYOUT DAN ELEMENT”, terdapat beberapa
blok seperti " Portfolio Block", " Adds Block", " Products Categories", "Recent comments"
dan seterusnya. Block adalah kotak konten yang dapat ditampilkan dibagian tertentu
(region) seperti header, footer, slideshow atau sidebar pada halaman website Anda.

Merubah Posisi Blocks

Ada beberapa blok yang mungkin menurut anda tidak ingin ditampilkan, atau
ditempatkan pada posisi yang berbeda. Ikuti langkah-langkah cara merubah posisi blok:
 Langkah 1: Dimenu Admin > Structure > Blocks, akan terlihat ada beberapa
blok
 Langkah 2: Pilih salah satu blok yang akan dirubah posisinya kemudian klik
dibagian kotak pilihan (select box) untuk merubah posisi yang dikehendaki.

Jika tidak ingin ditampilkaan dibagian blok manapun, cukup pilih None.
Anda juga bisa dengan menarik dan meletakan (drag & drop) blok tersebut ke
region yang berbeda serta mengurutkan sesuai keinginan.

 Langkah 3: Klik Save sebelum mengakhiri proses perubahan.

Membuat Block HTML Sendiri

Sebagian besar, blok ada dengan sendirinya karena mengaktifkan modul. Misal, modul
“Poll”, akan membuat blok "Most Recent Polls". Anda dapat merubah bentuk, ukuran
dan posisinya, atau hanya tampil pada halaman tertentu saja.
Bagaimana membuat blok sendiri, misal blok “Tentang Saya”. Untuk langkah-
langkahnya ikuti cari berikut:

 Langkah 1: Di menu Admin > Structure > Blocks

 Langkah 2: Klik di “Add Block”

14
 Langkah 3: Silahkan isikan semua informasi yang dibutuhkan untuk block Anda.

 Isikan Block description, Misal Block – Tentang Saya.

 Isikan Title, Misal Tentang Saya
 Di Block Body, Silahkan tuliskan beberapa baris tentang Profil Anda, Misal
Nama, Alamat dll

 Ketika di tekan tombol Save, blok telah tersimpan tapi secara default tidak berada
diposisi (region) manapun. Anda perlu untuk menarik dan meletakan diposisi
tertentu agar bisa tampil di website Anda.

Merubah Block
 Langkah 1: Masuk ke halaman Blocks (Admin > Structure > Blocks)
 Langkah 2: Kemudian pilih salah satu blok yang akan dirubah, klik configure, rubah
sesuai dengan kebutuhan dari blok tersebut

15
 Langkah 3: Tekan tombol Save setelah selasai melakukan perubahan
 Langkah 4: Pengaturan Visibilitas
Jika Anda ingin blok ini muncul pada halaman manapun, Anda tidak perlu
melakukan apa-apa dengan pengaturan ini. Bila Anda ingin blok ini
menunjukkan pada halaman tertentu dan bukan pada halaman lain, silakan
lihat beberapa pengaturan di bawah ini:

 Pages: Anda dapat mengatur blok ini untuk menunjukkan "All pages except
those listed" atau "Only the listed pages". Sebagai contoh, jika Anda ingin blok
slideshow untuk tampil dihalaman depan saja (frontpage), cukup pilih "Only
the listed pages" dan tuliskan <front> ke kotak isian yang berada dibawah.
 Content types: Anda dapat menentukan blok ini tampil sesuai dengan jenis
konten tertentu saja.
 Roles: Anda bisa menampilkan blok hanya untuk user/pengguna tertentu
saja, Misal anonymous, user yang telah registrasi atau administrator.

Menghapus/Disable Blocks
Anda hanya dapat menghapus blok konten yang dibuat oleh Anda saja, dengan
menggunakan metode yang berikut. Blok yang terbuat oleh sebuah Module tidak
dapat dihapus dengan menggunakan metode ini.

Didalam halaman Block (Admin > Structure > Block), blok yang dapat dihapus akan
memiliki link "delete" di samping paling kanan. Mengklik link ini berarti akan
menghapus blok, tapi sebelumnya akan muncul jendela konfirmasi, yang menyatakan
apakah blok ini akan dihapus. klik tombol Delete berarti blok akan terhapus

16
Catatan : Jika Anda hanya ingin sekedar tidak menampilkan blok, sebaiknya pilih None
pada region. Karena Anda suatu saat bisa memerlukan lagi blok tersebut untuk
ditampilkan.

17
SEO - SEARCH ENGINE OPTIMIZATION
Optimisasi Mesin Pencari (SEO), seperti yang kita semua tahu, adalah sangat penting untuk
dunia bisnis karena 90% dari semua lalu lintas online dicapai melalui berbagai Search
Engine. Anda tidak akan menemukan senjata rahasia untuk bisa mencapai pencarian
teratas di Search Engine seperti Google, yang semua kita tahu. SEO adalah topik besar dan
banyak memakai waktu untuk mencapai itu.

Saya berharap untuk menunjukkan beberapa teknik dasar menggunakan Drupal yang
dapat Anda gunakan untuk meningkatkan optimasi situs web Anda secara keseluruhan.
Misalkan Path auto, Page title and Megatag editor.

URL ALIAS

Jika Anda melihat link website seperti http://unit.unsoed.ac.id/node/83 ini, itu adalah
99,99% didukung oleh Drupal. Pola link node / [angka] adalah pola default link konten
Drupal. Namun, jika terlihat seperti http://unit.unsoed,ac,id/sejarah, akan tampak lebih
mudah dibaca pengunjung.
Drupal memiliki fitur yang disebut "URL Alias" yang memungkinkan Anda untuk
memberikan nama yang lebih dimengerti untuk sebuh konten. Mungkin sejauh ini bagi
Browser, Server, dan Mesin Pencari, hal itu tidak diperlukan. Tapi bagi pengunjung website
hampir wajib diperlukan.

Anda dapat mengelola URL Alias langsung dengan mengedit node, add forms atau menuju
ke menu Admin > Configuration > URL Alias

Menseting URL Alias Secara Otomatis

Saya sarankan mendefinisikan terlebih dahulu semua pola URLnya. Memang
menghabiskan beberapa waktu unutk mengatur URL alias sebelum anda membuat
Content type, sehingga anda tidak perlu khawatir lagi jika ada perubahan alias.
Sebagai contoh:

 Konten Berita node mungkin terlihat seperti: /berita/[node-title]

 Galeri node mungkin terlihat seperti: /galeri/[node-title]
 Konten Agenda node mungkin terlihat seperti: /agenda/[node-title]

Untuk melakukannya hal tersbut diatas klik pada tab Pattern.

Sebagai contoh, jika Anda ingin semua posting konten “News” diawali dengan "berita-
terkini" dan termasuk user id dan judul, Anda bisa menggunakan: berita-terkini/[user-
raw]/[title-raw]

18
Anda juga dapat melihat Replacement Patterns dan menentukan bentuk alamat URL
untuk jenis konten yang berbeda.

Menambah/Menghapus/Merubah alises
Anda juga dapat menambahkan URL alias secara manual dengan mengklik link Add
alias. Sebagai catatan, Anda tidak harus menambahkan, menghapus atau mengubah
sekarang. Hal ini hanya sebagai panduan saja.

 Existing system path: Menentukan path yang sudah ada aliasnya. Misal:
node/28, forum/1, taxonomy/term/1+2.
 Path alias: Menentukan path aliasnya yang mana konten ini dapat diakses.
Misal, halaman "Tentang saya" ketika menuliskan URL alias tentang halaman
“Tentang Saya” jangan gunakan path relatih dan jangan menambahkan garis
miring, karena URL alias tidak akan berjalan.

Untuk mengedit atau menghapus URL Alias, silakan klik pada link yang sesuai
diinginkan di sebelah samping URL alias.

19
JUDUL HALAMAN (PAGE TITLE)

Judul halaman adalah wajib untuk dibaca pengunjung dan search engine. Menggunakan
kata kunci yang spesifik dan unik di judul halaman membuat halaman Anda lebih
deskriptif. Search engine juga menggunakan judul halaman sebagai pokok utama untuk
menentukan relevansi dan peringkat. Untuk kedepan, Anda harus memiliki judul halaman
yang unik untuk setiap halaman di website Anda.

Silahkan menuju ke menu Admin > Configuration > Page title. Administrator dapat
mengkonfigurasi bagaimana pola judul setiap halaman harus terstruktur.

Secara default bahwa Judul Halaman adalah: [page-title] | [site-name].

Sebagai contoh : Websitenya bernama "Fakultas Ku", kontennya “Tentang Saya” maka
judul halaman menjadi seperti ini "Tentang saya | Fakultas Ku".

Jiksa sudah, klik pada tombol Save configuration

20
META TAG

Meta tags adalah meta data dari halaman HTML yang menyediakan informasi
tambahan untuk mesin pencari. Tag yang paling penting dalam praktek SEO adalah
description and keywords.

 Description: Apakah halaman pada website Anda itu menggambarkan

“tentang”. Bila Anda mencari melalui Google dan halaman Anda terdaftar pada
hasil pencarian, Google akan menggunakan tag ini sebagai description, seperti
gambar di bawah ini

 Keywords: membantu mesin pencari untuk mengkategorikannya didalam situs

Anda. Anda harus memberikan beberapa kata kunci yang ringkas dan didukung
denga teknik-teknik yang lain untuk meningkatkan peringkat situs Anda.

Konfigurasi Meta Tags

 Langkah 1: Ke Menu Admin > Configuration > Meta tags
 Langkah 2: Di form Meta tags to show on edit, dapat dicek Description dan
Keywords. Jika sudah ahli dalam SEO, bisa diganti dengan paramter yang lain
 Langkah 3: Pada output Meta tags didalam HTML, juga harus diperhatikan
Description dan Keywords.

Menambah Meta tags baru

Anda harus membuat Meta tag untuk halaman depan (front page) bisa dibilang itu
wajib.
 Langkah 1: Klik di Add a meta tag default, kemudian pilih Front page.

21
 Step 2: Tuliskan Description dan Keywords nya.

Meta tags untuk setiap node

Anda juga dapat mengedit meta tag untuk setiap node (artikel blog atau halaman).
Ketika membuat atau mengedit node, silahkan mencari bagian Meta tag dan mengisi
informasi yang diperlukan. Tag yang paling penting lagi harus mengadung description
dan keywords.

22
KONFIGURASI TINGKAT LANJUT

INSTALL/UNINSTALL MODUL

Dalam paket pelatihan ini yang digunakan ini, ada beberapa modul penting yang harus
diinstal, seperti modul pagetitle, metatag, dll. Semua modul itu kontribusinya diambil dari
komunitas Drupal.

Komunitas Drupal.org memiliki lebih dari 10'000 modul yang kontribusi disampaikan oleh
pengembang di seluruh dunia. Jika Anda perlu untuk pembaharuan (update) hampir kapan
saja, Anda dapat menemukan modul yang sesuai dengan kebutuhan Anda di:
http://drupal.org/project/Modules/

Install via admin interface

 Langkah 1: Kunjungi situs Drupal.org dan cari modul yang anda inginkan. Sebagai
contoh mari kita install module Page Title, tersedia di
https://www.drupal.org/project/page_title. Modul ini menunjang kita untuk
meningkatkan ranting website anda (SEO).

Sebaiknya Anda :
 Copy link download dari vesi yang anda inginkan seperti,
http://ftp.drupal.org/files/projects/page_title-7.x-2.x-dev.tar.gz
 Atau bisa di download archive module tersebut

 Langkah 2: Menuju ke menu Admin > Modules dan kemudian klik Install new
module

23
 Langkah 3: Masukkan link file archive tersebut dan klik Install. Jika tidak
bekerja, silakan gunakan metode kedua: meng-upload file archive yang telah
didownload, kemudian klik Install.

Kadang-kadang, kedua metode tersebut tidak bekerja karena permission file.

Kemudian Anda harus meng-upload folder modul tersebut secara manual
menggunkan aplikasi FTP, seperti FileZilla Client, WinSCP ke folder /sites/all/
modules.

 Langkah 4: Sekarang modul sudah terinstal, tetapi belum diaktifkan. Anda ke menu
Admin > Modules untuk mengaktifkannya dengan mencentang pada modul tersbut
dan kemudian “Save Configuration".

24
  Langkah 5: Sekarang Anda dapat menggunakan module tersebut. Klik di menu
Admin > Configuration > Page Titles

Uninstall Module Drupal

Ketika module tertentu tidak lagi dibutuhkan Anda dapat menghapus/uninstall modul
tersebut

 Langkah 1: Disable module

Ke menu Admin > Modules kemudian hilangkan tanda centang (uncheck) pada
modul yang akan di non aktifkan/disable, kemudian klik Save Configuration.
 Langkah 2: Uninstall module
Di Langkah 1, module di non aktifkan, tapi masih terpasang di website. Suatu saat
dapat diaktfkan (enable) jika diperlukan. Tapi juga sepenuhnya dapat di hapus
(uninstall), Silahkan menuju menu Admin > Modules dan klik pada tab “Uninstall”.
Kemudian pilih modul yang akan dihapus dan klik “Uninstall”.

PENGENALAN VIEW

View merupakan jantung dari menampilkan konten di Drupal. Anda memiliki konten Anda
sendiri seperti posting berita, galeri, pengumuman dan sebagainya. Sekarang Anda ingin
menampilkan posting-posting tersebut, dan dalam kondisi tersortir berdasarkan abjad
atau tanggal posting.

View adalah salah tool yang paling kuat di Drupal, tetapi sedikit tidak tidak menyenangkan
dalam membuat dan pengelolaannya. Dalam tutorial ini, kita akan bagaimana membuat
halaman download, yaitu, daftar entri untuk download files.

Anatomy sebuah halaman blog

1. Berita Terkini : adalalah blog artikel dalam format singkat. Disetiap format pendek
terdapat Judul, Tanggal Posting, Gambar dan biasanya ada teks link Baca
Selanjutnya (Read More..)
2. Berita Terkini Detail : adalah blog artikel dalam bentuk yang lenkap, yang mana
terdapat Judul, Tanggal Posting, Gambar, Intro Teks, Body Teks, Tags dan bianya
terdapat Form Komentar.

25
Pertama, membuat Image Presets
Image Preset adalah standar ukuran untuk gambar/image. Karena gambar yang akan
kita upload mempunyai ukuran yang berbeda, jadi jika tidak membuat ukuran yang
sesuai penempatannya, akan ditampilkan dalam ukuran file yang asalinya dan halaman
blog tersebut akan terlihat berantakan. Ketika Image Preset dibuat, upload image akan
diubah ukurannya sesuai yang kita kehendaki.

 Langkah 1: Ke menu Admin > Configuration > Image Styles

(admin/config/media/image-styles), dan pilih Add style

 Langkah 2: Tuliskan berita-terkini-list

 Langkah 3: Selanjutnya, tentukan jenis effect nya

26
 Ada 3 macam effects utama: Scale, Resize dan Crop. Dengan penjelasan sebagi
berikut :
Effects Keterangan
Scaled to 50% Dengan rasio yang masih sama
Resized to 60x20 Ukuran yang tepat, bahkan jika distoring gambar
Cropped to 50%x50% Menampilkan hanya bagian dari gambar

Di sini kita ingin menjaga rasio gambar yang masih sama untuk blog Berita Terkini
jadi kita akan menambahkan efek Scale.

 Langkah 4: Isikan 200 untuk width nya.

Cukup memasukan width nya saja, sehingga semua gambar yang diunggah untuk
halaman Berita Terkini dengan skala lebarnya 200px. Tingginya akan berubah
secara proporsional.

Anda juga dapat mencentang pada pilihan "Allow Upscaling". Opsi ini akan
mengubah ukuran gambar yang lebarnya kurang dari 200px. Hasilnya gambar akan
blur akan tetapi akan tetap rapi.

 Langkah 5: Klik di Add effect, akan kembali ke jendela main style dan klik Update
style.

Kita telah membuat image style untuk “berita-terkini-list”. Ikuti langkah-langkah di

atas untuk membuat yang kedua yaitu "berita-terkini-details". Ini untuk halaman
saat tampil secara detail. Ukuran width nya bisa lebih lebar dari yang sebelumnya,
misal : 300px atau 400px, itu terserah Anda.

Kedua, membuat atau merubah konten tipe “Article”

Secara default pada saat kita selesai melakukan proses instalasi, drupal membentuk
konten tipe (content type). Coba kita cek apakah sudah sesuai dengan yang kita
butuhkan:

 Langkah 1: Ke menu Admin > Structure > Content types (admin/structure/types).

 Langkah 2: Kita lihat semua jenis konten tipe yang ada didalam website. Silahkan
klik “manage fields” di konten tipe “Article”.

27
 Langkah 3: Tambahkan fields “Introtext”, dengan type: “Long text” dan subtype:
“Text area (multiple rows)”, dan klik Save, seperti gambar dibawah ini

 Langkah 4: Di sini kita melihat bahwa untuk fomat image style yang tersedia adalah
secara default. Tapi jika tidak ada, Anda dapat mengulangi langkah ini untuk
membuat image style.
 Langkah 5: Sekarang kita perlu menambahkan image style "berita-terkini-details"
yang telah kita buat untuk jenis konten “Article”. Jadi, ketika Anda melihat sebuah
node artikel, image akan ditampilkan pada ukuran yang telah ditetapkan. Silakan
klik pada tab "Manage Display".

28
 Harap memperhatikan dua ikon kecil bertuliskan "Teaser" dan "Default".
 Teaser: format singkat dari sebuah node konten
 Default: format full dari sebuah konten

 Langkah 6: Sekarang kita berada di tab Default, klik di icon bergambarkan roda
dibagian sebelah kanan image. Akan terlihat seperti gambar dibawah ini.

Kemudian pilih Image style “berita-terkini-details” and Link image “Nothing”.

Kemudian klik Update. Akan kembali ke jendela utama Manage Display dan klik
Save

 Langkah 7: Silahkan ke tab Teaser, dan klik “berita-terkini-list” untuk image style
nya. Untuk link image pilih “Content”. Klik Update dan Save.

29
Ketiga, membuat view
Sekarang kita akan membuat view untuk menampilkan semua node dari konten tipe
“Article”

 Langkah 1: Ke menu Admin > Structure > Views dan pilih Add a new view

 Langkah 2: Masukan informasi berikut :

30
  Nama View: Berita Terkini
 Show: Konten Tipe “Article”, diurutkan berdasarkan “Newest first”
 Berita tanda centang pada Create a page
 Page title: Berita Terkini
 Path: / berita-terkini
 Display format: Unformatte dengan list “Teaser” dan link tanpa “Comments”.
 Item to display: 10 (atau 5, sesuai kebutuhan)
 Berita tanda centang pada “Use a pager” jadi jika Anda memiliki lebih dari 10
posting artikel, akan ada pager di akhir halaman sehingga Anda dapat
menelusuri posting artikel yang lama.

Klik Save dan Exit

 Langkah 3: Suatu saat anda bisa merubah view tersebut dengan pengaturan yang
lain dengan cara ke menu Admin > Structure > Views dan klik tombol Edit.

31