Membuat Smilies

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.

Ingin Belajar Webs Development HTML CSS JQuery Javascript Codeigniter Lebih Lengkap, Mudah, dan Lebih Terstruktur?

Pakai Modul Video Tutorial Interaktif Mudah Jelas Gamblang, Nggak Pakai Ribet, Kenapa Video? Kalo Ebook Atau Buku Tebelnya sangat mantap.... Mumpung Ada Promo, Beli Sekarang!! Promo Tutorial Premium Mahir Web Development Bangun 5 Project Website + Mahir Membuat 4 Aplikasi Android + Bonus Tutorial Membuat Themes Wordpress Premium, 3 Tutorial Isi 5 Dvd hanya Rp 150rb (harga normal Rp 296rb) !!! Terbatas Hanya Sampai 20 Maret 2020 (Tutornya sudah Berpengalaman di bidang Web Development Lebih Dari 15 Tahun!!) (Pemesanan bisa SMS/WA ke 0838 1157 5876, atau bisa pesan secara online di sini)


 

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

Artikel Terkait :