TRÌNH BÀY TIN TRONG THỂ LOẠI NHƯ TRANG CHỦ CỦA DANTRI.COM
CHUẨN BỊ:-Tạo database webtintuc
Tạo site web động
1:Tạo trang tintrongloai.php lưu trong site web tin tức vừa tạo
3:-Conection name: gõ webtintuc
-MySQL server: gõ localhost
-User names :gõ root
-Password :gõ root
-Database :click vào nút select
4:Chọn webtintuc,click OK
5:Click OK
6:Mở Conection:click vào dấu +,mở webtintuc.php
7:Để con trỏ cuối dòng 9 ,enter xuống hàng , gõ : mysql_query(“set names ‘utf8’ ”);
1:Vào tab Layout,chọn biểu tượng table
2:Rows :2,Col ums:2,width:500,Cell padding :4,Cell Spacing :0
Gõ the loai trong ô đầu
3:Chọn Layout ,chọn table
4:Rows:1,Col ums:1, width:100%,Cell padding :4,Cell Spacing :0
5:Chọn tr dòng 2 meges thành 1 ô,chèn table
Rows:1,Col ums:1, width:100%,Cell padding :4,
Chèn table như hình sau:Bước 3:Tạo 3 recordset theloai,loaitin,tin để đưa tin vào table như sau:
1:Vào tab Bingding,click vào dấu +,chọn Recordset (Query)
2:Nam e:theloai
- Conection:click vào hình tam giác chon webtintuc
- table:chọn table theloai,click chọn selected , chọn idTL,TenTL
- Filter :AnHien ,Enter Value = 1
- Sort :ThuTu Ascending
- Click OK
3: Nam e:loaitin
- Conection:click vào hình tam giác chon webtintuc
- table:chọn table loaitin,click chọn selected , chọn idLT,TenLT
- Filter :idTL ,Enter Value = 123456789
- Sort :ThuTu Descending
Click OK
4: Name:loaitin
- Conection:click vào hình tam giác chon webtintuc
- table:chọn table tintuc,click chọn selected , chọn idLT,TenLT
- Filter :idTL ,Enter Value = 123456789
- Sort :idTin Ascending
Click Advanded
5:Gõ thêm :
Limit 0,5
Click OK.
Bước 4:Kéo dữ liệu vào
1:Quét chọn theloai
2:Mở recordset theloai,kéo TenTL vào
3:Quét chọn loại tin
4: Mở recordset loaitin,kéo TenLT vào
5:Quét chọn tieudetin
6: Mở recordset tin,kéo Tieude vào.
Bước 5:Lặp dữ liệu table chứa thể loại,loạitin,tin
1:Chọn table chứa theloai.TenTL
2:Vào Server Behaviors,click dấu cộng(+),chọn Repeat Region
3:-Recorset :chọn theloai
-check vào all records
-click OK
4:Qua code,Quét chọn cột: <td><?php echo $row_loaitin[‘TenLT’];?></td>
5: Vào Server Behaviors,click dấu cộng(+),chọn Developer Tollbox->Dynamic Lists->dvanced-> Nested Repeat Region
6:-Master record:theloai
-Primary key:idTL
-Detail record:loaitin
-click OK
7:Qua code ,quét chọn <tr>… <?php echo $row_tin[‘TieuDe’];?>…</tr>
8: Vào Server Behaviors,click dấu cộng(+),chọn Developer Tollbox->Dynamic Lists->dvanced-> Nested Repeat Region
9: :-Master record:theloai
-Primary key:idTL
-Detail record:tin
-click OK
Kết quả F12 chạy sẽ như hình:
Bước 6:Đưa hình và tomtat của tin và định dạng như dantri.com
1:Bôi đen tin.TieuDe
2:Xuống ô link:chitiettin.php?idTin=aa
3:Qua code , bôi đen chữ aa,Kéo idTin trong recordset tin qua
4 :Qua code ,Bôi đen hinh,Vào Insert -> Images->Data sources,chọn recordset tin,chọn urlHinh.click OK.Nếu F12 ,chạy lên , hình bị lỗi thì bạn xử lý sau :
Cách xử lý :chép thư mục hình vào site ,sửa đúng đường dẫn hình.Ví dụ , hình nằm trong thư mục Uploads , mình sẽ sửa như sau :
Chỉnh kích thước hình như sau :
Lúc này mình F12 sẽ được như sau :
Để hiện hình giống như cách trình bày của dantri.com như sau :
Trước do của vòng lặp Nested repeat Region , viết $dem=0 ;sau do viết $dem++;
Trước tag <img…>,viết <? If($dem= =1) { ?>,sau tag<img …>,viết <? }?>
Tương tự chèn file tomtat vào mình cùng kẹp <? If($dem= =1) { ?> sau <? }?> như hình bên dưới:
Kết quả F12 chạy lên , mình sẽ được như sau:
Để định dạng giống như trang dantri.com, bạn phải thêm vào code như hình bên dưới:
Và định dạng css tùy bạn thích màu gì cho đẹp,ví dụ ly định dạng như vậy:
<style>
#ltin {
width: 50px;
text-align: center;
}
#ltin a {
color: #FFFFFF;
text-decoration: none;
text-align: center;
}
.hinh {
margin-right: 10px;
padding: 2px;
float: left;
height: 100px;
width: 100px;
border: 1px solid #666666;
}
.textcanhphai {
text-align: right;
}
#tin a {
color: #0033FF;
text-decoration: none;
}
#tin a:hover {
color: #00CCCC;
text-decoration: none;
}
</style>
Và F12 lên ,kết quả được như sau: