Code giao diện bài viết theo từng chuyên mục WordPress

Giá gốc là: 199,000₫.Giá hiện tại là: 99,000₫.

Hướng dẫn viết Code giao diện bài viết theo từng chuyên mục WordPress tạo ra một giao diện web đẹp theo ý muốn của mình. Xem ngay!

SẢN PHẨM MỚI
Thời trang thiết kế Lecoong

WordPress cung cấp cho người dùng nhiều lựa chọn để tạo giao diện bài viết theo từng chuyên mục. Người dùng có thể tạo các mẫu giao diện riêng biệt cho từng chuyên mục, từ việc chọn hình ảnh đại diện, bố cục, màu sắc, font chữ cho đến cách hiển thị bài viết. Điều này giúp người dùng tạo ra trải nghiệm độc đáo và phong phú cho người đọc khi duyệt qua các chuyên mục khác nhau trên website. Học viết code giao diện bài viết theo từng chuyên mục WordPress cực kỳ đơn giản. Xem ngay bài hướng dẫn dưới nhé.

Nhắc lại kiến thức cơ bản tạo file nhận theo chuyên mục

1.Tạo giao diện khác nhau cho từng Category (Chuyên mục):

WordPress đã hỗ trợ sẵn cho bạn và bạn có thể tạo File category.php theo ID hoặc Slug riêng cho Category đó. Thường thì mình hay tạo file theo slug riêng để dễ quản lý, cụ thể ví dụ dưới đây.

Ví dụ :

Theo ID: Bạn sẽ tạo 1 file là : category-id.php(category-1.php,category-2.php,category-3.php, …)

Theo Slug: file category sẽ có dạng: category-slug.php(category-tin-tuc.php, category-du-an.php)

EROSSKA CO

Sau đó chúng ta tự thay code hiển thị riêng cho Category này.

2.Tạo giao diện khác nhau cho từng Post (Bài viết theo chuyên mục):

Tương tự cách tạo như ở trên, chỉ khác là giao diện bài viết nên mình chỉ cần đổi tên category => content-singel.

Ví dụ:

conten-single-tin-tuc.php, content-single-du-an.php

Cách thiết kế giao diện bài viết theo từng chuyên mục WordPress

Cụ thể là trang kho giao diện website mình có file category-kho-giao-dien.php và bây giờ là các bước thiết kế giao diện post theo chuyên mục kho giao diện.

emili-lux

Bước 1: Tạo file content-single-kho-giao-dien.php

Vào thư mục theme hoặc child theme (tùy từng loại theme nếu có) tạo file hiển thị bài viết có tên là content-single-khoa-giao-dien.php

Bước 2: Gọi hàm hiển thị header và footer

<?php
/*
 * Template Name: Template Themes
 * Template Post Type: post
 */
 get_header();  ?>


<?php get_footer();?>

Giải thích

<?php get_header();?> : Hàm hiển thị header của theme

<?php get_footer();?>: Hàm hiển thị footer của theme

Template Themes: Là tên giao diên của Kho giao diên mà mình đặt (Bạn có thể đặt lại theo ý bạn thích)

Template Post Type: post => Nhận diện tên theme post trong quản trị admin

=> Chú ý: Sau khi hoàn thành xong bước 2, bạn hãy vào tất cả bài viết – Sửa nhanh (Post bất kỳ) – Chọn giao diện Template Themes.

Bước 3: Đặt hàm get nội dung ra bên ngoài

Quan trọng nằm ở bước 2 thôi, chứ bước này các bạn chỉ việc dùng các hàm hiển thị nội dung ra ngoài. Cụ thể như dưới đây:

<?php echo the_post_thumbnail() ?> : Hàm hiển thị ảnh đại diện

<?php the_title(); ?> : Hàm hiển thị tiêu đề bài viết

<?php the_content(); ?> : Hàm hiển thị nội dung bài viết

<?php get_comment();?> : Hàm hiển thị bình luận bài viết

<?php the_title(); ?> Lấy tiêu đề.

<?php the_content(); ?> Lấy nội dung.

<?php the_excerpt(); ?> Lấy mô tả.

likebabyshop

<?php the_category(); ?> Lấy chuyên mục.

<?php the_author(); ?> Lấy tác giả.

<?php the_post_thumbnail(); ?> Lấy hình đại diện.

<?php the_date(); ?> Lấy ngày xuất bản.

<?php the_permalink(); ?> Lấy đường dẫn.

Maybelline

Mong rằng, qua bài viết này bạn có thể tự code thiết kế giao diện 1 trang bài viết nhẹ và mượt mà như gái 18+ 😆 . Chúc các bạn thành công!

CayLeo Design

Gợi ý những mẫu giày xinh:

Gợi ý nước hoa thơm lâu toả hương xa:

Gợi ý dành cho nàng:

Gợi ý dành cho chàng:

Khách Hàng Khác Đang Xem: