---------
Panel Home
Membuat Guestbook Flat Data
Sat 23 Nov 2024 - 19:13
Assalamu'alaikum, udh lama ga update blog. kali ini
ane akan berbagi cara membuat guestbook paling sederhana dari flat data.
tutorial ini gabungan dari skrip² guestbook sebelum nya, yg kali ini ane kasih nama
guestbook geni versi 5.0, karena ini yg ke 5 kalinya membuat skrip guestbook.

pertama, bikin dulu file : add.php sebagai awal penulisan flat datanya.

<?php
$file = "msg.txt";
if (isset($_SERVER['HTTP_X_FORWARDED_FOR'])){
$ip = $_SERVER['HTTP_X_FORWARDED_FOR'];
}
elseif(isset($_SERVER['HTTP_CLIENT_IP'])){
$ip = $_SERVER['HTTP_CLIENT_IP'];
}else{
$ip = $_SERVER['REMOTE_ADDR'];
}
if (isset($_SERVER['HTTP_X_OPERAMINI_PHONE_UA'])) {
$ua = $_SERVER['HTTP_X_OPERAMINI_PHONE_UA'];
}
else {
$ua = $_SERVER['HTTP_USER_AGENT'];
}
// fungsi filter karakter spesial
function filter($string) {
$string = stripslashes(htmlspecialchars($string));
$string = str_replace("n", "
", $string);
$string = str_replace("", "", $string);
return $string;
}

echo '<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Faine Guestbook Versi 5.0</title>
<style type="text/css">
</style>
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=utf-8" />
</head>
<link rel="stylesheet" type="text/css" href="./style.css" media="all,handheld"/><link rel="shortcut icon" href="/favicon.ico" />';

$nama = isset($_POST['nama']);
$teks = isset($_POST['komen']);
if ($nama){
$nama = $_POST['nama'];
$teks = $_POST['komen'];
$nama = filter($nama);
$teks = filter($teks);
// mulai fungsi error
if((strlen($nama) < 3) (strlen($nama) > 15) (strlen($teks) < 3) (strlen($teks) > 200) (empty($nama)) (empty($teks))) {
echo '<div>';
echo " Nama atau Komen tidak sesuai.. Ulangi
";
echo '</div>';
} else {
// membuat data komentar
$zona_waktu = 0;
$tgl = date('D d M Y - H:i', time() + ($zona_waktu * 3600));
$fp = fopen($file, "a");
$konten = "$tgl$nama$teks$ua$iprn";
fwrite($fp, $konten);
fclose($fp);
echo 'Komentar telah di tambah
';
echo '<a href="./">Kembali</a>
';
Header('Location: ./');
}
}

echo '<div id= "logo">';
echo ' Guestbook Versi 5.0 ';
echo '</div>';
echo '<div class= "modbox">';
echo 'Tambah Komentar
';
echo '(Nama min 3 - max 15, Komen min 3 - max 200)
';
echo '<form action="?" method="post">
Nama :

<input type="text" name="nama" size="15" value="" />
Komen :

<textarea name="komen" cols="15" rows="3" value=""></textarea>
<input type="submit" value="Tambah" /></form>
';
echo '</div>';
echo '<div class= "bottommenu">
<div>';
echo '&copy; Faine 2024 ';
echo '</div></div>';
echo '</body>
</html>';
?>

kedua, bikin file : msg.txt sebagai tempat penyimpanan data.

ketiga, bikin file : admin.php sebagai sarana admin untuk mengatur, menghapus isi pesan yg tidak di inginkan dari prngunjung

<?php
$admin_pass = "lihat";
session_start();

// fungsi login ke panel
function form_login($page){
echo '<form action="'.$page.'" method="post">
Input Password :

<input type="text" name="pwd" size="15" value="" />
<input type="submit" value="Login" /></form>';
}

// fungsi panel
function form_proses($password){
$pwd = isset($_POST['pwd']) ? $_POST['pwd'] : "";
if($pwd){
$pwd = $_POST['pwd'];
$pwd = filter($pwd);
if($pwd != $password) {
echo 'Password salah
';
} else {
$_SESSION['pwd'] = $password;
echo 'Login Sukses

<a href="./">kembali</a>
';

}
}
else {
echo ' Tidak ada metode yg di proses
';
}
}

// fungsi filter karakter spesial
function filter($string) {
$string = stripslashes(htmlspecialchars($string));
$string = str_replace("n", "
", $string);
$string = str_replace("", "", $string);
return $string;
}
echo '<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Faine Guestbook Versi 5.0</title>
<style type="text/css">
</style>
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=utf-8" />
</head>
<link rel="stylesheet" type="text/css" href="./style.css" media="all,handheld"/><link rel="shortcut icon" href="/favicon.ico" />
<div id="logo">Guestbook Versi 5.0</div>
<div class="modbox">';
echo 'Admin Area</div>';
echo '<div class= "post_body">';
// admin login
form_login('?');
if (isset($_POST['pwd'])) {
form_proses($admin_pass);
}
echo '</div>';
// div bawah
echo '<div class= "bottommenu">
<div>';
echo '&copy; Faine 2024 ';
echo '</div></div>';
echo '</body>
</html>';
?>

ke empat, bikin file : del.php sebagai eksekusi penghapusan pesan yg tidak di inginkan

<?php
session_start();
$id = isset($_GET['id']);

if(isset($_SESSION['pwd']) && $id) {

$data = "msg.txt";
$str = $_GET['id'];
$basedel = $data;
$basestr = array_reverse(file("$basedel"));
$delstr = trim($basestr[$str]);
$buff = @file_get_contents($basedel);
$buff =str_replace("$delstrrn","",$buff);
$file = fopen("$basedel","w");
fputs($file,"$buff");
fclose($file);
Header('Location: ./');
} else {
echo 'Tidak ada sesi admin';
}
?>

ke lima, bikin file : index.php untuk menampilkan pesan.

<?php
/*
Guestbook geni Versi 5.0
- Super Ringan dan praktis
- Support PHP Versi 7 ke atas
- Dengan fungsi² sederhana seperti Bbcode
- Gabungan dari script² guestbook versi sebelum nya
- Project di buat November 2024
- Home : http://faine.my.id
*/
session_start();
$admin_pass = "lihat";
$file = "msg.txt";
$tampil = 5;
$msg = file($file);
$msg = array_reverse($msg);
$jumlah_pesan = count($msg);

// fungsi bb kode
function Text_Bb($msg) {
// $msg = preg_replace("#(^[n ])([w]+?://[^ "nrt<]*)#is", "\1<a href="\2">\2</a>", $msg);
$arr = array(
"#"">(.*?)#si" => "<a href="\1">\2</a>",
"#(.*?)#si" => "<a href="\1">\2</a>",
"#(.*?)#si" => "<b>\1</b>",
"#(.*?)#si" => "<i>\1</i>",
"#(.*?)#si" => "<u>\1</u>",
"#(.*?)#si" => "<big>\1</big>",
"#(.*?)#si" => "<sup>\1</sup>",
"#(.*?)#si" => "<sub>\1</sub>",
"#(.*?)#si" => "<s>\1</s>",
"#(.*?)#si" => "<strike>\1</strike>",
"#(.*?)#si" => "<strong>\1</strong>",
"#(.*?)#si" => "<tt>\1</tt>",
"#(.*?)#si" => "<blink>\1</blink>",
"#(.*?)#si" => "<small>\1</small>",

"#"">(.*?)#si" => "<font color="\1">\2</font>",
"#(.*?)#si" => "<font color="\1">\2</font>"
);
$msg = preg_replace(array_keys($arr), array_values($arr), $msg);
$msg = preg_replace('/((http(s)?://)[^ ]+)/', '<a href="$1">$1</a> ', $msg);
$msg = preg_replace('/((www)[^ ]+)/', '<a href="http://$1">$1</a> ', $msg);
$msg = str_replace("n","",$msg);
return $msg;
}

echo '<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN" "http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Faine Guestbook Versi 5.0</title>
<style type="text/css">
</style>
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=utf-8" />
</head>
<link rel="stylesheet" type="text/css" href="./style.css" media="all,handheld"/><link rel="shortcut icon" href="/favicon.ico" />';

echo '<div id= "logo">';
echo ' Guestbook Versi 5.0 ';
echo '</div>';
echo '<div id= "menu">';
echo ' [<a href="./add.php">Tulis</a>]';
echo ' [<a href="./admin.php">Panel</a>]
';
echo '</div>';
$page = isset($_GET['page']) ? $_GET['page'] : 1;
$awal = $page * $tampil;
$akhir = $awal - $tampil;
$jumlah_page = ceil($jumlah_pesan / $tampil);
for($i = $akhir; $i < $awal & $i < $jumlah_pesan; $i++)
{
list($date, $nama, $teks, $ua, $ip) = explode("", $msg[$i]);
// tampilan div
echo '<div class= "post_author">';
echo $date.'
';
echo '</div>';
echo '<div class= "post_body">';
'<div class= "post_content">';
echo '<b>'.$nama.'</b>
'.Text_Bb($teks).'
';
echo '</div>';
// jika ada sesi admin masuk
if (isset($_SESSION['pwd'])) {
echo '<div class= "post_ignored">';
echo '<b>'.$ua.'</b>
'.$ip.'
';
echo '</div>';
echo '<div class= "post_manage">';
echo '[<a href="del.php?id='.$i.'">HAPUS</a>]
';
echo '</div>';
}
echo '</div>';

}

echo '<table border= "0" cellspacing= "0" cellpadding= "6" class= "tborder" style= "border-top-width: 0;">
<tr>
<td colspan= "2" class= "tfoot" align= "center">
<div>
<strong>';
if (isset($_SESSION['pwd'])) echo ' [<a href="./logout.php">Logout</a>]
';
if ($jumlah_pesan == 0) echo 'Belum ada pesan
';
if($page > 1) echo '<a href="?page='.($page-1).'">Prev</a> ';
else echo 'Prev ';
if($page < $jumlah_page) echo '<a href="?page='.($page+1).'">Next</a>';
else echo 'Next ';
echo '</strong>';
echo '
';
if($jumlah_pesan > 0) echo 'Jumlah Pesan : '.$jumlah_pesan.'
';
if($jumlah_page > 1) echo 'Jumlah Halaman : '.$jumlah_page.'
';


echo '</div>
</td>
</tr>
</table>';

echo '<div class= "bottommenu">
<div>';
echo '&copy; Faine 2024 ';
echo '</div></div>';
echo '</body>
</html>';
?>

ke enam, bikin file : style.css untuk mewarnai halaman.


body {
background: #fff;
width: auto;
color: #000;
text-align: center;
line-height: 1.4;
margin: 0;
-webkit-text-size-adjust: none;
font-family: Arial, Helvetica, Sans-Serif;
font-size: 13px;
}

a {
color: #186f97;
text-decoration: none;
}

a:hover, a:active {
color: #000;
text-decoration: underline;
}

img.middle {
vertical-align: middle;
}

#container {
width: auto;
margin: auto auto;
text-align: left;
padding: 8px;
}

#panel {
background: #444;
color: #fff;
padding: 8px;
text-align: center;
font-size: 14px;
font-weight: bold;
}

#panel a {
color: #fff;
padding: 10px;
text-decoration: none;
}

#panel a:hover {
background: #333;
text-decoration: none;
}

#logo {
background: #23a0da url(images/mobile/gradient.png) bottom left repeat-x;
text-align: center;
padding: 8px;
text-shadow: 0 1px 0 #37b2eb;
font-size: 24px;
}

#logo a {
color: #09415b;
text-decoration: none;
}

#menu {
background: #1379a8;
color: #fff;
text-align: center;
padding: 7px;
font-size: 13px;
font-weight: bold;
text-shadow: 0 -1px 0 #095578;
}

#menu a {
color: #fff;
padding: 4px;
margin: 0 5px;
text-decoration: none;
}

table {
color: #000000;
font-family: Arial, Helvetica, Sans-Serif;
font-size: 14px;
}

.tborder {
width: 100%;
margin-bottom: 8px;
}

.thead {
background: #23a0da url(images/mobile/gradient.png) bottom left repeat-x;
color: #09415b;
padding: 4px 6px;
border-color: #1379a8;
border-style: solid;
border-width: 1px 1px 2px 1px;
text-shadow: 0 1px 0 #37b2eb;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
font-size: 13px;
}

.thead a {
color: #09415b;
text-decoration: none;
}

.tcat {
background: #444;
color: #fff;
padding: 4px 6px;

font-size: 12px;
}

.tcat a {
color: #fff;
}

.trow1, .trow2 {
border-bottom: 1px solid #ddd;
}

.trow3 {
background: #eee;
border-bottom: 1px solid #ddd;
padding: 4px;
}

.trow_shaded {
background: #ffdde0;
border-bottom: 1px solid #fcc;
}

.trow_selected td {
background: #FFFBD9;
}

.trow_sep {
background: #ddd;
color: #555;
padding: 4px;
text-align: center;

font-size: 12px;
font-weight: bold;
}

.tfoot {
background: #737373 url(images/mobile/gradient.png) bottom left repeat-x;
color: #fff;
border-color: #525252;
border-style: solid;
border-width: 2px 1px 1px 1px;
vertical-align: middle;
padding: 6px;
-moz-border-radius: 0 0 5px 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
text-shadow: 0 -1px 0 #333;
font-size: 12px;
}

.tfoot a {
color: #fff;
text-decoration: none;
}

.bottommenu {
background: #868686 url(images/mobile/gradient.png) bottom left repeat-x;
color: #fff;
border: 1px solid #545454;
padding: 7px;
text-transform: lowercase;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;

font-size: 13px;
font-weight: bold;
}

.bottommenu a {
color: #fff;
text-decoration: none;
}

.forumjump {
background: #9dbcca;
color: #444;
padding: 6px;
margin: 5px 0;
clear: both;
text-align: center;
border: 1px solid #7998a7;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}

.navigation {
background: #ccc;
color: #888;
border-bottom: 1px solid #c2c2c2;
text-align: left;
padding: 7px;

font-size: 14px;
}

.navigation a:link {
color: #444;
text-decoration: none;
}

.navigation a:visited {
color: #444;
text-decoration: none;
}

.navigation a:hover, .navigation a:active {
color: #444;
text-decoration: none;
}

.navigation .active {
color: #444;
font-weight: bold;
}

.smalltext {
font-size: 12px;
}

.largetext {
font-size: 15px;
font-weight: bold;
}

input.textbox {
background: #ddd;
color: #333;
border: 1px solid #444;
padding: 3px;
margin: 1px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;

font-size: 13px;
}

input.button {
background: #1f89e2 url(images/mobile/gradient.png) bottom left repeat-x;
color: #fff;
border: 1px solid #222;
padding: 5px 7px;
margin: 1px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;

font-family: Arial, Helvetica, Sans-Serif;
font-size: 12px;
font-weight: bold;
}

textarea {
background: #ddd;
color: #333;
border: 1px solid #444;
line-height: 1.4;
margin: 1px;
padding: 5px;
font-family: Arial, Helvetica, Sans-Serif;
font-size: 13px;
}

select {
background: #ddd;
color: #333;
border: 1px solid #444;
padding: 3px;
margin: 1px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
max-width: 75%;
font-size: 13px;
}

fieldset {
border: 1px solid #999;
padding: 6px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

.editor {
background: #f1f1f1;
border: 1px solid #ccc;
}

.autocomplete {
background: #fff;
border: 1px solid #000;
color: black;
}

.autocomplete_selected {
background: #adcee7;
color: #000;
}

.trow_reputation_positive {
background: #ccffcc;
}

.trow_reputation_negative {
background: #ffcccc;
}

.reputation_positive {
color: green;
}

.reputation_neutral {
color: #444;
}

.reputation_negative {
color: red;
}

.invalid_field {
background: #ea9697;
color: #962424;
border: 1px solid #bf3a3a;
padding: 3px;
margin: 1px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;

font-size: 13px;
}

.valid_field {
background: #9cea96;
color: #2c9624;
border: 1px solid #44bf3a;
padding: 3px;
margin: 1px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
font-size: 13px;
}

.validation_error {
background: url(images/invalid.gif) no-repeat center left;
color: #f30;
margin: 5px 0;
padding: 5px;
font-weight: bold;
font-size: 11px;
padding-left: 22px;
}

.validation_success {
background: url(images/valid.gif) no-repeat center left;
color: #00b200;
margin: 5px 0;
padding: 5px;
font-weight: bold;
font-size: 11px;
padding-left: 22px;
}

.validation_loading {
background: url(images/spinner.gif) no-repeat center left;
color: #555;
margin: 5px 0;
padding: 5px;
font-weight: bold;
font-size: 11px;
padding-left: 22px;
}

/* Additional CSS (Master) */
img {
border: none;
vertical-align: middle;
}

.clear {
clear: both;
}

.hidden {
display: none;
float: none;
width: 1%;
}

.float_left {
float: left;
}

.float_right {
float: right;
}

.menu ul {
list-style: none;
margin: 0;
}

.menu li {
display: inline;
padding-left: 5px;
}

img.attachment {
border: 1px solid #E9E5D7;
padding: 2px;
max-width: 50%;
max-height: 50%;
}

hr {
background-color: #000000;
color: #000000;
height: 1px;
border: 0px;
}

#copyright {
padding: 3px 8px 8px 8px;
text-align: center;
font-size: 11px;
}

blockquote {
background: #f2f2f2;
border: 1px solid #ccc;
margin: 0;
padding: 4px;
}

blockquote cite {
background: #daebff;
color: #021b3a;
border-bottom: 1px solid #ccc;
display: block;
margin: -4px -4px 4px -4px;
padding: 5px;
font-style: normal;
font-weight: bold;
}

blockquote blockquote cite {
background: #c2ffd2;
color: #033c12;
}

blockquote blockquote blockquote cite {
background: #f6d9ff;
color: #2e033c;
}

blockquote cite span {
float: right;
font-weight: normal;
}

blockquote cite span.highlight {
float: none;
font-weight: bold;
padding-bottom: 0;
}

.codeblock {
background: #f2f2f2;
border: 1px solid #ccc;
}

.codeblock .title {
background: #ffecc8;
color: #3a2702;
border-bottom: 1px solid #ccc;
padding: 5px;
font-weight: bold;
}

.codeblock code {
overflow: auto;
height: auto;
max-height: 200px;
display: block;
padding: 4px;
font-family: Monaco, Consolas, Courier, monospace;
font-size: 13px;
}

.subforumicon {
border: 0;
vertical-align: middle;
}

.separator {
margin: 5px;
padding: 0;
height: 0px;
font-size: 1px;
list-style-type: none;
}

form {
margin: 0;
padding: 0;
}

.autocomplete {
text-align: left;
}

.subject_new {
font-weight: bold;
}

.highlight {
background: #FFFFCC;
padding: 3px;
}

.pm_alert {
background: #FFF6BF url(images/mobile/gradient.png) bottom left repeat-x;
border: 1px solid #b79f18;
padding: 10px;
margin-bottom: 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
text-shadow: 1px 1px 0px #f4f0db;

font-size: 13px;
font-weight: bold;
}

.pm_alert a {
color: #b79f18;
}

.red_alert {
background: #FBE3E4 url(images/mobile/gradient.png) bottom left repeat-x;
color: #A5161A;
border: 1px solid #A5161A;
padding: 10px;
margin-bottom: 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
text-shadow: 1px 1px 0px #f1c9c9;
font-size: 13px;
}

.red_alert a {
color: #a5161a;
border-bottom: 1px dotted #a5161a;
}

.high_warning {
color: #CC0000;
}

.moderate_warning {
color: #F3611B;
}

.low_warning {
color: #AE5700;
}

div.error {
padding: 5px 10px;
border-top: 2px solid #FFD324;
border-bottom: 2px solid #FFD324;
background: #FFF6BF;
font-size: 12px;
}

div.error p {
margin: 0;
color: #000;
font-weight: normal;
}

div.error p em {
font-style: normal;
font-weight: bold;
padding-left: 24px;
display: block;
color: #C00;
background: url(images/error.gif) no-repeat 0;
}

div.error.ul {
margin-left: 24px;
}

.online {
color: #15A018;
}

.offline {
color: #C7C7C7;
}

.pagination {
background: #ddd;
border: 1px solid #aaa;
padding: 10px;
text-align: center;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
font-size: 11px;
}

.pagination .pages {
font-weight: bold;
}

.pagination_current, .pagination_a {
padding: 6px 12px;
margin-bottom: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
}

.pagination_a {
background: #158fc2 url(images/mobile/gradient.png) bottom left repeat-x;
color: #fff;
border: 1px solid #0b658b;
text-shadow: 0 -1px 0 #0b658b;

font-size: 11px;
font-weight: bold;
}

.pagination_current {
background: #d2d2d2 url(images/mobile/gradient.png) bottom left repeat-x;
color: #444;
border: 1px solid #999;
text-shadow: 0 1px 0 #eee;
font-weight: bold;
}

.pagination_a:hover {
background: #26a6db url(images/mobile/gradient.png) bottom left repeat-x;
color: #fff;
text-decoration: none;
}

.success_message {
color: #00b200;
font-weight: bold;
font-size: 10px;
margin-bottom: 10px;
}

.error_message {
color: #C00;
font-weight: bold;
font-size: 10px;
margin-bottom: 10px;
}

.quick_jump {
background: url(images/jump.gif) no-repeat 0;
width: 13px;
height: 13px;
padding-left: 13px; /* amount of padding needed for image to fully show */
vertical-align: middle;
border: none;
}

/* Button CSS */
div.big_button {
padding: 10px 0 15px 0;
}

a.big_button {
background: #14aea8 url(images/mobile/gradient.png) bottom left repeat-x;
color: #023836;
padding: 9px;
border: 1px solid #0a7c78;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
text-shadow: 0 1px 0 #25c5bf;
font-size: 13px;
font-weight: bold;
}

a.big_button_closed {
background: #b84c4c url(images/mobile/gradient.png) bottom left repeat-x;
color: #461010;
padding: 9px;
border: 1px solid #760202;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
text-shadow: 0 1px 0 #e35e5e;
font-size: 13px;
font-weight: bold;
}

/* Redirect CSS */
.redirect_title {
background: #23a0da url(images/mobile/gradient.png) bottom left repeat-x;
color: #09415b;
border-bottom: 1px solid #0a7c78;
padding: 6px 8px;
text-align: left;
text-shadow: 0 1px 0 #37b2eb;

font-size: 14px;
font-weight: bold;
}

.redirect_body {
padding: 8px;
text-align: left;
}

.redirect_nowait {
background: #eee;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
padding: 6px;
text-align: center;

font-size: 12px;
}

.subforum {
padding-top: 3px;
font-size: 11px;
}

a.lastpost {
color: #606060;
white-space: nowrap;
text-decoration: none;
font-weight: bold;
}

a.lastpost img {
margin-top: -2px;
}

.lastbytext {
color: #888;
font-size: 11px;
}

.modbox {
background: #efe4a5;
border: 1px solid #ac9e54;
padding: 6px;
clear: both;
text-align: center;
margin-top: 5px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
}

.hiddenrow {
display: none;
}

.selectall {
background: #dac96a;
text-align: center;
}

#breadcrumb_multipage {
display: none;
}

/* Post Styles */
.post_author {
background: #b2b2b2;
color: #111;
padding: 5px;

font-size: 14px;
font-weight: bold;
}

.portal_avatar img {
width: 20px;
height: 20px;
}

.post_ignored {
background: #ffdde0;
color: #111;
border: 1px solid #fcc;
padding: 5px;
text-align: center;

font-size: 13px;
font-weight: bold;
}

.post_author a,
.post_ignored a {
color: #111;
text-decoration: underline;
}

.post_avatar {
width: 20px;
height: 20px;
}

.post_body {
background: #fff;
border: 1px solid #b2b2b2;
margin-bottom: 6px;
}

.post_manage {
background: #dedede;
padding: 4px;
text-align: center;

font-size: 12px;
}

.post_manage a.button {
color: #444;
padding: 4px;
margin: 0 2px;
}

.post_content {
padding: 8px;
overflow: auto;
}

.post_attachments {
background: #eee;
color: #888;
border: 1px solid #bbb;
margin: 0 5px 5px 5px;
padding: 5px;
}

.datetime {
color: #fff;
padding-top: 2px;
font-weight: normal;
}

/* Adjust for maximum posted image width */
.post_content img {
max-width: 50%;
}

.lastpost img {
height: 10px;
width: 10px;
margin-top: -2px;
vertical-align: middle;
}

a.tclosed_1 {
color: #bb0000;
}

a.forum_on,
a.forum_minion {
color: #186f97;
}

a.forum_off,
a.forum_minioff {
color: #606060;
font-weight: normal;
}

a.forum_offlock,
a.forum_miniofflock {
color: #a42d16;
font-weight: normal;
}

td.forum_on {
background: #e5fbfb;
border-bottom: 1px solid #a9cbde;
}

.garis {
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
border-right: 1px solid #ddd;
border-left: 1px solid #ddd;
}

itulah tutorial cara membuat guestbook paling ringan dan sederhana.
untuk live demo, klik di sini -> KLIK
untuk skripnya , bisa di unduh lewat sini -> KLIK
semoga bermanfaat, dan tunggu updetan selanjutnya.

(0 Komentar) | (Tambah Komentar)
[<<] [>>]
© Faine 2023 - 2024