Ojie: tutorial

Instalasi Joomla

Sebelum melakukan instalasi Anda perlu melengkapi beberapa aplikasi yang akan digunakan supaya Joomla dapat dioperasikan di komputer Anda. Ini adalah daftar aplikasi dan persiapan yang harus dilakukan sebelum melakukan instalasi Joomla.

* Joomla 1.5.0, dapat di-download di http://www.joomla.org
* Apache Server, PHP, MySQL, dan phpMyAdmin, untuk memudahkan instalasi ini Anda menggunakan aplikasi XAMPP untuk windows yang tersedia dan dapat di-download di http://www.apachefriends.org. Anda hanya cukup mengikuti instruksi instalasi saja. Dengan melakukan instalasi XAMPP komputer anda akan otomatis diinstal Apache Server, PHP, MySQL, dan phpMyAdmin.

Instalasi Joomla

Sebelum melakukan instalasi Anda perlu melengkapi beberapa aplikasi yang akan digunakan supaya Joomla dapat dioperasikan di komputer Anda. Ini adalah daftar aplikasi dan persiapan yang harus dilakukan sebelum melakukan instalasi Joomla

* Joomla 1.0.3, dapat di-download di http://www.joomla.org
* Apache Server, PHP, MySQL, dan phpMyAdmin, untuk memudahkan instalasi ini Anda menggunakan aplikasi XAMPP untuk windows yang tersedia dan dapat di-download di http://www.apachefriends.org. Anda hanya cukup mengikuti instruksi instalasi saja. Dengan melakukan instalasi XAMPP komputer anda akan otomatis diinstal Apache Server, PHP, MySQL, dan phpMyAdmin.

Instalasi Joomla

Persiapan sebelum melakukan instalasi Joomla

1. Ekstrak file Joomla 1.0.3 ke folder C:\apachefriends\xampp\htdocs\Joomlaku.
2. Aktifkan Apache Server, PHP, dan MySQL. Jalankan aplikasi XAMPP yang telah terinstal dan tekan tombol Start pada Apache dan MySql hingga tombol Start berubah menjadi Stop. Kalau tidak bisa, coba Anda non-aktifkan IIS atau Personal Web Server Anda.

Setelah semua telah disiapkan, mari kita mulai instalasi Joomla. Ikuti langkah-langkah di bawah ini:

1. Buka web browser dan ketik http://localhost/Joomlaku. Web Anda akan menampilkan tampilan seperti di gambar ini.
2. Pastikan semua persyaratan instalasi terpenuhi dan tekan tombol Next>> untuk melanjutkan.
3. Di halaman ini akan ditampilkan perjanjian yang harus Anda patuhi jika ingin menggunakan Joomla. Tekan tombol Next>> untuk melanjutkan.
4. Masukkan konfigurasi database MySQL.

Keterangan konfigurasi database MySQL:
* Host Name, nama host name, biasa diisi dengan localhost
* MySQL User Name, username yang digunakan untuk mengakses MySQL, biasa diisi root atau username yang disediakan web hosting Anda
* MySQL Password, password yang digunakan untuk mengakses MySQL, gunakan password untuk keamanan web Anda.
* MySQL Database Name, nama database untuk Joomla.
* MySQL Table Prefix, awalan yang digunakan untuk tabel database Anda.

Bila sudah diisi semua lanjutkan dengan klik tombol Next>>. Sesaat kemudian akan muncul pesan yang meminta konfirmasi konfigurasi yang telah Anda masukkan. Bila semua sudah benar, tekan tombol OK.
5. Di halaman ini Anda diminta memberi nama web Anda. Berilah nama dan tekan tombol Next>> untuk melanjutkan.
6. Silahkan lakukan konfirmasi URL, direktori absolut, e-mail admin dan direktori chmods. Masukkan alamat e-mail dan password untuk admin anda. Tekan Next>>.
7. Selamat Anda telah berhasil melakukan instalasi Joomla Jangan lupa untuk menghapus direktori installation di direktori Joomla Anda.

Halaman Web dan Administrator

Setelah berhasil melakukan instalasi mari kita coba mengakses web Joomla.

1. Kunjungi web Joomla Anda di alamat http://localhost/joomlaku/. Jika Anda belum menghapus direktori installation di direktori Joomla Anda maka web Anda dan web administrator akan menampilkan pesan peringatan.
2. Kunjungi web Joomla Anda di alamat http://localhost/joomlaku/administrator.
3. Login dengan username ‘admin’ dan password admin Anda.

Update Database with OOP

Penggunaan seleksi untuk menampilkan database menggunakan OOP telah penulis jelaskan sebelumnya. OOP dalam php 5 ini telah terbukti ampuh dalam menghasilkan source code yang efisien untuk menangani manajemen database. Tentu hambar rasanya jika penggemar sayur asam memakannya tanpa ada sedikitpun rasa garam di dalamnya. Nah begitu juga dengan artikel penulis sebelumnya, menampilkan database dengan OOP masih belum cukup tanpa pengetahuan selanjutnya mengenai bagaimana melakukan update dan delete record pada database menggunakan OOP ini. Oleh karena itu di sinilah penulis akan jelaskan sedikit penggunaan OOP untuk menghandle database. Untuk mempelajarinya mari buat databasenya terlebih dahulu :

-- simple cms database
create database simplecms ;
use simplecms ;
create table article( id int(4) primary key auto_increment, category varchar(225), article_title varchar(225) );
insert into article values('','web design', 'Web Design Make Over with CSS');
insert into article values('','graphic design','CorelDraw the handy tool');
insert into article values('','flash animation','Make a splash water animation');

Ya, langsung saja penulis berikan contoh kasusnya, script intinya, index.php, dan biasanya script seperti ini digunakan sebagai halaman admin. Tentunya admin disini dapat melakukan update dan delete record database.

<?php
$mysqli = new mysqli("localhost", "root", "", "simplecms");
if (mysqli_connect_errno())
{
    echo("Nggak bisa konek : ".mysqli_connect_error());
    exit();
}
$cat = $mysqli->prepare("select id, category, article_title from article order by id");
$cat->execute();
$cat->bind_result($id, $category, $article_title);
?>

<html>
<head>
<title>Database in OOP Way ; Seleksi Data dengan mySqli</title>
</head>
<body><table border='0' width='40%'>

<caption><h3>SIMPLECMS CONTROL PANEL :</h3></caption>
<tr><th>No</th><th>Category</th><th>Title</th></tr>
<?php
while ($cat->fetch())
    echo "<tr><td>".$id."</td><td>".$category."</td>"."<td>".$article_title."</td><td><a href=?yang_ini_diedit=ya&id_nya="
    .$id.">EDIT</a></td><td><a href=?yang_ini_didelete=ya&id_nya=".$id.">DELETE</a></td></tr>";
?>
</table>
<hr width='39%' align='left'/>
<?php
if ($_REQUEST['yang_ini_didelete'] == 'ya')
{
    echo "Wah... record ".$_REQUEST['id_nya']." bener-bener mau di hapus ya ?" ;
    echo "<form action='?delete_langsung_lah=ya' method='POST'>
            <table><input type='hidden' name='id' value=".$_REQUEST['id_nya'].">
            <tr><td><input type='submit' value='ya' name='submit'></td></tr></table>
            </form>";
}

else if ($_REQUEST['delete_langsung_lah'] == 'ya')
{
    $id_delete = $_POST['id'];
    $cat = $mysqli->prepare("delete from article where id=?");
    $cat->bind_param('i',$id);
    $id = $id_delete;
    $cat->execute();
    echo "Database berhasil dihapus ... Anda akan diredirect dalam 2 detik";
    echo "<meta http-equiv='refresh' content='2;url=index.php'>";
}

else if ($_REQUEST['yang_ini_diedit'] == 'ya')
{
    $cat = $mysqli->prepare("select id, category, article_title from article where id=?");
    $cat->bind_param('i',$id);
    $id = $_REQUEST['id_nya'];
    $cat->execute();
    $cat->bind_result($id, $category, $article_title);
    echo "<caption>Yang mau diedit...</caption>";
    echo "<table><form action='?update_langsung_lah=ya' method='POST'>";
    while ($cat->fetch()) {
    echo "<tr><td>Category : </td><td><select name='category'><option value=".str_replace(" ","_",$category).">".$category."</option></select></td></tr>";
    echo "<tr><td>Title : </td><td><textarea name='title' cols='51' rows='7'>";
    echo $article_title ; }
    echo "</textarea></td></tr>";
    echo "<input type='hidden' name='id' value=".$_REQUEST['id_nya'].">";
    echo "<tr><td></td><td><input type='submit' name='submit' value='update'></td></tr>";
    echo "</form></table>";
}

else if ($_REQUEST['update_langsung_lah'] == 'ya')
{
    $category = str_replace("_"," ",$_POST['category']);
    $title = $_POST['title'];
    $id = $_POST['id'];

    $cat = $mysqli->prepare("update article SET category ='$category', article_title = '$title' where id=?");
    $cat->bind_param('i',$id);
    $cat->execute();

    echo "Database berhasil diupdate ... Anda akan diredirect dalam 2 detik";
    echo "<meta http-equiv='refresh' content='2;url=index.php'>";

}
?>

</body>
</html>

Tampilannya nanti akan seperti ini :

Potongan source code di bawah ini digunakan untuk menampilkan database dengan cara OOP. Seperti yang pernah penulis jelaskan dalam artikel pertama mengenai penggunaan OOP dalam PHP 5 untuk memanage database.

$mysqli = new mysqli("localhost", "root", "", "simplecms");
if (mysqli_connect_errno())
{
    echo("Nggak bisa konek : ".mysqli_connect_error());
    exit();
}
$cat = $mysqli->prepare("select id, category, article_title from article order by id");
$cat->execute();
$cat->bind_result($id, $category, $article_title);

Penjelasan detilnya dapat dilihat di artikel sebelumnya. Di sini penulis akan menjelaskan beberapa fungsi baru OOP dalam PHP 5. Lihat kembali fungsi tersebut pada baris ini :

...
$cat = $mysqli->prepare("delete from article where id=?");
$cat->bind_param('i',$id);
$id = $id_delete;
$cat->execute();
echo "Database berhasil dihapus ... Anda akan diredirect dalam 2 detik";
echo "<meta http-equiv='refresh' content='2;url=index.php'>";
...

Di dalam barisan tersebut terdapat kalimat pembentuk query sql yang sedikit berbeda, yaitu :
$cat = $mysqli->prepare("delete from article where id=?");

Terdapat tanda '?' sebagai perwakilan dari parameter syarat. Tanda tanya ini nantinya akan didefinisikan sebagai satu syarat dalam satu variable menggunakan fungsi bind_param(), sehingga jika sebuah query didefinisikannya seperti ini :
cat = $mysqli->prepare("delete from article where id=?");

maka, harus terdapat fungsi bind_param() sesudahnya, seperti :
$cat->bind_param('i',$id);

Sehingga 2 baris kalimat tersebut sama halnya dengan query biasa, jika dalam query biasa maka hasilnya seperti ini :

$cat = "delete from article where id='$id'";

Setali 3 uang. :D. Ya ya ya ... tapi coba perhatikan kembali fungsi bind_param pada kalimat tersebut :
$cat->bind_param('i',$id);

Dalam parameter pertama fungsi bind_param di isi dengan 'i'.
Kenapa dengan 'i' ?, i ini adalah perwakilan dari variable yang bertipe integer. Dalam query seperti ini delete from article where id='$id', mustahil jika mengisinya dengan string, kenapa ? lihat struktur tablenya. :D, hasilnya nanti akan 0 jika menggunakan string. Adapun type dari parameter tersebut antara lain yaitu :

i : ini untuk variable yang bertipe integer
s : ini untuk variable yang bertipe string
d : ini untuk variable yang bertipe double
b : ini untuk variable yang bertipe blob.

Ya kita lompat ke baris berikutnya :
$id = $id_delete;
Statement ini hanyalah sebuah assignment, memenuhi syarat sebelumnya.

Selanjutnya adalah menjalankan querynya, eksekusi langsung :D , yakni :
$cat->execute();

Kembali muncul satu pertanyaan, bagaimana jika menggunakan update database dalam oop ? Silahkan lihat kembali baris di bawah ini :

$cat = $mysqli->prepare("update article SET category ='$category', article_title = '$title' where id=?");
$cat->bind_param('i',$id);
$cat->execute();

Sepertinya sudah jelas ya. :).

Definisikan terlebih dahulu querynya :
$cat = $mysqli->prepare("update article SET category ='$category', article_title = '$title' where id=?");

Penuhi syarat query tersebut :
$cat->bind_param('i',$id);

Jalankan querynya :
$cat->execute();

Sudah jelas ya? Jika masih ada yang ditanyakan silahkan layangkan email anda ke sini :
alkemail@gmail.com.
Script diatas dapat di download di sini …

Dedicated for ilmuwebsite e-learning community.

Sumber dari situs Ilmu Website dalam kategori php kuliah dengan judul Update, Delete Database with OOP

Tab CSS Menu Sederhana

Suka dengan CSS menu? cobalah membuat CSS menu anda sendiri.

Berikut ada contoh membuat menu CSS sederhana, untuk proses belajar anda bisa memodifikasinya :)
Code nya:

------------------------------
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
         <meta
http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"/>
         <title>DHTML Tab,JavaScript Tab</title>
    <style type="text/css">
         #tabs {display: block;float: left;width: 160px;}
         .panel
{border: solid 1px #D8D8D8;border-top: none;background-color:
#FFFFFF;padding: 0px;width: 158px;overflow: auto;clear: left;}
         .tab_bdr{padding:
0px;width: 158px;border: 0px;border: 1px solid #645DB5;height:
4px;margin:0px;background: #645DB5;clear: left;font-size: 0px;}
         .tab{font-family:tahoma;
FONT-SIZE:
11px;background:#BA0808;color:#FFFFFF;cursor:pointer;border:none;border-bottom:
1px solid #FFFFFF;height:19px;padding-top:3px;margin:0px;width:60px;
float:left; text-decoration:none;}
         .tab_sel{font-family:tahoma;
FONT-SIZE:
11px;background:#645DB5;color:#FFFFFF;cursor:pointer;border:none;border-bottom:1px
solid #645DB5;height:19px;padding-top:3px;margin:0px;width:60px;
float:left; text-decoration:none;}
    </style>
    <script language="JavaScript" type="text/javascript">
    var panels = new Array('panel1', 'panel2'); // IDs of the content panels must be put here
    var tabs = new Array('tab1', 'tab2'); // IDs of the tabs must be put here
    function displayPanel(nval)
    {
         for(i = 0; i < panels.length; i++)
         {

document.getElementById(panels[i]).style.display = (nval-1 == i) ?
'block':'none';

document.getElementById(tabs[i]).className=(nval-1 == i) ?
'tab_sel':'tab';
         }
    }
    </script>
    </head>
    <body>
         <div id="tabs">

<div id="tab1" class="tab_sel" align="center" onClick="javascript:
displayPanel('1');">Tab 1</div>

<div id="tab2" class="tab" style="margin-left:1px;" align="center"
onClick="javascript: displayPanel('2');">Tab 2</div>
         </div>

<div class="tab_bdr"></div> 
         <div
class="panel" id="panel1" style="display: block">1</div>

         <div class="panel" id="panel2" style="display: none">2</div>
    </body>
</html>
------------------------------

contoh jadi: http://www.ilmuwebsite.com/test/css-tab.htm
Terimakasih

Sumber dari situs Ilmu Website dalam kategori html dengan judul Tab CSS Menu Sederhana

Ojie

Pages

Friday, February 27, 2009

Instalasi Joomla

Update Database with OOP

Tab CSS Menu Sederhana

My Blog List

Followers