Kế hoạch html cho theme wordpress

26/12/2012 13:13 4185

Html là phần cơ bản, bạn phải làm tốt phần này thì sau này chuyển qua theme wordpress chỉ là công việc đơn giản mà thôi

Sau đây là cấu trúc file html mà bạn cần tạo:

css-folder: nơi chứa các file css

images-folder: nơi chứa các images

• Thiết lập reset css, body, a cho file style và layout phần header của trang index
• Viết mã html và css cho thanh menu about, nút social network và form tìm kiếm
• Html css jquery cho thanh topmenu
• Phần layout body và feature post
• Phần giới thiệu bài viết trên trang chủ
• Tìm hiểu phần menu tab bài mới, bài xem nhiều, bài ngẫu nhiên
• Tìm hiểu phần đăng ký nhận tin, Plugin Facebook, Tags, Link
• Tìm hiểu phần Scroll to top, footer và tổng kết trang index.html
• Tìm hiểu trang single phần 1
• Tìm hiểu trang single phần 2

js-folder: nơi chứa các file javascript

header.html: phần đầu của website

sidebar.html: nơi chứa các widget

footer.html: phần đít của website

index.html: trang này thể hiện các bài viết mới, bài viết đọc nhiều, ..và kết nối header.html, footer.html, sidebar.html

single.html: trang này thể hiện nội dung chi tiết của bài viết, kết nối commnets.html và sidebar.htm

archive.html: trang này thể hiện các bài viết trong một chuyên mục do người dùng click, kết nối sidebar.html

page.html: trang này thể hiện các nội dung ít thay đổi, ví dụ như trang about, term, privacy policy chẳn hạn, kết nối sidebar.html

comments.html: phần thể hiện comment của website

search.html: khi người xem web tìm kiếm, thì trang này được gọi, nó sẽ trả về danh sách các kết quả tìm kiếm, đồng thời kế nối sidebar.html

searchform.html: thể hiện phần form tìm kiếm

404.html: khi từ khóa của người xem website không tìm thấy thì trang này được gọi

author.html: trong này liệt kê danh sách các bài viết của cùng một tác giả

style.css: nơi chứa các css của bạn

Trên đây là list các file mà bạn cần tạo, bạn nên sử dụng phần mềm Dreamwaver CS6 để tạo các file trống trên, nó sẽ hỗ trợ bạn nhiều trong việc quản lý dự án, hổ trợ xổ code thông minh, giúp giảm thời gian viết code

Đến đây tôi xin kết thúc phần lên kế hoạch html trong dự án ebook hướng dẫn thiết kế theme wordpress từ a –z

Hẹn gặp lại bạn ở bài tiếp theo trong dự án