Hướng dẫn php price - giá php

Source code bán hàng điện tử được phát triển bằng PHP & MySQL, html, ajax, jquery, javascript. Bạn có thể sử dụng nguồn này để bắt đầu xây dựng dự án  mới, nó có thể giúp bạn tiết kiệm thời gian.

Chức năng nổi bật

>> Trang chủ

– Giới thiệu sản phẩm

– Khách hàng đăng ký, đăng nhập, quản lý thông tin cá nhân như lịch sử mua hàng, đơn hàng
nhân như lịch sử mua hàng, đơn hàng

– Giỏ hàng

– Thêm yêu thích

>> Quản trị viên

– Quản lý sản phẩm

– Quản lý đơn hàng

– Quản lý khách hàng

* Cách cài đặt 

– Yêu cầu web server : PHP version in server >= PHP5.6, MySQL 5.x.

– Tải về source code, giải nén giải nén và copy vào source code thư mục trên web server;

– Truy cập phpmyadmin tạo mới một database, sau đó import database shopping.sql. đươc chia sẻ trong source code.
chia sẻ trong source code.

– Cấu hình hostname, username, password và database trong file includes/config.php và admin/includes/config.php

– Hoàn thành;

– Link trang chủ //localhost/project_name (ex: //localhost/shopping)

– Link trang quản trị //localhost/project_name/admin (ex: //localhost/shopping/admin)

Tài khoản đăng nhập mặc định

User Name : admin

Password : 123456

Demo Download

Vietnamese (Tiếng Việt) translation by Dai Phong (you can also view the original English article) Dai Phong (you can also view the original English article)

Trong video + bài hướng dẫn của tuần này, chúng tôi sẽ hướng dẫn bạn cách xây dựng giỏ hàng của riêng bạn bằng PHP và MySQL. Như bạn sẽ thấy, nó không quá khó như bạn nghĩ.
bạn bằng PHP và MySQL. Như bạn sẽ thấy, nó không quá khó như bạn nghĩ.

Video Xem trước

  • Video Xem trước
  • Bước 1
  • Bước 2
  • Video Hướng dẫn Đầy đủ
  • Bước 3
  • Bước 4
  • Bước 5
  • Bước 6
  • Bước 7
  • Bước 8
  • Bước 9
  • Bước 10

Bước 1

Bước 2

Video Hướng dẫn Đầy đủ

  • Bước 3 – bạn có thể lấy css reset từ liên kết này
  • Bước 4 – tập tin css mà chúng ta sẽ sử dụng để định
    phong cách cho code HTML của chúng ta
  • Bước 5 – tập tin này sẽ tạo kết nối tới cơ sở dữ liệu của chúng ta
  • Bước 6 – template cho giỏ hàng của chúng ta
  • Bước 7 – tập tin nơi chúng ta sẽ có thể thay đổi các sản phẩm của chúng ta từ giỏ hàng (thêm, xóa)
  • Bước 8 – trang liệt kê các sản phẩm

Bước 2

Video Hướng dẫn Đầy đủ
phong cách cho nó. Vì vậy, hãy mở index.php và sao chép/dán code dưới đây vào:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="//www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="//boxhoidap.com/css/reset.css" /> <link rel="stylesheet" href="css/style.css" /> <title>Shopping cart</title> </head> <body> <div id="container"> <div id="main"> </div><!--end main--> <div id="sidebar"> </div><!--end sidebar--> </div><!--end container--> </body> </html>

Bước 3style.css và nhập code dưới đây vào:

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }

Bước 4

Video Hướng dẫn Đầy đủ

Bước 3

Bước 4

  1. Bước 5Privileges, nhấp vào nút add new user, và sử dụng các thiết lập sau: Username: tutorial; Host: localhost; Password: supersecretpassword ;. Bây giờ đảm bảo rằng các quyền Global được thiết lập; Sau đó
    chuyển sang bước tiếp theo.
  2. Bước 6tutorials.
  3. Bước 7products và thiết lập số lượng trường thành 4. Bây giờ điền vào các trường đó, vì vậy bạn có: id_integer – đảm bảo nó được thiết lập thành INT và đánh dấu nó như PRIMARY (đồng thời thiết lập nó thành auto_increment); name – chọn kiểu VARCHAR với chiều dài 100; description – VARCHAR với chiều dài
    250; price – đảm bảo rằng nó được thiết lập thành DECIMAL(2,6)
  4. Bước 8

Bước 9

CREATE TABLE IF NOT EXISTS `products` ( `id_product` int(11) NOT NULL AUTO_INCREMENT, `name` varchar(100) NOT NULL, `description` varchar(250) NOT NULL, `price` decimal(6,2) NOT NULL, PRIMARY KEY (`id_product`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCREMENT=7 ; INSERT INTO `products` (`id_product`, `name`, `description`, `price`) VALUES (1, 'Product 1', 'Some random description', '15.00'), (2, 'Product 2', 'Some random description', '20.00'), (3, 'Product 3', 'Some random description', '50.00'), (4, 'Product 4', 'Some random description', '55.00'), (5, 'Product 5', 'Some random description', '54.00'), (6, 'Product 6', 'Some random description', '34.00');

Bước 4

Bước 5index.php của tôi một template cho danh sách sản phẩm và giỏ hàng. Do đó, hãy thêm code sau vào trên cùng của trang index.php của bạn:

<?php session_start(); require("includes/connection.php"); if(isset($_GET['page'])){ $pages=array("products", "cart"); if(in_array($_GET['page'], $pages)) { $_page=$_GET['page']; }else{ $_page="products"; } }else{ $_page="products"; } ?>
  1. Bước 6 – nó sẽ được sử dụng sau này; nó sẽ cho phép chúng ta thật sự sử dụng các session (điều quan trọng là session_start được viết trước khi bất kỳ dữ liệu nào khác được gửi tới trình duyệt).
  2. Bước 7
    việc thực thi script sẽ kết thúc. Nếu bạn sử dụng “include”, script sẽ tiếp tục thực thi.
  3. Bước 8_pages. Nếu biến GET được gọi là pages đã được thiết lập trước, tôi muốn đảm bảo rằng tập tin mà tôi
    sẽ include là một trang hợp lệ.

Bước 9

<?php require($_page.".php"); ?>

Đây là index.php hoàn chỉnh mà chúng ta có lúc này: index.php hoàn chỉnh mà chúng ta có lúc này:

<?php session_start(); require("includes/connection.php"); if(isset($_GET['page'])){ $pages=array("products", "cart"); if(in_array($_GET['page'], $pages)) { $_page=$_GET['page']; }else{ $_page="products"; } }else{ $_page="products"; } ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="//www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="//boxhoidap.com/css/reset.css" /> <link rel="stylesheet" href="css/style.css" /> <title>Shopping Cart</title> </head> <body> <div id="container"> <div id="main"> <?php require($_page.".php"); ?> </div><!--end of main--> <div id="sidebar"> </div><!--end of sidebar--> </div><!--end container--> </body> </html>

Hãy tạo kết nối đến MySQL. Mở connections.php và nhập vào như sau: connections.php và nhập vào như sau:

<?php $server="localhost"; $user="tutorial"; $pass="supersecretpassword"; $db="tutorials"; // connect to mysql mysql_connect($server, $user, $pass) or die("Sorry, can't connect to the mysql."); // select the db mysql_select_db($db) or die("Sorry, can't select the database."); ?>

Bước 5

Bây giờ là lúc viết code cho trang sản phẩm. Vì vậy hãy mở nó và nhập vào như sau:

<h2>Product List</h2> <table> <tr> <th>Name</th> <th>Description</th> <th>Price</th> <th>Action</th> </tr> <tr> <td>Product 1</td> <td>Some random description</td> <td>15 $</th> <td><a href="#">Add to cart</a></td> </tr> <tr> <td>Product 2</td> <td>Some random description</td> <td>25 $</th> <td><a href="#">Add to cart</a></td> </tr> </table>

Hãy quan sát trang:

Như bạn thấy, nó khá rối. Vì vậy, hãy định phong cách cho nó bằng cách thêm CSS này.

a {color: #48577D; text-decoration: none;} a:hover {text-decoration: underline;} h2, h2 {margin-bottom: 15px} h2 {font-size: 18px;} h2 {font-size: 16px} #main table { width: 480px; } #main table th { padding: 10px; background-color: #48577D; color: #fff; text-align: left; } #main table td { padding: 5px; } #main table tr { background-color: #d3dcf2; }

Được rồi: bây giờ hãy xem lại một lần nữa:
lại một lần nữa:

Có vẻ tốt hơn nhiều, bạn có nghĩ vậy không? Dưới đây bạn có code hoàn chỉnh cho style.css: style.css:

body { font-family: Verdana; font-size: 12px; color: #444; } a {color: #48577D; text-decoration: none;} a:hover {text-decoration: underline;} h2, h2 {margin-bottom: 15px} h2 {font-size: 18px;} h2 {font-size: 16px} #container { width: 700px; margin: 150px auto; background-color: #eee; padding:15px; overflow: hidden; } #main { width: 490px; float: left; } #main table { width: 480px; } #main table th { padding: 10px; background-color: #48577D; color: #fff; text-align: left; } #main table td { padding: 5px; } #main table tr { background-color: #d3dcf2; } #sidebar { width: 200px; float: left; }

Bước 6

Trước khi trích xuất sản phẩm từ cơ sở dữ liệu, chúng ta hãy xoá bỏ 2 table row cuối cùng ra khỏi table của chúng ta (chúng ta chỉ sử dụng nó để xem table của chúng ta sẽ trông như thế nào thôi). Xoá cái này:

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }0

Tuyệt! Bây giờ ở nơi mà các table row được đặt, hãy nhập code PHP sau:

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }1
  1. Như vậy, trước tiên chúng ta sử dụng SELECT để truy vấn sản phẩm, sau đó chúng ta lặp qua mỗi hàng từ cơ sở dữ liệu và xuất nó lên trang trong một table row.
    ta sử dụng SELECT để truy vấn sản phẩm, sau đó chúng ta lặp qua mỗi hàng từ cơ sở dữ liệu và xuất nó lên trang trong một table row.
  2. Bạn có thể thấy rằng các liên kết đến cùng một trang (khi người dùng nhấp vào liên kết sản phẩm thì nó được thêm vào giỏ hàng/session). Chúng ta chỉ cần truyền vào một số biến phụ như id của sản phẩm.

Nếu bạn di chuyển chuột qua một trong các liên kết Add to cart, bạn có thể thấy, ở cuối trang, id của sản phẩm được truyền vào.

Bước 7

Hãy làm cho liên kết đó hoạt động bằng cách thêm code sau đây vào trên cùng của trang:

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }2
  1. Nếu biến GET được gọi là action đã được thiết lập và nó có giá trị ADD, thì chúng ta sẽ thực thi đoạn code.
  2. Chúng ta đảm bảo rằng id được truyền qua biến GET là một số nguyên
  3. Nếu id của sản phẩm nằm trong SESSION, chúng ta chỉ cần tăng số lượng của nó lên 1
  4. Nếu id không có ở trong session, chúng ta cần phải chắc chắn rằng id truyền qua biến GET tồn tại trong cơ sở dữ liệu. Nếu có, chúng ta lấy giá bán và tạo ra session của nó. Nếu không, chúng ta sẽ thiết lập một biến được gọi là message sẽ chứa thông báo lỗi của chúng ta.

Hãy kiểm tra xem biến message đó được thiết lập hay chưa và xuất nó vào trang (nhập code này dưới tiêu đề trang H1):

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }3

Ở đây bạn có thể thấy trang products.php hoàn chỉnh.products.php hoàn chỉnh.

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }4

Đây là thông báo lỗi nếu id của sản phẩm không hợp lệ

Bước 8

Hãy quay trở lại index.php và xây dựng sidebar. Thêm code sau đây: index.php và xây dựng sidebar. Thêm code sau đây:

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }5
  1. Đầu tiên chúng ta kiểm tra session giỏ hàng đã được thiết lập hay chưa. Nếu không, chúng ta sẽ hiển thị thông báo, cảnh báo người dùng rằng giỏ hàng trống.
  2. Tiếp theo chúng ta tạo một lệnh SELECT trong mysql, nhưng đồng thời chúng ta chỉ lựa chọn các sản phẩm tồn tại trong session. Để thực hiện việc này, chúng ta sử dụng hàm foreach. Do đó, chúng ta sẽ lặp qua session và thêm id sản phẩm vào SELECT. Tiếp theo, chúng ta sử dụng hàm substr để loại bỏ dấu phẩy cuối cùng khỏi SELECT.
  3. Cuối cùng, chúng ta xuất dữ liệu lên trình duyệt.

Hãy xem những hình ảnh dưới đây:

Vì index.php là một template cho tất cả các tập tin, nên sidebar cũng sẽ hiển thị trong cart.php. Thật tuyệt vời phải không?! cart.php. Thật
tuyệt vời phải không?!

Bước 9

Cuối cùng, mở cart.php và bắt đầu bằng cách nhập code sau: cart.php và bắt đầu bằng cách nhập code sau:

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }6

Code này tương tự như code từ index.php và products.php, vì vậy tôi sẽ không giải thích chúng nữa. Bạn nên chú ý rằng thay vì hiển thị số lượng trong một form, bây giờ nó được hiển thị trong một hộp input (để chúng ta có thể thay đổi số lượng). Ngoài ra cái table được bọc bằng thẻ form. Để có được tổng giá của các mặt hàng mà chúng ta nhân số lượng của id của sản phẩm cụ thể (từ session) với giá của nó. Việc này được hoàn thành trong mỗi vòng lặp.
sản phẩm cụ thể (từ session) với giá của nó. Việc này được hoàn thành trong mỗi vòng lặp.

Lưu ý: đầu vào là một mảng, key là id của sản phẩm, và quantity là giá trị của số lượng.: đầu vào là một mảng, key là id của sản phẩm, và quantity là giá trị của số lượng.

Bước 10

Bước cuối cùng mà chúng ta cần làm là làm cho form hoạt động. Vì vậy, hãy thêm code này vào bên trên của trang cart.php.

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }7
  1. Trước tiên, chúng ta kiểm tra xem form đã được submit hay chưa. Nếu nó đã được submit và giá trị của input là 0, chúng ta sẽ unset session đó.
    sẽ unset session đó.
  2. Nếu giá trị là bất kỳ giá trị nào khác, thì chúng ta sẽ thiết lạp quantity thành giá trị đó.

Đây là tập tin cart.php hoàn chỉnhcart.php hoàn chỉnh

body { font-family: Verdana; font-size: 12px; color: #444; } #container { width: 700px; margin: 150px auto; background-color: #eee; overflow: hidden; /* Set overflow: hidden to clear the floats on #main and #sidebar */ padding: 15px; } #main { width: 490px; float: left; } #sidebar { width: 200px; float: left; }8

Tôi hy vọng bạn thích hướng dẫn này. Nếu bạn có bất kỳ câu hỏi nào, hãy xem hướng dẫn sâu hơn bằng video!

Chủ đề