电子商务网站之首页设计
本文 以表格布局方式实现一电 子商务网站首页,结合php[+mysql获取后端数据 。首页通常包括网店Logo、导航条、搜索、商品展示等,网页头部和脚部已经制作成两件,直接调用即可,导航还需设计一个商品类别导航,商品展示分为三大区域:优惠品、出售商品、求购商品。
一 首页框架设计
首页采用表格布局,采用3行3列表格布局方式, 其布局效果如下所示
html代码如下所示:
<table border='1' width='1000'>
<tr>
<td rowspan='3'>商品类别导航条</td>
<td>优惠商品信息</td>
</tr>
<tr>
<td>商品出售信息</td>
</tr>
<tr>
<td>求购商品信息</td>
</tr>
</table>
其最终效果如下所示:
二 商品类别导航条
商品类别有大类和小类,两者通过嵌套循环实现,代码 如下:
<?php
// 建立数据库连接
$conn = mysqli_connect("localhost", "root", "", "your_database_name");
// 检查连接是否成功
if (!$conn) {
die("数据库连接失败:" . mysqli_connect_error());
}
// 查询商品大类
$mainCategoryQuery = "SELECT * FROM main_categories";
$mainCategoryResult = mysqli_query($conn, $mainCategoryQuery);
// 查询商品小类
$subCategoryQuery = "SELECT * FROM sub_categories";
$subCategoryResult = mysqli_query($conn, $subCategoryQuery);
// 生成导航条HTML
$navBar = '<ul class="nav-bar">';
while ($mainCategoryRow = mysqli_fetch_assoc($mainCategoryResult)) {
$mainCategoryName = $mainCategoryRow['name'];
$mainCategoryId = $mainCategoryRow['id'];
$navBar .= '<li><a href="#">' . $mainCategoryName . '</a>';
$navBar .= '<ul class="sub-nav">';
// 根据商品大类id查询对应的小类
$subCategoryQuery = "SELECT * FROM sub_categories WHERE main_category_id = $mainCategoryId";
$subCategoryResult = mysqli_query($conn, $subCategoryQuery);
while ($subCategoryRow = mysqli_fetch_assoc($subCategoryResult)) {
$subCategoryName = $subCategoryRow['name'];
$navBar .= '<li><a href="#">' . $subCategoryName . '</a></li>';
}
$navBar .= '</ul>';
$navBar .= '</li>';
}
$navBar .= '</ul>';
// 输出导航条HTML
echo $navBar;
// 关闭数据库连接
mysqli_close($conn);
?>
上述代码假设已经建立了一个名为main_categories
的商品大类表,其中包含id
和name
两个字段,还有一个名为sub_categories
的商品小类表,其中包含id
、name
和main_category_id
三个字段。
在示例中,我们首先查询商品大类并将其显示为导航条的一级菜单,然后根据商品大类的id查询对应的小类,将其显示为导航条的二级菜单。最后我们将生成的导航条HTML输出到页面上。
请根据您的实际数据库表结构和HTML样式进行相应的修改。
三 前五名优惠商品展示
优惠商品是以折扣的大小来决定的,折扣越大越优惠,前五名可以用查询SQL 中的limit关键字来先出,代码如下所示:
<?php
// 连接到数据库
$servername = "localhost";
$username = "your_username";
$password = "your_password";
$dbname = "products";
$conn = new mysqli($servername, $username, $password, $dbname);
// 检查连接是否成功
if ($conn->connect_error) {
die("连接失败: " . $conn->connect_error);
}
// 获取前五名优惠商品
$sql = "SELECT name, price, discount FROM items ORDER BY discount DESC LIMIT 5";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// 输出数据
while($row = $result->fetch_assoc()) {
echo "商品名称: " . $row["name"]. " - 原价: $" . $row["price"]. " - 优惠价: $" . ($row["price"] - $row["discount"]). "<br>";
}
} else {
echo "没有找到优惠商品";
}
// 关闭连接
$conn->close();
?>
以上代码将连接到数据库,查询前五名优惠商品,并将它们的名称、原价和优惠价输出到页面上。如果没有找到优惠商品,则输出 "没有找到优惠商品"。
四 商品出售信息展示
使用PHP和MySQL来查询商品销售信息,并将其以表格形式展示出来。以下是一个简单的示例代码:
<?php
// 连接到MySQL数据库
$conn = mysqli_connect("localhost", "username", "password", "database");
// 检查连接是否成功
if (!$conn) {
die("数据库连接失败:" . mysqli_connect_error());
}
// 查询商品销售信息
$sql = "SELECT * FROM products";
$result = mysqli_query($conn, $sql);
// 检查查询结果
if (!$result) {
die("查询失败:" . mysqli_error($conn));
}
?>
<!DOCTYPE html>
<html>
<head>
<title>商品销售信息</title>
<style>
table {
border-collapse: collapse;
width: 100%;
}
th, td {
text-align: left;
padding: 8px;
}
tr:nth-child(even) {
background-color: #f2f2f2;
}
</style>
</head>
<body>
<h2>商品销售信息</h2>
<table>
<tr>
<th>ID</th>
<th>商品名称</th>
<th>价格</th>
<th>库存</th>
</tr>
<?php
// 遍历查询结果并生成表格行
while ($row = mysqli_fetch_assoc($result)) {
echo "<tr>";
echo "<td>" . $row['id'] . "</td>";
echo "<td>" . $row['name'] . "</td>";
echo "<td>" . $row['price'] . "</td>";
echo "<td>" . $row['stock'] . "</td>";
echo "</tr>";
}
// 释放查询结果资源
mysqli_free_result($result);
// 关闭数据库连接
mysqli_close($conn);
?>
</table>
</body>
</html>
在此示例中,我们首先通过mysqli_connect()
函数连接到MySQL数据库。然后,使用mysqli_query()
函数执行查询语句,将结果保存在$result
变量中。接下来,我们使用mysqli_fetch_assoc()
函数从查询结果中获取每一行的数据,并将其以表格行的形式输出到HTML页面中。
五 商品类别查询
完成商品类别的查询需要做以下步骤 :
1. 在大类名、小类名加超链接
<a href="index.php?a=large&x=<%=$large%>"><%=$large&></a>
<a href="index.php?a=small&x=<%=$small%>"><%=$small%></a>
2. 查询时加查询条件为大类号或小类号
条件查询,代码如下:
<?php
sql="select * from products"
$a=$_GET['a']
$x=$_GET['X']
if($a=="large") {
sql=sql."where large=".$x
}
if($a=="small") {
sql=sql."where small=".$x
}
sql=sql."order by publish_date desc"
$result = $conn->query($sql);
?>
六 商品品名搜索
商品品名查询是用模糊查询实现,代码 如下所示
// 获取查询关键字
$keyword = $_GET['keyword'];
// 执行模糊查询
$sql = "SELECT * FROM 商品表 WHERE 品名 LIKE '%$keyword%'";
$result = $conn->query($sql);
// 输出查询结果
if ($result->num_rows > 0) {
while($row = $result->fetch_assoc()) {
echo "品名: " . $row["品名"]. "<br>";
// 输出其他字段
}
} else {
echo "没有找到匹配的商品";
}
该代码用GET方法获取查询关键字,并使用SQL的LIKE操作符进行模糊查询。如果找到匹配的商品,将输出商品的品名和其他字段;如果没有找到匹配的商品,将输出提示信息。
七 分页显示技术
获取当前页码和每页显示的记录数:
<?php
$page = isset($_GET['page']) ? $_GET['page'] : 1;
$records_per_page = 10;
$offset = ($page - 1) * $records_per_page;
?>
查询数据库,获取商品信息并根据当前页码进行分页:
<?php
$sql = "SELECT * FROM products LIMIT $offset, $records_per_page";
$result = $conn->query($sql);
if ($result->num_rows > 0) {
// 输出数据
while($row = $result->fetch_assoc()) {
echo "ID: " . $row["id"]. " - Name: " . $row["name"]. " - Price: " . $row["price"]. "<br>";
echo "Description: " . $row["description"]. "<br><br>";
}
} else {
echo "0 结果";
}
?>
获取总记录数,并计算总页数:
<?php
$sql = "SELECT COUNT(*) AS total FROM products";
$result = $conn->query($sql);
$row = $result->fetch_assoc();
$total_pages = ceil($row["total"] / $records_per_page);
?>
显示分页链接:
<?php
echo "<ul class='pagination'>";
for ($i = 1; $i <= $total_pages; $i++) {
echo "<li><a href='index.php?page=$i'>$i</a></li>";
}
echo "</ul>";
?>
现在,当你访问该“index.php”文件时,将会显示商品信息的分页列表,并提供相应的分页链接。