PHP MySQL Ecommerce Web Design Part 7
Postingan saya kali ini adalah membuat halaman clothing_prod.php beserta file-file yang berhubungan dengannya
1. Buat file .PHP dengan nama clothing_prod.php di D:\TUTOR WEB\RIANKLIK\
Buka Notepad++, pilih File, klik Open, cari file clothing_prod.php di D:\TUTOR WEB\RIANKLIK\. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :<?php
session_start(); //start session first thing in script
// Connect to the mySQL database
include "phpScripts/connect_to_mysql.php";
// Error Reporting
error_reporting(E_ALL);
ini_set('display_errors','1');
?>
<?php
// Check to see the URL variable is set and that it exists in the database
if(isset($_GET['id'])){
$id=preg_replace('#[^0-9]#i','',$_GET['id']);
// Use this var to check to see if this ID exists,
// if yes then get the product
// details, if no then exit this script and give message why
$sql=mysql_query("SELECT*FROM clothing WHERE id='$id' LIMIT 1");
$productCount=mysql_num_rows($sql); // count the output amount
if($productCount>0){
// get all the product details
while($row=mysql_fetch_array($sql)){
$product_name=$row["product_name"];
$product_price=$row["product_price"];
$product_brand=$row["product_brand"];
$category=$row["category"];
$subcategory=$row["subcategory"];
$type=$row["type"];
$color=$row["color"];
$size=$row["size"];
$bahan=$row["bahan"];
$product_details=$row["product_details"];
$designCategory=$row["designCategory"];
$date_added=strftime("%b %d, %y", strtotime($row["date_added"]));
// dipakai untuk star rating
$sqlStock=mysql_query("SELECT*FROM clothingStock
WHERE product_name='$product_name' LIMIT 1");
while($row=mysql_fetch_array($sqlStock)) {
$product_nameS=$row["product_name"];
}
} // closing while ...
}else{
echo "that item does not exists";
exit();
} // closing if ...
}else{
echo "Data to render this page is missing.";
exit();
}
?>
<?php
//////////////// dropdown color from stockClothing table////////////////////////
$stock_color = mysql_query("SELECT DISTINCT COLOR FROM clothingStock
WHERE product_name='$product_name'");
$color = array();
while($row = mysql_fetch_row($stock_color)){
$color[] = $row[0];
}
$size="";
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form1') {
$colorP=mysql_real_escape_string($_POST['color']);
$_SESSION['colorP']=$colorP;
//////// dropdown size from stockClothing jika ada POST form_type ==form1//////
$sizeCheck = mysql_query("SELECT size FROM clothingStock
WHERE product_name='$product_name' AND color='$colorP'");
$sizeCount=mysql_num_rows($sizeCheck); // count the output amount
if($sizeCount>0){
$stock_size = mysql_query("SELECT DISTINCT SIZE FROM clothingStock
WHERE product_name='$product_name' AND color='$colorP'");
$size = array();
while($row = mysql_fetch_row($stock_size)){
$size[] = $row[0];
}
}
////////// stock_id from stockClothing jika ada POST form_type ==form1///////////
$stockSS = mysql_query("SELECT stock_id FROM clothingStock
WHERE product_name='$product_name' AND color='$colorP'");
while($row=mysql_fetch_array($stockSS)){
$stock_idSS=$row["stock_id"];
}
}else if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2') {
if (isset($_SESSION['colorP'])){
$colorP=$_SESSION['colorP'];
$sizeP=mysql_real_escape_string($_POST['size']);
$_SESSION['sizeP']=$sizeP;
// See if that name is an identical match to another product in the system
$sqlstock=mysql_query("SELECT * FROM clothingStock
WHERE product_name='$product_name' AND color='$colorP' AND size='$sizeP' ");
while($row=mysql_fetch_array($sqlstock)){
$stock_id=$row["stock_id"];
$stock_amount=$row["stock_amount"]>=5;
}
// DIBAWAH INI ADA LAGI dropdown size from stockClothing table
// KARENA setelah POST form_type ==form2, SIZE bermasalah
//////// dropdown size from stockClothing jika ada POST form_type ==form2////////
$stock_size = mysql_query("SELECT DISTINCT SIZE FROM clothingStock
WHERE color='$colorP'");
$size = array();
while($row = mysql_fetch_row($stock_size)){
$size[] = $row[0];
}
}// closing if ...
} // closing if ...
?>
<!----------------------- LIKE & DISLIKE ------------------------------>
<?php
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2') {
include_once("clothing_like_dislike.php");
}else{
}
?>
<!-------------------- END of LIKE & DISLIKE -------------------------->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?php echo $product_name; ?></title>
<!------------------------- LINK ---------------------------->
<?php include_once("template_links_head.php"); ?>
<!-------------------- END of LINK -------------------------->
<!------------------- LINK FREE BEAVER SLIDER --------------------->
<?php include_once("template_js_beaverSlider_slideshow.php"); ?>
<!------------- END of LINK FREE BEAVER SLIDER ------------------->
</head>
<body>
<div id="wrapper">
<div id="header_wrap">
<div id="header">
<?php include_once("template_clothingHeader.php"); ?>
</div> <!----closing header------>
<?php include_once("clothing_searchWrap.php"); ?>
</div> <!----closing header_wrap------>
<div id="contentProd">
<br />
<center><h1><?php echo $product_name; ?></h1></center>
<div id="prodthumb1" align="left">
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form1' )
// maka image memakai clothing_stock_images sesuai pilihan color
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form1' ){
?>
<a href="clothing_stock_images1/<?php echo $stock_idSS; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery">
<img src="clothing_stock_images1/
<?php echo $stock_idSS; ?>.jpg"width="320" height="320" alt="img4"
style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form2' )
// maka image memakai clothing_stock_images sesuai pilihan color
}else if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2' ){
?>
<a href="clothing_stock_images1/<?php echo $stock_id; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>"class="swipebox" rel="img_gallery" >
<img src="clothing_stock_images1/<?php echo $stock_id; ?>.jpg"
width="320" height="320" alt="img4" style="border-color:#D6D6F3;
border-style:solid; border-width:1px" />
</a>
<?php
// jika tidak ada $_POST['form_type']) maka image dari clothing_images
}else{
?>
<a href="clothing_images1/<?php echo $id; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img src="clothing_images1/
<?php echo $id; ?>.jpg" width="320" height="320" alt="img4" style="border-color:#D6D6F3;
border-style:solid; border-width:1px" />
</a>
<?php
} // closing if ...
?>
<div id="prodoverlay1">
<div id="prodPrice" style="font-size:30px; font-family:'Lucida Sans Unicode',
'Lucida Grande', sans-serif">
Rp. <?php echo number_format($product_price,0,',','.'); ?>
</div>
<br />
<div>
<?php
// untuk menampilkan star rating
// jika ada POST['form_type'] dan $_POST['form_type'] == 'form2'
// maka star rating akan terlihat
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2' ){
if (isset($_SESSION['colorP'])){
$colorP=$_SESSION['colorP'];
}
if (isset($_SESSION['sizeP'])){
$sizeP=$_SESSION['sizeP'];
}
include("clothing_prod_starRating.php");
include("clothing_prodStar_img.php");
} // closing if ...
?>
</div>
<a class="kecil" href="#" ><?php echo $product_brand?> </a>
<a class="kecil" href="#" ><?php echo $bahan?> </a>
<a class="kecil" href="#" ><?php echo $category?></a>
<a class="kecil" href="#" ><?php echo $subcategory?></a>
<br />
<!------------------- LIKE & DISLIKE HYPERLINK ICON ---------------------->
<?php
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2') {
?>
<div id="like_dislike_wrap" style="font-size:13px">
<div class="likeBtn">
<?php echo $rate_like_count; ?>
<a href="#" id="besar" class="like-btn
<?php if($like_count == 1){ echo 'like-h';} ?>">
<img class="likedislike" src="svg_images/thumbs-up.svg"
width="14" height="14" />Suka
</a>
</div>
<div class="dislikeBtn">
<?php echo $rate_dislike_count; ?>
<a href="#" class="dislike-btn
<?php if($dislike_count == 1){ echo 'dislike-h';} ?>">
<img src="svg_images/thumbs-up2.svg"
width="14" height="14" />Tidak
</a>
</div>
</div>
<?php
}else{
?>
<?php
} // closing if ...
?>
<!----------- END of LIKE & DISLIKE HYPERLINK ICON ------------------------>
<br />
<!----------------------- COLOR ------------------------------>
<?php
// jika ada POST['form_type'] dan $_POST['form_type'] == 'form2'
// maka pilihan color akan hilang
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2' ){
} else {
?>
<form method="post" action="clothing_prod.php?id=<?php echo $id; ?>">
<?php
// jika color dari tabbel stockClothing tidak ada insinya/kosong
// maka tampilkan: out of stock
if(count($color) <= 0){
?>
<button>
<span style="color:#F00; font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif">
Out of Stock!
</span>
</button>
<?php
}else{
// tapi jika color dari tabel stockColor ada isinya maka tampilkan:
?>
Color:
<?php
// jika <=0 tampilkan kosong
if(count($color) <= 0){
//echo '---';
} else {
// tapi jika >0 tampilkan dropdown color
echo '<select name="color" id="color"
style="font-size:15px; width: 100px; font-family:Trebuchet MS,
Arial, Helvetica, sans-serif">';
foreach($color as $color)
echo "<option style='font-size:15px; font-family:Trebuchet MS,
Arial, Helvetica, sans-serif'>$color</option>";
echo '</select>';
} // closing if ...
?>
<input type="hidden" name="form_type" value="form1">
<input type="submit" name="colorUp" id="colorUp" value="OK"
style="font-size:13px; color:#F00; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif"/>
<?php
} // closing if ...
?>
</form>
<?php
} // closing if ...
?>
<!----------------------- END of COLOR ------------------------->
<!----------------------- SIZE ------------------------------>
<?php
// jika tidak ada $_POST['form_type'])
// maka size dan pilihannya tidak tampak
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form1' ){
?>
<form method="post" action="clothing_prod.php?id=<?php echo $id; ?>">
Size:
<?php
// jika <=0 tampilkan kosong
if(count($size) <=0){
echo '---';
} else {
// tapi jika >0 tampilkan dropdown size
echo '<select name="size" id="size" style="font-size:15px;
width: 60px; font-family:Trebuchet MS, Arial, Helvetica, sans-serif">';
foreach($size as $size)
echo "<option style='font-size:15px; font-family:Trebuchet MS, Arial,
Helvetica, sans-serif'>$size</option>";
echo '</select>';
} // closing if ...
?>
<?php
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2'
|| count($size) <=0 ){
// jika ada $_POST['sizeUp'] atau $size tidak ada isinya
// dan jika $stock_amount tidak kosong atau bukan nol maka button OK hilang
if(!empty ($stock_amount)|| $stock_amount !=0 || $stock_amount>0 ) {
?>
<?php
}else{
?>
<input type="hidden" name="form_type" value="form2">
<input type="submit" name="sizeUp" id="sizeUp" value="OK"
style="font-size:13px; color:#F00; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif"/>
<?php
}
?>
<?php
}else{
?>
<input type="hidden" name="form_type" value="form2">
<input type="submit" name="sizeUp" id="sizeUp" value="OK"
style="font-size:13px; color:#F00; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif"/>
<?php
} // closing if ...
?>
</form>
<?php
}else{
?>
<?php
}
?>
<!----------------------- END of SIZE ------------------------------>
<!----------------------- COLOR & SIZE PILIHAN --------------------->
<?php
// jika ada POST['form_type'] dan $_POST['form_type'] == 'form2'
// maka color dan size yang dipilih tampil
// jika ada POST['form_type'] dan $_POST['form_type'] == 'form2'
// maka button Unset akan terlihat
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2' ){
?><br />
<form id="button" name="button" method="post"
action="clothing_prod.php?id=<?php echo $id; ?>">
<?php
echo 'Color: ';
echo $colorP;
echo ' ';
echo ' ';
echo 'Size: ';
echo $sizeP;
echo ' ';
echo ' ';
?>
<input type="submit" name="button" id="button" value="Unset"
style="font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif"/>
</form>
<?php
}else {
} // closing if ...
?>
<!------------------- END of COLOR & SIZE PILIHAN --------------------------->
<br />
Produk Details : <br />
<font style="font-style:italic">
<?php echo $product_details; ?>
</font>
<br />
<br />
<!------------ SUBMIT BUTTON / ADD TO CART BUTTON --------------------------->
<?php
// jika ada $_POST['form_type']) && $_POST['form_type'] == 'form2'
// dan jika $stock_amount tidak kosong atau nol maka tampilkan ADD TO CART
// tapi jika tidak maka tampilkan "out of stock"
// dan jika ada $_POST['form_type']) && $_POST['form_type'] == 'form1'
// tampilkan "pilih size dulu". jika tidak maka
// tampilkan "pilih color dulu"
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2'){
if(!empty ($stock_amount) || $stock_amount!=0 || $stock_amount>0 ){
?>
<form id="form1" name="form1" method="post" action="clothing_cart.php">
<input type="hidden" name="pid" id="pid" value="<?php echo $stock_id; ?>" />
<input type="submit" name="button" id="button" value="ADD TO CART"
style="font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif"/>
</form>
<?php
}else{
?>
<button>
<span style="color:#F00; font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif">Out of Stock!</span>
</button>
<?php
} // closing if ...
?>
<?php
} else
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form1'){
?>
<button id="pilihsize">
<span style="color:#F00; font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif">Pilih Size!</span>
</button>
<?php
}else
if (count($color) <= 0){
?>
<button>
<span style="color:#F00; font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif">No Color listed!</span>
</button>
<?php
}else{
?>
<button id="pilihcolor">
<span style="color:#F00; font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif">Pilih Color dulu!</span>
</button>
<?php
} // closing
?>
<!---------- END of SUBMIT BUTTON / ADD TO CART BUTTON --------------->
</div><!--END prodoverlay1-->
<div id="prodoverlay2">
</div><!--END prodoverlay2-->
<div id="prodoverlay3">
<span style="color:#000; font-size:15px; font-family:'Trebuchet MS',
Arial, Helvetica, sans-serif; background-color:#9CF">
<?php
if (isset($_POST['form_type'])){
?>
Color:
<?php
echo $colorP;
?>
<?php
}else{
?>
<?php
} // closing if ...
?>
<br />
<?php
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2'){
?>
Size:
<?php
echo $sizeP;
?>
<?php
}else{
?>
<?php
} // closing if ...
?>
</span>
</div><!--END prodoverlay3-->
<!----------------------- THUMB IMAGE PERTAMA ------------------------------>
<div id="prodoverlay4">
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form1' )
// maka image memakai clothing_stock_images sesuai pilihan color
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form1' ){
?>
<a href="clothing_stock_images1/<?php echo $stock_idSS; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" ><img class="one-edge-shadow" src="clothing_stock_images1/<?php echo $stock_idSS; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4"
style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form2' )
// maka image memakai clothing_stock_images sesuai pilihan color
}else if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2' ){
?>
<a href="clothing_stock_images1/<?php echo $stock_id; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_stock_images1/<?php echo $stock_id; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3;
border-style:solid; border-width:1px" />
</a>
<?php
// jika tidak ada $_POST['form_type']) maka image dari clothing_images
}else{
?>
<a href="clothing_images1/<?php echo $id; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_images1/<?php echo $id; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
} // closing if ...
?>
</div><!--END prodoverlay4-->
<!--------------------- END of THUMB IMAGE PERTAMA ------------------------>
<!----------------------- THUMB IMAGE KEDUA ------------------------------>
<div id="prodoverlay5">
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form1' )
// maka image memakai clothing_stock_images sesuai pilihan color
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form1' ){
?>
<a href="clothing_stock_images2/<?php echo $stock_idSS; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_stock_images2/<?php echo $stock_idSS; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form2' )
// maka image memakai clothing_stock_images sesuai pilihan color
}else if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2' ){
?>
<a href="clothing_stock_images2/<?php echo $stock_id; ?>.jpg"
title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_stock_images2/<?php echo $stock_id; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
// jika tidak ada $_POST['form_type']) maka image dari clothing_images
}else{
?>
<a href="clothing_images2/<?php echo $id; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_images2/<?php echo $id; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
} // closing if ...
?>
</div><!--END prodoverlay5-->
<!----------------------- END of THUMB IMAGE KEDUA ------------------------------>
<!----------------------- THUMB IMAGE KETIGA ------------------------------>
<div id="prodoverlay6">
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form1' )
// maka image memakai clothing_stock_images sesuai pilihan color
if (isset($_POST['form_type']) && $_POST['form_type'] == 'form1' ){
?>
<a href="clothing_stock_images3/<?php echo $stock_idSS; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_stock_images3/<?php echo $stock_idSS; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
// jika ada isset($_POST['form_type']) && $_POST['form_type'] == 'form2' )
// maka image memakai clothing_stock_images sesuai pilihan color
}else if (isset($_POST['form_type']) && $_POST['form_type'] == 'form2' ){
?>
<a href="clothing_stock_images3/<?php echo $stock_id; ?>.jpg"
title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_stock_images3/<?php echo $stock_id; ?>.jpg" -rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
// jika tidak ada $_POST['form_type']) maka image dari clothing_images
}else{
?>
<a href="clothing_images3/<?php echo $id; ?>.jpg" title=" <h2><?php echo $product_name; ?></h2>" class="swipebox" rel="img_gallery" >
<img class="one-edge-shadow" src="clothing_images3/<?php echo $id; ?>.jpg" rel="img_gallery" width="100" height="100" alt="img4" style="border-color:#D6D6F3; border-style:solid; border-width:1px" />
</a>
<?php
} // closing
?>
</div><!--END prodoverlay6-->
<!----------------------- END of THUMB IMAGE KETIGA ------------------------------>
</div><!--END prodthumb1-->
</div><!--END contentProd-->
<div id="footer">
<?php include_once("template_footer.php"); ?>
</div> <!----closing footer------>
</div> <!----closing wraper------>
<?php include_once("template_js_body.php"); ?>
</body>
</html>
CATATAN:
Seperti pada gambar dibawah, kalian bisa menuliskan secara memanjang ke kanan tanpa harus dipotong dengan spasi.
Jangan sampai warna berubah menjadi hitam seperti gambar dibawah, karena kemungkinan akan terjadi error
2. Buat file .PHP dengan nama clothing_like_dislike.php di D:\TUTOR WEB\RIANKLIK\
Buka Notepad++, pilih File, klik Open, cari file clothing_like_dislike.php di D:\TUTOR WEB\RIANKLIK\. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :
<?php
// Connect to the mySQL database
include "phpScripts/connect_to_mysql.php";
$user_ip = $_SERVER['REMOTE_ADDR'];
//$pageID = '33'; // The ID of the page, the article or the video ...
//$pageID = $id;
$pageID = $id;
//function to calculate the percent
function percent($num_amount, $num_total) {
if ($num_amount >0){ // tambahan untuk menghindari zero division
$count1 = $num_amount / $num_total;
$count2 = $count1 * 100;
$count = number_format($count2, 0);
return $count;
} // untuk menghindari zero division
}
// check if the user has already clicked on the unlike (rate = 2)
// or the like (rate = 1)
$dislike_sql = mysql_query('SELECT COUNT(*) FROM clothingRating
WHERE ip = "'.$user_ip.'" and id = "'.$pageID.'" and rate = 2 ');
$dislike_count = mysql_result($dislike_sql, 0);
$like_sql = mysql_query('SELECT COUNT(*) FROM clothingRating
WHERE ip = "'.$user_ip.'" and id = "'.$pageID.'" and rate = 1 ');
$like_count = mysql_result($like_sql, 0);
// count all the rate
$rate_all_count = mysql_query('SELECT COUNT(*) FROM clothingRating
WHERE id = "'.$pageID.'"');
$rate_all_count = mysql_result($rate_all_count, 0);
$rate_like_count = mysql_query('SELECT COUNT(*) FROM clothingRating
WHERE id = "'.$pageID.'" and rate = 1');
$rate_like_count = mysql_result($rate_like_count, 0);
$rate_like_percent = percent($rate_like_count, $rate_all_count);
$rate_dislike_count = mysql_query('SELECT COUNT(*) FROM clothingRating
WHERE id = "'.$pageID.'" and rate = 2');
$rate_dislike_count = mysql_result($rate_dislike_count, 0);
$rate_dislike_percent = percent($rate_dislike_count, $rate_all_count);
?>
3. Buat file .PHP dengan nama clothing_prod_starRating.php di D:\TUTOR WEB\RIANKLIK\
Buka Notepad++, pilih File, klik Open, cari file clothing_prod_starRating.php di D:\TUTOR WEB\RIANKLIK\. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :
<?php
$sqltotalSale = mysql_query("SELECT*FROM clothingTotalSales
WHERE product_name='$product_nameS' AND color='$colorP'
AND size='$sizeP' ");
while($row=mysql_fetch_array($sqltotalSale)){
// tambahan untuk hilangkan error saat tabel kosong
if (!empty($sqltotalSale)){
$quantity=$row["quantity"];
}
if ($quantity >=0 && $quantity <=10){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='0-10'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=11 && $quantity <=20){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='11-20'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=21 && $quantity <=30){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='21-30'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=31 && $quantity <=40){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='31-40'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=41 && $quantity <=50){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='41-50'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=51 && $quantity <=60){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='51-60'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=61 && $quantity <=70){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='61-70'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=71 && $quantity <=80){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='71-80'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=81 && $quantity <=90){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='81-90'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=91 && $quantity <=100){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='91-100'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else
if ($quantity >=101){
$sqlStar = mysql_query("SELECT * FROM starRating
where rating='>101'");
while($row=mysql_fetch_array($sqlStar)){
if (!empty($sqlStar)){
$s_id=$row["s_id"];
}
}
}else{
}// closing if ...
} // closing while ...
?>
4. Buat file .PHP dengan nama clothing_prodStar_img.php di D:\TUTOR WEB\RIANKLIK\
Buka Notepad++, pilih File, klik Open, cari file clothing_prodStar_img.php di D:\TUTOR WEB\RIANKLIK\. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :
<?php
if (!empty($sqlStar)){
// memeriksa apa ada product_name di dalam tabel clothingTotalSales
$sqlCheck1=mysql_query("SELECT sale_id FROM clothingTotalSales
WHERE product_name='$product_name' LIMIT 1");
$productMatch=mysql_num_rows($sqlCheck1); // Count the output amount
if($productMatch > 0){
?>
<img src="star_images/<?php if (!empty($s_id)){ echo $s_id; } ?>.svg"
width="100" height="25"/>
<?php
} else {
} // closing if ...
} else {
?>
<?php
} // closing if ...
?>
5. Buat file .PHP dengan nama create_starRating_table.php di dalam folder phpScripts
Buka Notepad++, pilih File, klik Open, cari file create_starRating_table.php di dalam folder phpScripts. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :
<?php
// connect to your MySQL database here
require "connect_to_mysql.php";
// Create an sql command structure for creating a table
$sqlCommand = "CREATE TABLE starRating (
s_id int(11) NOT NULL auto_increment,
rating varchar(16) NOT NULL,
date_added date NOT NULL,
PRIMARY KEY (s_id)
)ENGINE = InnoDB";
if (mysql_query($sqlCommand)){
echo "Your starRating table has been created successfully!";
} else {
echo "CRITICAL ERROR: starRating table has not been created.";
}
?>
6. Buat file .PHP dengan nama create_clothingRating_table.php di dalam folder phpScripts
Buka Notepad++, pilih File, klik Open, cari file create_clothingRating_table.php di dalam folder phpScripts. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :
<?php
// connect to your MySQL database here
require "connect_to_mysql.php";
// Create an sql command structure for creating a table
$sqlCommand = "CREATE TABLE clothingRating (
r_id int(11) auto_increment,
id int(11) NOT NULL,
ip varchar(24) NOT NULL,
rate int(1) NOT NULL,
date_added date NOT NULL,
PRIMARY KEY (r_id)
) ENGINE = InnoDB";
if (mysql_query($sqlCommand)){
echo "Your clothingRating table has been created successfully!";
} else {
echo "CRITICAL ERROR: clothingRating table has not been created.";
}
?>
7. Buat file .PHP dengan nama insert_star_rating.php di dalam folder phpScripts
Buka Notepad++, pilih File, klik Open, cari file insert_star_rating.php di dalam folder phpScripts. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :
<?php
// connect to your MySQL database here
require "connect_to_mysql.php";
// Create an sql command structure for creating a table
$sqlCommand =
"INSERT INTO starRating
(s_id, rating, date_added)
VALUES
('1' ,'0-10', now()),
('2' ,'11-20', now()),
('3' ,'21-30', now()),
('4' ,'31-40', now()),
('5' ,'41-50', now()),
('6' ,'51-60', now()),
('7' ,'61-70', now()),
('8' ,'71-80', now()),
('9' ,'81-90', now()),
('10','91-100', now()),
('11','>101', now())
";
if (mysql_query($sqlCommand)){
echo "Your star rating has been inserted successfully!";
} else {
echo "CRITICAL ERROR: star rating has not been inserted.";
}
?>
8. Buat folder dengan nama star_images di D:\TUTOR WEB\RIANKLIK\
Buatlah gambar gambar bintang dengan ukuran 2550 x 473 px atau ukuran lain yang kira kira bisa serupa dengan 11 gambar diatas. Urutannya adalah 0star, 0-5star, 1star, 1-5star, 2star, 2-5star, 3star, 3-5star, 4star, 4-5star, 5star. Kemudian dengan aplikasi Vector Magic rubah .PNG menjadi .SVG
Rubah nama file menjadi 0star.png=1.svg, 0-5star.png=2.svg,1star.png=1.svg dst
9. Buka Notepad++, pilih File, klik Open, cari file style.php di dalam folder styleCSS. Isikan sama seperti script warna biru di bawah lalu jangan lupa di-save :
/*--------------- product----------------- */
#contentProdA {
-moz-border-radius: 8px 8px 8px 8px; /* for Firefox */
-webkit-border-radius: 8px 8px 8px 8px; /* for Webkit-Browsers */
border-radius: 8px 8px 8px 8px; /* regular */
width: 800px;
margin-right: auto;
margin-left: auto;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
position: relative;
overflow: hidden;
padding: 0px;
}
#contentProd1 {
-moz-border-radius: 8px 8px 8px 8px; /* for Firefox */
-webkit-border-radius: 8px 8px 8px 8px; /* for Webkit-Browsers */
border-radius: 8px 8px 8px 8px; /* regular */
width: 358px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
position: relative;
overflow: hidden;
padding: 15px;
float: left;
margin: 5px;
border: 1px solid #CCC;
}
#contentProd2 {
-moz-border-radius: 8px 8px 8px 8px; /* for Firefox */
-webkit-border-radius: 8px 8px 8px 8px; /* for Webkit-Browsers */
border-radius: 8px 8px 8px 8px; /* regular */
width: 358px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
position: relative;
display: block;
overflow: hidden;
padding: 15px;
float: left;
margin: 5px;
border: 1px solid #CCC;
}
#contentProd {
width: 868px;
margin-right: auto;
margin-left: auto;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
position: relative;
display: block;
overflow: hidden;
padding-right: 45px;
padding-left: 45px;
padding-bottom: 45px;
border: 1px solid #CCC;
background-color: #FFF;
}
#prodthumb1 {
height: 320px;
width: 820px;
float: left;
position: relative;
padding: 20px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 20px;
margin-left: 0px;
}
#prodoverlay1 {
height: 300px;
width: 320px;
text-align: left;
color: #000;
position: absolute;
right: 20px;
bottom: 17px;
z-index: 10;
padding-top: 5px;
padding-right: 20px;
padding-bottom: 20px;
padding-left: 20px;
}
#prodoverlay2 {
height: 282px;
width: 320px;
text-align: left;
color: #FFF;
position: absolute;
opacity: .2;
padding: 20px;
right: 20px;
bottom: 17px;
}
#prodoverlay3 {
height: 40px;
width: 200px;
text-align: left;
color: #000;
position: absolute;
padding: 0px;
right: 630px;
bottom: 30px;
z-index: 100;
}
#prodoverlay4 {
height: 110px;
width: 110px;
text-align: left;
color: #000;
position: absolute;
padding: 0px;
right: 400px;
z-index: 100;
top: 20px;
}
#prodoverlay5 {
height: 110px;
width: 110px;
text-align: left;
color: #000;
position: absolute;
padding: 0px;
right: 400px;
z-index: 100;
top: 130px;
}
#prodoverlay6 {
height: 110px;
width: 110px;
text-align: left;
color: #000;
position: absolute;
padding: 0px;
right: 400px;
z-index: 100;
top: 240px;
}
/*--------------- like & dislike----------------- */
.likeBtn{
height: 25px;
width: auto;
float: left;
padding-right: 5px;
padding-left: 5px;
}
.likeBtn:hover{
background-color: #CCC;
}
.dislikeBtn{
height: 25px;
width: auto;
float: left;
padding-right: 5px;
padding-left: 5px;
margin-left: 10px;
}
.dislikeBtn:hover{
background-color: #CCC;
}
10. Upload semua file dan folder ke web server
11. Buka dengan browser 192.168.88.111/phpScripts/, klik file dengan nama create_ dulu baru kemudian file dengan nama insert_
12. Buka dengan browser 192.168.88.111
Dari halaman index.php, pada bagian header, klik Pria lalu pilih Pakaian, pilih produk/T-shirt dengan nama RK_00001 lalu klik tombol dengan ikon gambar keranjang disebelah kanan nominal harga
Masuk halaman clothing_prod.php
cprod_1 sampai cprod_3
Seperti pada tiga gambar diatas, produk RK_00001 ada 3 variasi yaitu warna merah ukuran M, warna biru ukuran M, dan warna biru ukuran L. Harusnya gambar design di T-shirt tersebut sama semua tapi karena hanya contoh saja maka abaikan saja gambarnya/anggap saja sama.
Sampai disini inilah tampilan halaman clothing_prod.php. Banyaknya pilihan warna tergantung dari stock (pada tutorial ini pilihan warna hanya ada 5 dan pilihan ukuran ada 4, jika semua warna dan ukuran tersebut kita stock semua maka untuk satu produk saja totalnya ada 20 pilihan variasi).
Comments
Post a Comment