Membuat Smilies

Sering kita temukan website yang menyediakan smilies seperti gambar diatas (biasanya pada website forum dan guest book). Smilies berfungsi untuk menampilkan ekspresi muka dari setiap perkataan yang diberikan. Sebenarnya cara untuk membuat Smilies sangatlah mudah.

Pertama-tama buat databasenya terlebih dahulu untuk menyimpan nama dan komentar.

CREATE DATABASE komentar ;

CREATE TABLE komentar.comment (
? nama VARCHAR( 30 ) NOT NULL ,
? comment TEXT NOT NULL
? ) ENGINE = MYISAM

Setelah selesai membuat databasenya, sekarang kita buat file script kodenya. Perlu diingat, gambar smilies harus disiapkan terlebih dahulu. Buat 5 gambar smilies seperti diatas dan berikan nama sad.png, smile.png, tongue.png, wink.png, dan yang terakhir yikes.png.

config.php

<?php
class config {
public $host = “localhost”;
public $user = “root”;
public $pass = “”;
public $db = “komentar”;
function config () {
$this->connect = mysql_connect($this->host,$this->user,$this->pass);
$this->db = mysql_select_db($this->db);
if(!$this->connect)
{
print “Koneksi ke database gagal…!!!<br><br>”;
}
if(!$this->db)
{
print “Database belum ada…!!!<br><br>”;
}
} // end function
} // end class
$config = new config();
?>

Index.php

<?php
include(“config.php”);
class simpan extends config {
function simpan () {
if($_GET['comment'] == “do”)
{
$nama = $_POST['nama'];
$comment = $_POST['comment'];
// mengganti text menjadi smilies
$comment = str_replace(“;)”,”<img src=wink.png>”,$comment);
$comment = str_replace(“:)”,”<img src=smile.png>”,$comment);
$comment = str_replace(“:(“,”<img src=sad.png>”,$comment);
$comment = str_replace(“:p”,”<img src=tongue.png>”,$comment);
$comment = str_replace(“:o”,”<img src=yikes.png>”,$comment);
header(“Location: index.php”);
$this->query = mysql_query(“INSERT INTO comment (nama,comment) values (‘$nama’,'$comment’)”);
}
}
}
class tampil extends config {
function query () {
$this->query = mysql_query(“SELECT * FROM comment”);
}
function tampil_data () {
while($this->run_query = mysql_fetch_array($this->query))
{
print “Nama : “.$this->run_query['nama'].” <br>”;
print “Komentar : “.$this->run_query['comment'].” <br><br><br>”;
}
}
}
$simpan = new simpan();
$tampil = new tampil();
$tampil->query();
$tampil->tampil_data();
?>
<script>
function gantiText(text, textarea)
{
textarea.value += text;
textarea.focus(textarea.value.length – 1);
}
</script>
<form action=”?comment=do” method=”post” name=”smilies” id=”smilies”>
<p> <strong>Nama :<br>
<input name=”nama” type=”text” id=”nama” size=”30″ maxlength=”30″>
<br> <br>
Komentar anda :</strong><br>
<br>
<a href=”javascript:void(0);” onclick=”gantiText(‘;)’, document.smilies.comment);”><img src=”wink.png” width=”15″ height=”15″ border=”0″ /></a> <a href=”javascript:void(0);” onclick=”gantiText(‘:(‘, document.smilies.comment);”><img src=”sad.png” width=”15″ height=”15″ border=”0″ /></a> <a href=”javascript:void(0);” onclick=”gantiText(‘:)’, document.smilies.comment);”><img src=”smile.png” width=”15″ height=”15″ border=”0″ /></a> <a href=”javascript:void(0);” onclick=”gantiText(‘:p’, document.smilies.comment);”><img src=”tongue.png” width=”15″ height=”15″ border=”0″ /></a> <a href=”javascript:void(0);” onclick=”gantiText(‘:o’, document.smilies.comment);”><img src=”yikes.png” width=”15″ height=”15″ border=”0″ /></a><br>
<br>
<textarea name=”comment” cols=”50″ rows=”6″ id=”comment”></textarea>
</p> <p>
<input type=”submit” name=”Submit” value=”Simpan”>
</p>
</form>

Sedikit Penjelasan kode diatas :

Pada config.php, digunakan class config. Fungsinya untuk mengkoneksikan database. Lalu Perhatikan pada bagian class simpan. Terdapat perintah str_replace yang berfungsi agar mengganti kata semisal :) menjadi <img src=smile.png>. Kata tersebut harus diganti agar pada saat komentar tersimpan, yang ditampilkan adalah gambar smilies. Bukan :). Untuk lebih memudahkan, pembaca sekalian dapat mendownload source kodenya?Disini

Yah, sekian dulu lah penjelasan dari saya. Jika ada yang ingin ditanyakan, silahkan menghubungi saya di

Email 1 :? ivan@ilmuwebsite.com
Email 2 : ivan_wen_piao@yahoo.co.id
web : http://ivan.ilmuwebsite.com

Cara Membuat Website dengan Adobe Dreamweaver

Ingin tau lebih jelas, lebih cerdas, tentang cara pembuatan website? Store Ilmuwebsite menyediakan CD Tutorial Interaktif dengan harga murah, mengantar Anda menjadi seorang web designer yang handal

Mahir PHP MySQL Membuat Aplikasi Dinamis Berbasis Web

Ingin tau lebih jelas, lebih cerdas, tentang cara pembuatan website dinamis atau aplikasi berbasis web? Kami punya solusi yang sangat sangat murah! Lebih ampuh dari hanya sekedar membaca buku, interaktif layaknya kursus PHP biasa

No related posts.