Trong trang riêng Violet, Thầy Cô đã đặt nhiều tâm huyết với các tư liệu, bài viết, bài giảng, giáo án… Trong số đó có những bài mà quý Thầy Cô tâm đắc, muốn giới thiệu đến các thành viên Violet cùng tham khảo. Nhưng cùng với thời gian, các bài đó lần lượt bị lùi xuống phía sau do các bài mới được tạo ra liên tục. Để tìm lại các bài tâm đắc đó quả là một việc khá vất vả. Vậy tại sao Thầy Cô không  tạo chỉ mục cho những bài viết đó riêng một nơi để mình và các thành viên dễ dàng tìm kiếm.

Sau đây, Bằng Vũ xin giới thiệu cùng Thầy Cô một đoạn code giúp chúng ta cùng làm điều vừa nêu trên.

Bước 1: Thầy Cô download file nguồn tại đây hoặc cuối bài này và mở file nguồn bằng trình thiết kế Web (FrontPage, Dreamwere,…) hoặc trình soạn thảo văn bản (Notepad, Wordpad,…)

Bước 2: Mỗi bài viết được hiển thị bằng 2 phần: Kênh hình ảnh + lời giới thiệu (bên trái) và Kênh chữ nội dung chính của bài. (bên phải)

 Thầy Cô lần lượt thay các link bài, link hình ảnh và câu giới thiệu ngắn gọntrong 2 phần theo các màu Bằng Vũ đã tô với thứ tự cho mỗi mục như sau (lưu ý: Thầy Cô chỉnh sửa trong file nguồn .htm nhé !)

                Phần 1:

Link dẫn đến bài tâm đắc 1

                Link hình đại diện của bài 1

                Câu giới thiệu về bài viết 1

Link dẫn đến bài tâm đắc 2

                Link hình đại diện của bài 2

                Câu giới thiệu về bài viết 2

                ……….

                ……….

                Phần 2:

                        Link dẫn đến bài tâm đắc 1

                Câu giới thiệu về bài viết 1

Link dẫn đến bài tâm đắc 2

                Câu giới thiệu về bài viết 2

                ……….

                ……….

Bước 3: Chạy thử file .htm trên máy để kiểm tra. Nếu đã ưng ý thì Thầy Cô upload file nguồn .htm lên host free (VD: http://jabry.net ; http://110mb.com…)

Bước 4: Copy và dán link đến file vừa upload lên hosst free trong đoạn code sau và chép code đưa vào khối chính:

<center><iframe name="secondFrame" width="500px" height="250px" frameborder="0" scrolling="no" src=

"link dẫn đến file .htm trên host vừa upload"></iframe></center>

Dưới đây là mã nguồn của phần cần thay đổi trong file nguồn .htm để tạo “TOP 10 BÀI TIÊU BIỂU”

    <-- Bắt đầu phần 1 – Link kênh hình ảnh bên trái -->

<ul><li><a href="http://bangvu.violet.vn/entry/show/entry_id/5312958"

style="text-decoration:none;" title="Tạo giao diện trang riêng - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://i1087.photobucket.com/albums/j463/bangvupro/30-03-20119-47-20PM.png">

                1- Thầy Cô đã dùng hết các mẫu giao diện mà Violet cung cấp và cảm thấy chưa "đã" ???</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5766437"

style="text-decoration:none;" title="Gỡ đóng băng trang riêng Violet - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://d3.violet.vn/uploads/previews/blog/741157/dongbang_trong_500.png">

                2-Bên trong Quản trị trang hiển thị thế này. (Thiệt đau lòng quá đi !!!)...</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5819739"

style="text-decoration:none;" title="Tìm ngày thành lập trang riêng Violet - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://d2.violet.vn/uploads/resources/606/thanhlapweb.png">

                3-Mẹo nhỏ này sẽ giúp Thầy Cô nhanh chóng tìm lại ngày thành lập trang riêng Violet.</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5829950"

style="text-decoration:none;" title="Thiết lập hình nền cho trang riêng - BằngVũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://d2.violet.vn/uploads/resources/606/thietlapnen.gif">                             4-Để hình nền phủ kín và đứng im khi ta cuộn trang, hãy xem bài viết này ngay nhé.</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5798335"

style="text-decoration:none;" title="Code hiển thị tình trạng online/offline YM! - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://presence.msg.yahoo.com/online?u=wait.alove&m=g&t=14&l=us"> 

                5-Code hiển thị tình trạng online/offline Yahoo Messenger.</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5737005"

style="text-decoration:none;" title="Thay Icon Web trên thanh Tiêu đề - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://d2.violet.vn/uploads/resources/606/BVicon.gif"> 

                6-Thay Icon trên thanh Tiêu đề của Firefox và Chrome để khẳng định mình.</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/entry_id/5845318"

style="text-decoration:none;" title="Các thủ thuật và phím tắt trong Excel - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://i876.photobucket.com/albums/ab323/hari-chu/contents/excel-password.jpg">

                7-Các thủ thuật và phím tắt trong Excel sẽ rất có lợi cho bạn đấy.</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5006476"

style="text-decoration:none;" title="Khởi tạo hộp chat Cbox - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://files.myopera.com/zith/blog/nhapthongtin.JPG">

                8-Khởi tạo hộp chat Cbox để khách và ta thỏa lòng ... tâm sự.</a></li>

                <li><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/4785183"

style="text-decoration:none;" title="Tạo biểu tượng động trong Cbox - Bằng Vũ" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://i1087.photobucket.com/albums/j463/bangvupro/cbox_ketqua.png">

                9-Để thỏa lòng bày tỏ cảm xúc khi chat trong Cbox, hãy tạo biểu tượng động ngay nhé !</a></li>

<li><a href="http://bangvu.violet.vn/entry/show/cat_id/4277329/entry_id/5180106"

style="text-decoration:none;" title="Cấm nick chat trong Cbox" target="_top"> <img width="300px" height="200px" border="0px" alt=" " src="http://i1087.photobucket.com/albums/j463/bangvupro/11-03-20115-18-40PM.png">

                10-Đôi khi, cbox của ta có vài thành phần hay “nói hành nói tỏi” >> Ta cấm như thế nào ?</a></li></ul>

<-- Kết thúc phần 1 – Link kênh hình ảnh bên trái-->

 </div> <div id="ifocus_opdiv" style="position: absolute; left: -4px; bottom: -96px; height:75px"></div>

                <div class="STYLE1" id="ifocus_tx">

                            <ul> <li class="normal"></li><li class="normal"></li><li class="normal"></li><li class="normal"></li><li class="normal"></li><li class="normal"></li><li class="normal"></li><li class="normal"></li><li class="normal"></li><li class="current"></li></ul> </div> </div>

    <div id="ifocus_btn"> <center><div id="new_entry" style="width: 250px; height: 55px"><font size="4">Bài viết</font><img src="http://d.violet.vn/uploads/resources/612/hot1.gif" width="50" height="30"></img></div></center>

<-- Bắt đầu phần 2 – Link kênh text bên phải -->

                            <ul> <li class="normal"><a href="http://bangvu.violet.vn/entry/show/entry_id/5312958" 

style="text-decoration:none;" title="Tạo giao diện trang riêng - Bằng Vũ" target="_top">

                1-Hướng dẫn tạo giao diện trang riêng.</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5766437" 

style="text-decoration:none;" title="Gỡ đóng băng trang riêng Violet - Bằng Vũ" target="_top">

                2-Gỡ đóng băng trang riêng Violet.</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5819739" 

style="text-decoration:none;" title="Tìm ngày thành lập trang riêng Violet - Bằng Vũ" target="_top">

                3-Tìm ngày thành lập trang riêng Violet.</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5829950" 

style="text-decoration:none;" title="Thiết lập hình nền cho trang riêng - Bằng Vũ" target="_top">

                4-Thiết lập hình nền cho trang riêng.</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5798335" 

style="text-decoration:none;" title="Code hiển thị tình trạng online/offline YM! - Bằng Vũ" target="_top">

                5-Code hiển thị tình trạng YM!</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5737005s" 

style="text-decoration:none;" title="Thay Icon Web trên thanh Tiêu đề - Bằng Vũ" target="_top">

                6-Thay Icon Web trên thanh Tiêu đề.</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/entry_id/5845318" 

style="text-decoration:none;" title="Các thủ thuật hay trong Excel - Bằng Vũ">

                7-Các thủ thuật và phím tắt trong Excel.</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/5006476" 

style="text-decoration:none;" title="Khởi tạo hộp chat Cbox - Bằng Vũ" target="_top">

                8-Khởi tạo hộp chat Cbox.</a></li>

                <li class="normal"><a href="http://bangvu.violet.vn/entry/show/cat_id/4030146/entry_id/4785183" 

style="text-decoration:none;" title="Tạo biểu tượng động trong Cbox - Bằng Vũ" target="_top">

                9-Tạo biểu tượng động trong Cbox.</a></li>

                <li class="current"><a href="http://bangvu.violet.vn/entry/show/cat_id/4277329/entry_id/5180106" 

style="text-decoration:none;" title="Cấm nick chat trong Cbox - Bằng Vũ" target="_top">

                10-Cấm nick chat trong Cbox.</a></li></ul>

<-- Kết thúc phần 2 – Link kênh text bên phải -->

                </div>    </div></div></div></div>

CHÚC THẦY CÔ VỌC VUI VẺ VÀ TẠO ĐƯỢC TOP 10 NHƯ Ý !