Tạo trang tin tức sử dụng theme JNews và WordPress

Để tạo một website tin tức với mã nguồn WordPress, có rất nhiều theme hỗ trợ, ngoài Flatsome nổi tiếng, còn một theme đang được sử dụng rộng rãi hiện nay để làm trang tin tức, đó là jNews. Bài viết này sẽ hướng dẫn thiết kế trang chủ tin tức sử dụng theme jNews.

Để bắt đầu, tạm xem như việc cài đặt WordPress và tích hợp theme jNews đã được thực hiện.

Sau đây chúng ta sẽ bắt đầu thiết kế trang tin tức có giao diện như vanhoadulich.net dưới đây:

Về bố cục, gồm 2 phần chính:

Main (bên trái)
- Dòng tin tức mới nhất phía trên cùng
- Block hiển thị 5 tin mới nhất
- Block quảng cáo
- Các block thuộc các nhóm chuyên mục khác
Sidebar (bên phải)
- Tab: Xem nhiều, mới nhất
- Block tin mới nhất
- Block quảng cáo
- …

Bước 1: Tạo trang chủ trang tin tức sử dụng theme JNews

Từ cửa sổ quản trị, chọn Trang –> Thêm trang mới, đặt tên là Trang chủ.

Bước 2: Thiết lập Trang chủ sẽ là trang hiển thị đầu tiên của website

Từ phần Giao diện –> Tùy biến, tiếp theo chọn Cài đặt trang chủ –> Trang chủ (như hình dưới đây)

Sau đó nhấn chọn Đăng để hoàn tất quá trình thiết lập trang chủ.

Bước 3: Thiết kế bố cục trang chủ

Vào phần quản trị, chọn Trang, lựa chọn Trang chủ và chọn Sửa (như hình dưới đây)

Cửa sổ tiếp theo: Tìm đến block WPbakery Page Buider để tiến hành thiết kế. Lưu ý: Chúng ta có thể thiết lập bố cục ngay ngoài trang chủ mà không cần thiết phải vào phần quản trị để thiết lập.

Tiếp theo, chọn Add Element. Chúng ta sẽ thiết kế bố cục gồm 2 cột

Cột bên trái, chiếm diện tích nhiều hơn, dành cho việc thiết kế nội dung
Cột bên phải, dành cho việc thiết kế sidebar (tin mới nhất, quảng cáo, các tab …)

Di chuyển chuột đến biểu tượng Custom như hình dưới đây, sau đó tìm và chọn bố cục 2 phần

Bây giờ, chúng ta sẽ thiết kế nội dung cho các cột.

Thiết kế bố cục cột bên phải trang tin tức jNews

Cột bên phải, thiết kế Sidebar, gồm block Tab dành cho tin mới, tin xem nhiều; block tin mới nhất, block quảng cáo …

Cách thực hiện:

Nhấn chuột vào dấu + phần bên trái Sidebar, xuất hiện hộp thoại Add Element, nhập hộp tìm kiếm từ khóa Tab post, chúng ta thấy một module JNews – Tab Post Widget như dưới đây:

Sau khi nhấn chọn để thêm, xuất hiện cửa sổ cài đặt thuộc tính, chúng ta chỉ việc nhấn Save changes để lưu. Mọi giá trị mặc định không cần phải thay đổi. Nếu muốn thay đổi số tin hiển thị, chọn trong phần Total Limit post như dưới đây:

Bước tiếp theo, cài đặt danh sách tin mới nhất (Latest Post), chọn thêm một module mới, và tìm module 19 như hình dưới đây:

Cửa sổ tiếp theo, chọn tab Content Filter, phần Sort by, chọn Latest Post. Sau đó nhấn Save Changes

Cột bên trái trang tin tức jNews

Gồm các module

Dòng marquee hiển thị tin tức mới nhất
Block tin tức mới nhất (5 tin)
Block ảnh quảng cáo
Block các chuyên mục …

Cách thực hiện:

Nhấn vào thêm element (dấu + ) phần bên phải, sau đó:

Nhập tìn module JNews Ticker, sau đó chọn để thêm vào phần thiết kế.

Tại bước kế tiếp, nhập Bài mới vào phần News Ticker Title trong tab General

Tab Content Filter, chọn Bài viết, sau đó chọn Save changes để lưu thiết lập

Phần hiển thị block 5 tin mới nhất. Chọn Add element, chọn module 2

Trong phần thiết lập thuộc tính, để mặc định và Save changes. Chúng ta có thể lựa chọn những chuyên mục sẽ xuất hiện, những chuyên mục nào không xuất hiện như hình dưới đây: