Pengenalan HTML, CSS,

dan Javascript
 Modifikasi Tampilan
Dan Fungsi Aplikasi Yii

irsan riza

Published: Februari 2013

Daftar Isi
Daftar Isi .................................................................................................................................... 4
Modifikasi Tampilan .................................................................................................................. 5
Penggunaan 2 Bahasa ................................................................................................................ 7
RSS Subscriber .......................................................................................................................... 8
ARC di Website ......................................................................................................................... 9
Menggunakan Tabel Dinamis .................................................................................................. 11
Menggunakan Flexpaper sebagai E-Publikasi ......................................................................... 11
Menggunakan StatPlanet sebagai WebGIS ............................................................................. 13
Authentikasi User..................................................................................................................... 14
Modifikasi Aksesibilitas dari Controller .................................................................................. 16
Konfigurasi Aplikasi ................................................................................................................ 17
Daftar Pustaka .......................................................................................................................... 19
Modifikasi Tampilan
20 Februari 2013
11:00

Tampilan pada Yii Framework dapat dengan mudah diganti dengan menggunakan theme. Pilihan
theme banyak tersedia di internet secara gratis. Namun hati-hati pada saat memilih theme dari
internet yang bukan merupakan situs resmi yang berdampingan dengan Yii itu sendiri.

Pada latihan ini kita menggunakan theme hasil modifikasi dari framework lain yaitu "HTML KickStart"
keluaran 99Lime. Framework ini lebih fokus pada tampilan website yang "bersih" menggunakan
HTML5, CSS3, dan Jquery. Berbeda dengan Yii Framework yang lebih fokus ke alur pemrograman
php yang lebih kompleks. Pada dasarnya HTML KickStart ini bukanlah theme untuk Yii, namun
setelah dilakukan sedikit konfigurasi pada headernya dan pengaturan struktur filenya, maka
framework ini bisa digunakan sebagai theme Yii berikut dengan fungsi tampilannya yang "kaya"
variasi.

Konsekuensinya adalah bila kita ingin mengganti theme-nya di kemudian hari, bisa jadi kita akan
kehilangan beberapa fungsi yang didukung oleh HTML KickStart, seperti MenuBar, breadcrumb, tab
dan slideshow yang cukup menggunakan tag <ul> dan <li>, pengaturan jumlah dan lebar kolom
halaman hanya dengan tag <div>, button style dan button bar yang beragam, juga icon yang bisa kita
tempatkan dimana saja. Dan kita harus mengganti masing-masing fungsi tersebut dengan mencari
extension lain yang spesifik. Dan mungkin saja input yang dibutuhkan oleh extension ini berbeda
dengan yang digunakan HTML Kickstart, sehingga kita harus memodifikasi sedikit variabel output
dari model ataupun controllernya. Tapi tenang saja, extension yang tersedia di situs resmi Yii juga
cukup lengkap dan beragam sesuai dengan kebutuhan standar website yang kita inginkan.

Walaupun kita sudah menggunakan suatu thema tertentu untuk mengubah kerangka tampilan
secara total, kita masih dapat melakukan sedikit perubahan di sana sini agar tampilannya benar-
benar sesuai dengan yang kita harapkan. Untuk mengubah atau memodifikasi theme tersebut dapat
kita lakukan dengan cara membuka dan memodifikasi file css dari template theme tersebut. Lokasi
dan penempatan file css masing-masing theme bisa jadi berbeda, namun biasanya tidak akan terlalu
jauh berbeda. Berikut beberapa modifikasi css yang mungkin menarik untuk dibahas, pada file
"/themes/kick/css/style.css" kita memiliki kode sebagai berikut:

#header{
background: url(../images/logo.jpg) no-repeat center top;
height: 188px;
}

Kode diatas dapat kita ganti url-nya menjadi file untuk header website. Kemudian kita juga bisa
mengedit kode berikut:
body{
margin:0;
padding:0;
color:#000;

background: #FFFFFF url(../images/bg.jpg) repeat-x fixed;

font:normal 0.9em/150% 'Arimo', "Trebuchet MS", arial, verdana,
sans-serif;
text-shadow: 0px 0px 1px transparent; /* google font pixelation fix
*/
}

Pada kode diatas kita bisa mengganti gambar latar untuk halaman web kita, yang pada contoh diatas
hanya menggunakan file dengan gradasi warna saja. Atribut repeat-x digunakan untuk membuat
gambar latar akan ditampilkan berulang secara horizontal.

Untuk mengubah warna tampilan menu, kita akan mengedit file "/themes/kick/css/kickstart-
menus.css" sebagai berikut:

.menu{
border:1px solid #ccc;
background: #eee; /* Old browsers */
background: -moz-linear-gradient(top, rgba(100,175,0,1) 10%,
rgba(75,125,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-
stop(10%,rgba(100,175,0,1)), color-stop(100%,rgba(75,125,0,1))); /*
Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(100,175,0,1)
10%,rgba(75,125,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(100,175,0,1)
10%,rgba(75,125,0,1) 100%); /* Opera11.10+ */
background: linear-gradient(top, rgba(100,175,0,1)
10%,rgba(75,125,0,1) 100%); /* W3C */
z-index:600;
}

Pada kode di atas, terdapat beberapa baris perintah untuk mengubah warna background menu
untuk beberapa jenis web browser. Yang kita ganti adalah bagian rgba yang menggunakan
penomoran untuk 3 warna inti (red green blue). Selain warna background menu, mungkin kita juga
ingin menyesuaikan warna background submenu-nya. Kode yang harus kita ganti adalah:

/* sub menus */
.menu ul{
background: #efefef;
border:1px solid #ccc;
}
Bila kita mengganti warna background dari menu dan submenu, tentunya kita juga harus
menyesuaikan warna tulisannya pada baris perintah berikut:

.menu li a{
text-shadow:0px 1px 1px #fff;
padding:15px 20px;
text-decoration:none;
font-size:0.9em;
color: #000;
}

Penggunaan 2 Bahasa
20 Februari 2013
12:06

Agar website yang kita bangun support untuk 2 bahasa (indonesia-english), maka kita melakukannya
dengan 2 tahapan, yaitu pada level content database yang secara eksplisit kita tuliskan kedalam 2
field yang berbeda. Kita menyediakan field untuk isian bahasa indonesia, dan isian field dalam
bahasa inggris. Kemudian kita juga membuat file tambahan untuk membantu konten yang tidak
berasal dari database, misalnya untuk judul tab pada subjek statistik, dan pesan kesalahan atau
warning yang ditampilkan. Kita membuat 2 file, yaitu 1 untuk variabel konten dalam bahasa inggris,
dan 1 file lagi untuk variabel konten dalam bahasa indonesia. Untuk level database dan level file ini
nantinya akan dipilih sesuai dengan session bahasa yang dipilih user. Secara default bahasa yang
ditampilkan adalah bahasa indonesia, namun bila user berkehendak lain, maka pengaturan bahasa
bisa diganti dengan mudah.

Untuk mendefinisikan session pada Yii kita menggunakan perintah:

Yii::app()->session['nama_variabel_session'] = 'nilai_session';

Nantinya nilai dari session bahasa ini akan kita render sebagai variabel $lang yang akan digunakan
setiap kita memanggil fungsi yang berkaitan dengan konten di database yang memiliki rincian dua
bahasa. Misalnya seperti pada perintah berikut:

$menuH = Menu::model()->RetrieveMenu("1", $lang);

Dan juga pada fungsi berikut:

public function RetrieveMenu($kategori='1', $lang='idn')

{
$sql = "select id, menu_$lang as menu, aksi, alt_$lang as alt,
id_parent, have_child from menu where id_menu_kategori=$kategori
and flag=1 order by id asc";
hasil=Yii::app()->db->createCommand($sql)->queryall();
return $hasil;
}
Variabel $lang ini juga nantinya akan digunakan untuk memilih file mana yang akan diload untuk
mengisi variabel dari konten yang tidak berkaitan dengan database. Seperti pada perintah:

Include ("./bahasa/" . $lang . ".php");

RSS Subscriber
20 Februari 2013
10:59

RSS adalah sebuah file berformat XML untuk sindikasi yang telah digunakan (di antaranya dan
kebanyakan) situs web berita dan weblog. Singkatan ini biasanya mengarah ke beberapa
 Rich Site Summary (RSS 0.91)
 RDF Site Summary (RSS 0.9 and 1.0)
 Really Simple Syndication (RSS 2.0)
Teknologi yang dibangun dengan RSS mengizinkan kita untuk berlangganan kepada situs web yang
menyediakan umpan web (feed) RSS, biasanya situs web yang isinya selalu diganti secara reguler.
Untuk memanfaatkan teknologi ini kita membutuhkan layanan pengumpul. Pengumpul bisa
dibayangkan sebagai kotak surat pribadi. Kita kemudian dapat mendaftar ke situs yang ingin kita
tahu perubahannya. Namun, berbeda dengan langganan koran atau majalah, untuk berlangganan
RSS tidak diperlukan biaya, gratis. Tapi, kita biasanya hanya mendapatkan satu baris atau sebuah
pengantar dari isi situs berikut alamat terkait untuk membaca isi lengkap artikelnya.

Pada Yii framework kita bisa menggunakan extension untuk membuat rss subcriber, namun
konfigurasinya tetap harus kita lakukan manual untuk tabel database yang ingin kita jadikan acuan
sebagai feedernya. Kita bahkan bisa membuat sendiri rss subscriber dengan format yang cukup
sederhana. Nantinya kita akan mengeluarkan output file yang terbaca sebagai xml dengan konten
menyerupai sebagai berikut:

<?xml version="1.0" ?>

<rss version="2.0">
<channel>

<title>BPSKabpaten Pringsewu</title>
<link>http://pringsewukab.bps.go.id</link>
<description>Informasi terkini dari situs BPS Kabupaten
Pringsewu</description>
<language>en</language>
<copyright>pringsewukab.bps.go.id</copyright>

<item>
<title>$title</title>
<description>$description</description>
<pubDate>$pubdate</pubDate>
<link>$link</link>
</item>

</channel>
</rss>
Untuk mendapatkan output seperti diatas dengan konten dari database, maka kita memerlukan
proses php yang berarti kita akan menggunakan file dengan ekstensi *.php. Namun kita bisa
mengubah header file php ini agar nantinya bisa dibaca sebagai file xml dengan perintah sebagai
berikut:

Header("Content-Type: text/xml");

Kita menginginkan rss subscriber ini bersifat mandiri dan tidak terkait dengan template dan segala
macam tampilan lain selain rss untuk meningkatkan performanya. Karena itu kita memerlukan
koneksi databasenya dipanggil melalui file tunggal pada rss ini yaitu dengan perintah:

require_once('path/to/yii.php');
Yii::createWebApplication('path/to/config/main.php');

Selanjutnya kita bisa menggunakan perintah query pada Yii seperti biasa.

ARC di Website
20 Februari 2013
12:24

Kita akan menyusun ARC tahunan dengan memasukkan rincian masing-masing publikasinya ke
dalam database pada tabel arc. Pada modelnya, kita memerlukan fungsi berikut:

public function RetrieveArc($tahun, $lang='idn')

{
$sql = "select id, judul_$lang as judul, periode, bahasa,
terbit, status, publikasi from arc where tahun$tahun and flag=1
order by id asc";
$hasil=Yii::app()->db->createCommand($sql)->queryall();
return $hasil;
}

Bagian controller akan memanggil model ini dan menjalankan fungsi tersebut kemudian hasilnya di-
render ke view arc "tampil.php" dengan kode sebagai berikut:

public function actionTampil($tahun='0', $lang='idn')

{
if ($tahun=='0') $tahun=date(Y);
$modelarc=new Arc;
$arc = $modelarc->RetrieveArc($tahun, $lang);
$this->render('tampil',array('arc'=>$arc, 'tahun'=>$tahun));
}
Selanjutnya tinggal menggunakan view untuk menampilan tabel arc yang dirender dari controller,
yang kurang lebih kode utamanya adalah sebagai berikut:

<table class="sortable" cellpadding="0" cellspacing="0">

<thead><tr class="alt first last">
<th rel="0">No.<span class="arrow"></span></th>
<th rel="1">Judul</th>
<th rel="2">Periode</th>
<th rel="3">Bahasa</th>
<th rel="4">Terbit</th>
<th rel="5">Status</th>
</tr></thead>
<tbody>
<?php
foreach ($arc as $row) {
$terbit = explode("-", $row["terbit"]);
$tanggal = $terbit["2"];
$tahun = $terbit["0"];
switch ($terbit["1"]) {
case "01":
$bulan = "Januari";
break;
.
.
.
case "12":
$bulan = "Desember";
break;
}

?>
<tr>
<td value="<?php echo $i; ?>"><?php echo $i; ?></td>
<td value="<?php echo $row["judul"]; ?>"><?php echo $row["judul"];
?></td>
<td value="<?php echo $row["periode"]; ?>"><?php echo
$row["periode"]; ?></td>
<td value="<?php echo $row["bahasa"]; ?>"><?php echo $row["bahasa"];
?></td>
<td value="<?php echo $row["terbit"]; ?>"><?php echo $tanggal , " "
, $bulan, " ", $tahun; ?></td>
<td value="<?php echo $row["status"]; ?>"><?php echo $row["status"];
?></td>
</tr>
<?php
}
?>
</tbody>
</table>
Menggunakan Tabel Dinamis
20 Februari 2013
12:56

Untuk tabel statistik, kita mungkin masih akan menggunakan artikel biasa untuk menampilkan tabel
dalam format image ataupun kode html. Dan tinggal membuat linknya ke artikel yang bersankutan
dari daftar tabel masing-masing subjek. Kita juga bisa membuat tabel dinamis menggunakan cara
yang sama seperti yang pernah kita lakukan sebelumnya pada saat menggunakan cms, yaitu degan
menggunakan file tersendiri untuk mengambil dan menampilkan tabel dari database. Jadi kita hanya
perlu memindahkan folder tersebut ke lokasi yang bisa diakses oleh webserver dan berada diluar
dari folder protected. Lalu akan kita panggil dengan menggunakan iframe dari salah satu view yang
kita inginkan. Namun jangan lupa untu menambahkan tabel yang bersangkutan pada database
beserta dengan konten isiannya. Untuk rincian menggunakan fungsi tabel dinamis ini bisa dilihat
pada materi yang terdahulu dengan menggunakan cms.

Menggunakan Flexpaper sebagai E-

Publikasi
20 Februari 2013
12:21

Untuk menampilkan e-publikasi (publikasi elektronik) kita tidak perlu bersusah payah, karena
sekerang kita bisa menggunakan flipbook yang lisensinya telah dibeli oleh BPS untuk penggunaan di
level provinsi, ataupun ita bisa menggunakan flexpaper yang memiliki keunggulan dari sisi lisensi
(free) dan juga keringanannya. Kita cukup mengkonversi file publikasi pdf menjadi file swf yang
nantinya akan ditayangkan sebagai buku elektronik. Kita akan mencoba membuat publikasi ini
dengan menggunakan aplikasi pdf2swf. Jalankan aplikasi pdf2swf lalu buka publikasi yang diinginkan,
klik edit>option, pada tab viewer pilih "no viewer".
Selanjutnya pada menu file>save hilangkan tanda centang pada pilihan "one page per file", lalu klik
save. Output dari aplikasi ini adalah 1 file dengan ekstensi "*.swf". Selanjutnya kita tinggal membuka
folder publikasi yang berada di luar folder protected yang merupakan fungsi flexpaper untuk
menampilkan publikasi format swf tadi. Kita asumsikan fileswf tadi sudah dipindahkan ke dalam
folder "publikasi/buku/". Selanjutnya kita tinggal membuat file html baru misalnya "dda2012.html"
yang isinya sebagai berikut:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en"
xml:lang="en">
<head>
<title>Statda Kabupaten Pringsewu 2012</title>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<style type="text/css" media="screen">
html, body { height:100%; }
body { margin:0; padding:0; overflow:auto; }
#flashContent { display:none; }
</style>

<script type="text/javascript"
src="js/flexpaper_flash.js"></script>
</head>
<body>
<div style="position:absolute;left:10px;top:10px;">
<a id="viewerPlaceHolder"
style="width:980px;height:680px;display:block"></a>
 <script type="text/javascript">
var fp = new FlexPaperViewer(
'FlexPaperViewer',
'viewerPlaceHolder', { config : {
SwfFile : escape('buku/STATDA PSW11AWAL.swf'),
Scale : 0.6,
ZoomTransition : 'easeOut',
ZoomTime : 0.5,
ZoomInterval : 0.2,
FitPageOnLoad : true,
FitWidthOnLoad : false,
FullScreenAsMaxWindow : false,
ProgressiveLoading : false,
MinZoomSize : 0.2,
MaxZoomSize : 5,
SearchMatchAll : false,
InitViewMode : 'Portrait',
PrintPaperAsBitmap : false,

ViewModeToolsVisible : true,
ZoomToolsVisible : true,
NavToolsVisible : true,
CursorToolsVisible : true,
SearchToolsVisible : true,
localeChain: 'en_US'
}});
</script>
</body>
</html>

Dari kode di atas, kita hanya perlu menyesuaikan title dan lokasi/nama file swfnya. Setelah itu kita
tinggal membuat link ke halaman html ini untuk menampilkan publikasi elektroniknya.

Menggunakan StatPlanet sebagai

WebGIS
20 Februari 2013
10:58

Seperti pada website yang pernah kita buat sebelumnya, kita bisa mengaplikasikan WebGIS dengan
menggunakan StatPlanet yang sudah dilisensikan untuk situs dengan domain "go.id" termasuk situs
BPS. Untuk merancang aplikasi StatPlanet tidak akan saya bahas disini karena sudah pernah kita
bahas pada materi terdahulu. Namun kita akan sedikit mengulas mengenai cara penggunaannya
saja. Untuk menggunakannya, kita hanya perlu menempatkan folder StatPlanet ini di lokasi yang bisa
diakses oleh web server, dan di luar folder "protected".
Setelah itu kita akan membuat satu file view baru untuk menampilkan halaman dengan konten
WebGIS ini, lalu mengatur otentikasinya melalui controller.

Misalnya kita akan membuat file view "gis.php" di folder "protected/view/site/". Kita hanya perlu
menuliskan kode sebagai berikut:
<embed
name="StatPlanet"
src="http://pringsewukab.bps.go.id/gis/content.swf"
base="http://pringsewukab.bps.go.id/gis/"
quality="high"
bgcolor="#FFFFFF"
width="100%"
height="450"
wmode="transparent"
align="top"
allowfullscreen="true"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed>

Dari kode diatas kita hanya perlu mengganti rincian src dan base-nya saja. Dan untuk controllernya
dapat kita tambahkan fungsi sebagai berikut pada file sitecontroller:

public function actionGis()

{
$this->render('gis');
}

Lalu kita tinggal membuat link dari menu ke http://pringsewukab.bps.go.id/?r=site/gis

Authentikasi User
20 Februari 2013
9:36

Secara default, username dan password pada Yii diset secara statis hanya untuk dua user, yaitu
admin dan demo. Pengaturan ini bisa kita lihat pada "/protected/component/UserIdentity.php"
pada fungsi berikut:

public function authenticate()

{
$users=array(
// username => password
'demo'=>'demo',
'admin'=>'admin',
);
if(!isset($users[$this->username]))
$this->errorCode=self::ERROR_USERNAME_INVALID;
else if($users[$this->username]!==$this->password)
$this->errorCode=self::ERROR_PASSWORD_INVALID;
else
$this->errorCode=self::ERROR_NONE;
return !$this->errorCode;
}
Fungsi diatas dapat kita modifikasi sesuai dengan kebutuhan, termasuk bila kita ingin melakukan
login pada akun yang terdaftar pada database. Ini adalah contoh hasil modifikasi dari keseluruhan
file tersebut:

class UserIdentity extends CUserIdentity

{
private $_id;

public function authenticate()

{
$record=x_user::model()-
>findByAttributes(array('x_username'=>$this->username));

if($record===null)
{
$this->_id='user Null';
$this->errorCode=self::ERROR_USERNAME_INVALID;
}
else if($record->x_password!==$this->password)
{
$this->_id=$this->username;
$this->errorCode=self::ERROR_PASSWORD_INVALID;
}
else if($record['flag']!=='1')
{
$err = "You have been Inactive by Admin.";
$this->errorCode = $err;
}
else
{
$this->_id=$record['x_username'];
$this->setState('title', $record['nama']);
$this->errorCode=self::ERROR_NONE;
}

return !$this->errorCode;

public function getId()

{
return $this->_id;
}

Dengan perintah tersebut kita mengganti pemeriksaan username dan password dari database
dengan tabel "x-user" yang memiliki field "x_username", dan "x_password", juga pengenal field
"nama".
Modifikasi Aksesibilitas dari Controller
20 Februari 2013
8:27

Bila kita membuka salah satu file controller yang ada, maka kita akan menemukan baris akses rule
sebagai berikut (misal pada sitecontroller):

public function accessRules()

{
return array(
array('allow',
'actions'=>array('halaman'),
'users'=>array('*'),
),
array('allow', // allow all users to perform 'index' and
'view' actions
'actions'=>array('index','view'),
'users'=>array('*'),
),
array('allow', // allow authenticated user to perform
'create' and 'update' actions
'actions'=>array('create','update'),
'users'=>array('@'),
),
array('allow', // allow admin user to perform 'admin' and
'delete' actions
'actions'=>array('admin','delete'),
'users'=>array('admin'),
),
array('deny', // deny all users
'users'=>array('*'),
),
);
}

Disana kita bisa melihat ada beberapa baris untuk action dan users. Perintah ini untuk
mendefinisikan siapa berhak membuka halaman apa. Kita bisa menambahkan baris pengaturan
baru, dengan juga menambahkan fungsi action baru untuk halaman tersebut, kurang lebih sebagai
berikut (masih pada sitecontroller):

public function actionhalaman()

{
$model = "hai";
$teks = "halo dunia";
$this->render('halaman',array('model'=>$model,'teks'=>$teks));
}

Dengan menambahkan fungsi diatas, maka siapapun bisa mengakses

http://alamat_aplikasi/?r=view/halaman
Konfigurasi Aplikasi
20 Februari 2013
7:40

Perlu kita ketahui bahwa untuk alasan keamanan, maka fasilitas Gii (autogenerate CRUD) pada Yii
secara default hanya dapat dilakukan melalui komputer lokal. Hal ini terlihat dari file konfigurasi
utama di "/protected/config/main.php". Pada file ini dapat kita lihat bahwa module Gii hanya
dibatasi hanya untuk IP Address 127.0.0.1 dimana alamat ini adalah alias untuk localhost. Bila kita
mengakses aplikasi ini dari komputer lain, maka module ini tidak bisa diaktifkan, seperti dibawah ini:

'modules'=>array(
// uncomment the following to enable the Gii tool

'gii'=>array(
'class'=>'system.gii.GiiModule',
'password'=>'password',
// If removed, Gii defaults to localhost only. Edit
carefully to taste.
'ipFilters'=>array('127.0.0.1','::1'),
),

),

Kita memang bisa mengganti variabel "IpFilters" diatas bila kita ingin menjalankan fungsi Gii pada
aplikasi yang sudah diupload ke server. Namun hal ini bisa mengakibatkan celah keamanan yang
cukup serius, karena itu perlu perhatian ekstra bila kita ingin menggantinya. Bila memang perlu
diganti, usahakan hanya untuk sementara, ganti password defaultnya, dan segera dikembalikan ke
posisi semula.

Ada beberapa hal lain yang bisa kita konfigurasikan melalui file ini antara lain nama aplikasi yang
akan muncul sebegai title dari halaman web:

'name'=>'BPS Kabupaten Pringsewu',

Tulisan 'BPS Kabupaten Pringsewu' bisa kita ganti sesuai dengan title yang ingin kita tampilkan pada
header website. Lalu kita juga bisa mengganti theme sesuai dengan yang kita inginkan. Theme ini
bisa kita cari di situs resmi Yii untuk memperkecil kemungkinan kita mendapatkan theme yang
mengandung trojan, atau jika kita cukup nekat untuk membuat sendiri :) Pada latihan kali ini kita
asumsikan menggunakan theme 'kick' yang dimodifikasi dari HTML Kickstart framework

'theme'=>'kick',

Sebelum mengupload aplikasi ini, konfigurasi databasenya juga perlu kita ganti agar sesuai dengan
kondisi server. Untuk server BPS, kita memerlukan akun database Postgre baru. Bila kita sudah
memiliki akun databasenya, maka kita bisa mengganti rincian berikut dengan akun yang kita miliki:
'db'=>array(
'connectionString' =>
'pgsql:host=localhost;port=5432;dbname=pringsewukabdb',
'emulatePrepare' => true,
'username' => 'postgres',
'password' => 'password',
'charset' => 'utf8',
),

Adapun yang harus kita ganti adalah "host=nama host database", "dbname=nama database",
"'username'=>'akun database postgre'", "'password'=>'password akun database postgre'".

Bila beberapa rincian diatas sudah kita sesuaikan, maka kita siap mengupload aplikasi web kita ke
server. Perlu juga diingat struktur file/folder di localhost yang harus kita samakan dengan struktur
file/folder di server. Yaitu biasanya kita membuat aplikasi dengan folder aplikasi di bawah folder
"htdocs" dan folder installer Yii juga dibawah "htdocs" sejajar dengan folder aplikasi. Bila asumsi
tersebut terpenuhi, maka kita akan mengupload semua file/folder dari dalam folder aplikasi lokal
(C:/xampp/htdocs/pringsewukab.bps.go.id/) ke bawah folder htdocs di server
(/pringsewukab.bos.go.id/htdocs/). Lalu kita juga harus mengupload folder Yii dari htdocs lokal
(C:/xampp/htdocs/) ke folder yang sejajar dengan htdocs di server (/pringsewukab.bps.go.id/).
Daftar Pustaka
20 Februari 2013
11:51

http://id.wikipedia.org/wiki/RSS

http://www.yiiframework.com/forum/index.php/topic/20832-solveduser-login-with-db/

http://stackoverflow.com/questions/13541565/yii-session-management

http://www.yiiframework.com/doc/guide/

http://www.larryullman.com/series/learning-the-yii-framework/

http://www.99lime.com/elements/
Modifikasi Tampilan dan Fungsi Aplikasi Yii
Yii merupakan framework yang cukup populer belakangan ini karena kemudahan dalam
implementasi dan dari sisi keamanannya. Konsep MVC yang ditawarkanpun memiliki nilai lebih
untuk membangun website dengan pengorganisasian yang lebih rapi dan terstruktur. Ada banyak
sekali pilihan extension dan componen yang bisa kita gunakan untuk meningkatkan fungsi dan
fasilitas yang kita butuhkan. Selain itu modifikasi tampilannyapun terbilang tidak terlalu sulit.

Pada bahasan kali ini kita akan mencoba mengulas sedikit mengenai penggunaan theme untuk
mengubah tampilan secara total, dan juga mengenai peleburannya dengan framework HTML
Kickstart yang terkenal dengan tampilannya yang menggunakan HTML5, CSS3, Jquery dan library
lainnya yang sangat membantu dalam membangun tampilan website yang dinamis. Selain itu kita
juga akan sedikit mengulas mengenai penambahan beberapa fungsi pada aplikasi Yii yang kita
bangun.

Adapun materi yang dicakup dalam buku ini adalah sebagai berikut:
 Theming
 Modifikasi pada theme KickStart
 Penggunaan 2 bahasa
 RSS Subscriber
 Tabel dinamis
 Publikasi Elektronik
 WebGIS
 Authentikasi user