BELAJAR NGEDIT SCRIPT PHP DAN HTML





Software Xammp For Windows untuk Software pembuat website.
script halaman web yang berisi sebarang teks dan paragraf :
dan semuanya diketik di Notepad ++
<? include "config.php"; ?>
<html>
<head>
<title>Example</title>
<style type=”text/css”>
<!–
body {
background-color: <? echo $background; ?>;
}
h1 {
font-family:”<? echo $fontHeading; ?>”;
color:<? echo $fontColorHeading; ?>;
font-size:<? echo $fontSizeHeading; ?>px;
}
p {
font-family:”<? echo $fontParagraf; ?>”;
color:<? echo $fontColorParagraf; ?>;
font-size:<? echo $fontSizeParagraf; ?>px;
text-align:<? echo $alignment; ?>;
}
–>
</style></head>
<body>
<h1>Heading</h1>
<p>Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. Ini sebuah paragraf. </p>
<p><a href=”properties.php”>Edit Tampilan</a></p>
</body>
</html>
Perhatikan script page.php tersebut terutama pada bagian paling atas. Pada bagian tersebut terdapat perintah include. Include ini nanti diarahkan ke file config.php yang berisi value-value CSS. Value dari config.php ini dibaca kemudian diletakkan ke bagian CSS dalam page.php.
Bagaimana isi file config.php? ini dia
Code: [Select]
<?php
$background = "#FF0000";
$fontHeading = "Helvetica";
$fontSizeHeading = "23";
$fontColorHeading = "#FFFFFF";
$fontParagraf = "Times New Roman";
$fontColorParagraf = "#000000";
$fontSizeParagraf = "18";
$alignment = "justify";
?>
Selanjutnya kita buat form edit untuk mengubah value yang ada dalam file config.php
properties.php
Code: [Select]
<? include "config.php"; ?>
<html>
<head>
<title>Page Properties</title>
</head>
<body>
<h1>Page Properties</h1>
<form method=”post” action=”simpan.php”>
<table width=”100%”  border=”0″>
<tr>
<td>Warna Background Halaman </td>
<td><input name=”background” type=”text” value=”<? echo $background; ?>”></td>
</tr>
<tr>
<td>Jenis Font Heading </td>
<td><input name=”fontHeading” type=”text” value=”<? echo $fontHeading; ?>”></td>
</tr>
<tr>
<td>Ukuran Font Heading </td>
<td><input name=”fontSizeHeading” type=”text” size=”3″ value=”<? echo $fontSizeHeading; ?>”>
px </td>
</tr>
<tr>
<td>Warna Font Heading </td>
<td><input name=”fontColorHeading” type=”text” value=”<? echo $fontColorHeading; ?>”></td>
</tr>
<tr>
<td>Jenis Font Paragraf</td>
<td><input name=”fontParagraf” type=”text” value=”<? echo $fontParagraf; ?>”></td>
</tr>
<tr>
<td>Warna Font Paragraf </td>
<td><input name=”fontColorParagraf” type=”text” value=”<? echo $fontColorParagraf; ?>”></td>
</tr>
<tr>
<td>Ukuran Font Paragraf</td>
<td><input name=”fontSizeParagraf” type=”text” size=”3″ value=”<? echo $fontSizeParagraf; ?>”>
px</td>
</tr>
<tr>
<td>Perataan Paragraf </td>
<td><input name=”alignment” type=”text” value=”<? echo $alignment; ?>”></td>
</tr>
<tr>
<td>&nbsp;</td>
<td><input type=”submit” name=”Submit” value=”Submit”></td>
</tr>
</table>
</form>
</body>
</html>
Seperti halnya pada page.php, pada properties.php juga perlu untuk membaca isi dari config.php, perhatikan adanya perintah include “config.php” pada bagian paling atas script. Mengapa demikian? Ya… karena isi dari config.php ini nanti akan ditampilkan pada setiap komponen editnya.
Berikutnya yang terakhir, kita buat script simpan.php yaitu script untuk memproses pengubahan value CSS hasil pengeditan via form. Pengubahan ini nanti langsung dilakukan pada file config.php. Nah… yang jadi masalah adalah, bagaimana proses pengubahan isi suatu script? Sulitkah? Jangan khawatir teman… Kita bisa gunakan function file(). Function ini secara otomatis membaca suatu file teks berdasarkan setiap barisnya dan selanjutnya dinyatakan sebagai array. Nah… berarti kita hanya melakukan manipulasi array saja. Setelah array dimanipulasi, kita tulis kembali array tersebut ke file teks semula.
OK… berdasarkan ide di atas sekarang kita buat simpan.php nya
simpan.php
Quote
Code: [Select]
<?php
// membaca value dari form
$background = $_POST['background'];
$fontHeading = $_POST['fontHeading'];
$fontSizeHeading = $_POST['fontSizeHeading'];
$fontColorHeading = $_POST['fontColorHeading'];
$fontParagraf = $_POST['fontParagraf'];
$fontColorParagraf = $_POST['fontColorParagraf'];
$fontSizeParagraf = $_POST['fontSizeParagraf'];
$alignment = $_POST['alignment'];
// membuat baris yang akan ditulis ke file config.php
// untuk setiap value misal: $background = ”#FFFFFF”;
$background = ”\$background = \”".$background.”\”;\n”;
$fontHeading = ”\$fontHeading = \”".$fontHeading.”\”;\n”;
$fontSizeHeading = ”\$fontSizeHeading = \”".$fontSizeHeading.”\”;\n”;
$fontColorHeading = ”\$fontColorHeading = \”".$fontColorHeading.”\”;\n”;
$fontParagraf = ”\$fontParagraf = \”".$fontParagraf.”\”;\n”;
$fontColorParagraf = ”\$fontColorParagraf = \”".$fontColorParagraf.”\”;\n”;
$fontSizeParagraf = ”\$fontSizeParagraf = \”".$fontSizeParagraf.”\”;\n”;
$alignment = ”\$alignment = \”".$alignment.”\”;\n”;
// nama file yang akan dibaca
$file = ”config.php”;
// membaca file dan menyatakan isi file ke dalam array
$arrayRead = file($file);
// mengubah isi setiap elemen array dengan nilai yang baru
$arrayRead[1] = $background;
$arrayRead[2] = $fontHeading;
$arrayRead[3] = $fontSizeHeading;
$arrayRead[4] = $fontColorHeading;
$arrayRead[5] = $fontParagraf;
$arrayRead[6] = $fontColorParagraf;
$arrayRead[7] = $fontSizeParagraf;
$arrayRead[8] = $alignment;
// menyimpan kembali isi array yang baru ke file
$simpan = file_put_contents($file, implode($arrayRead));
if ($simpan)  {
echo ”<h2>Update tampilan sukses</h2>”;
echo ”<p><a href=\”page.php\”>Lihat tampilan</a></p>”;
}
else echo ”<h2>Update tampilan gagal</h2>”;
?>
Mungkin Anda bertanya, apa maksudnya $arrayRead[1] = $background; ? Good question… Seperti yang telah saya singgung di atas tentang penggunaan perintah file(), bahwa perintah tersebut akan membaca suatu file setiap baris dan hasil pembacaannya dinyatakan ke dalam bentuk array. Nah… $arrayRead[1] ini maksudnya adalah elemen array yang merupakan hasil pembacaan pada baris ke-2 dari file config.php, yang dalam hal ini terkait dengan value background. Coba perhatikan kembali isi dari config.php di atas. Selanjutnya untuk font heading, pada file config.php terletak pada baris ke-3, jadi arraynya adalah $arrayRead[2], begitu seterusnya… Ingat.. bahwa indeks array dalam PHP dimulai dari 0.
Kemudian mungkin ada yang bertanya lagi… mengapa ada \n di belakang setiap baris yang akan diisikan ke file config.php, misalnya $background = “\$background = \””.$background.”\”;\n”; ? Yup… ini juga good question… kegunaan \n adalah supaya teks berikutnya berada di bawahnya, sehingga membentuk baris baru dalam file teks.
Oya, apa pula kegunaan function implode()? Function ini digunakan untuk menggabung semua elemen array menjadi sebuah string. String hasil gabungan elemen array ini selanjutnya akan ditulis kembali ke file.

Tidak ada komentar:

Posting Komentar