Hướng dẫn tạo website bằng Theme Wordpress từ Bootstrap 4 [2019] - Phần 10
Ở phần 10 này mình sẽ hướng dẫn bạn file cuối cùng là tag.php và tối ưu lại breadcrumbs, custom field cho wordpress
Tag.php
Tag như là cầu nối giữa các bài viết cùng hoặc khác chủ đề lại với nhau, tag quan trọng trong việc liên kết nội cho blog vì thế mọi bài viết cần có các tag liên quan đến nhau.
Tạo file tag.php
- wp-content/themes/logicviet/tag.php
Copy nội dung file category.php vào file tag.php thay H1 bằng nội dung sau:
<h1 class="my-2 mb-4 page-header">
Thẻ:
<small><?php single_tag_title() ?></small>
</h1>
Hàm single_tag_title dùng để gọi tên của thẻ.
Kế đến bạn mở file content-single.php và dùng hàm the_tags để gọi các thẻ
<?php the_tags() ?>
Kết quả trong bài viết.
Khi click vào 1 tag bất kỳ nó sẽ truy xuất vào file tag.php để lấy dữ liệu
Breadcrumbs
Mở file functions.php và thêm các mệnh đề sau:
elseif (is_page()) {
the_title('<span class="breadcrumb-item active">','</span>');
} elseif (is_tag()) {
echo '<span class="breadcrumb-item active">Thẻ</span>';
} elseif (is_search()) {
echo '<span class="breadcrumb-item active">Tìm kiếm</span>';
} elseif (is_author()) {
echo '<span class="breadcrumb-item active">Tác giả</span>';
} elseif (is_archive()) {
echo '<span class="breadcrumb-item active">Lưu trữ</span>';
}else{
echo '<span class="breadcrumb-item active">Error 404</span>';
}
Kết quả ta được:
Tùy biến Custom Field trong Wordpress
Vì theme này viết mình sẽ không sử dụng plugin SEO chạy với web vì thế mình sẽ sử dụng Custom Field để cấu hình thẻ Title, Description, Keywords cho theme.
Mở file header.php và thay đổi code sau:
Mình sẽ viết đơn giản nhất để bạn có thể hiểu được
<title>
<?php if (is_home()): ?>
<?php bloginfo('name') ?>
<?php elseif( is_single() ): ?>
<?php echo get_field('seo_title'); ?>
<?php else: ?>
<?php wp_title('', true,''); ?>
<?php endif ?>
</title>
<?php if (is_home()): ?> <!-- Khi ở trang chủ -->
<meta name="description" content="<?php bloginfo('description') ?>" />
<?php elseif(is_single()): ?> <!-- Khi ở trang bài viết -->
<meta name="description" content="<?php echo get_field('seo_description'); ?>" />
<meta name="keywords" content="<?php echo get_field('seo_keywords'); ?>" />
<?php endif ?>
Giải thích:
Ta dùng hàm is_home để xác định vị trí trang chủ
hàm is_single để xác định đây là bài viết
hàm wp_title dùng để show tiêu đề toàn cục cho các category, page, search...
hàm get_field sử dụng để gọi tên của custom field ta định nghĩa trong Backend
blog_info('name') và blog_info('description') sẽ lấy ở phần Backend WP
Hướng dẫn tạo custom field trong Wordpress.
Custom field bạn hiểu đơn giản là nó cho phép ta tạo dữ liệu trong bài viết, tạo khung, select, checkbox đại khái là những cái Wordpress không có nhưng ta muốn thêm vào.
Để tạo custom field cho wordpress bạn tải plugin sau: Advanced Custom Fields đây là plugin giúp ta tạo custom field nhanh chóng.
Sau khi cài đặt xong và kích hoạt plugin bạn vào Custom Fields và chọn Add New
Sẽ xuất hiện như hình
- Tiêu đề của custom field
- Tên của custom field
- Loại custom field, ở đây mình chọn là text
- Giới hạn nhập
- Loại bài viết là dạng bài viết
- Add Field
Lần lượt làm tiếp cho Seo description và Seo keywords, nhưng ở bước 3 mình chọn loại textarea.
Sau đó bạn bấm Cập nhật
Vào phần Bài viết > Viết bài mới bạn sẽ thấy
Từ giờ khi viết bài bạn sẽ chèn thêm nội dung ở 3 khung sau để tối ưu tiêu đề, mô tả, từ khóa của mỗi bài nhé.
- Seo title: <= 65 ký tự
- Seo description: <= 156 ký tự
- Seo keywords: <= 10 từ
Chúc các bạn thành công
Download file code bài học
0 Comments
no comments!
Bài viết liên quan
![Hướng dẫn tạo website bằng Theme Wordpress từ Bootstrap 4 [2019] - Phần 4](https://logicviet.com/images/posts/6193569.PNG)
![Hướng dẫn tạo website bằng Theme Wordpress từ Bootstrap 4 [2019] - Phần 2](https://logicviet.com/images/posts/63413435.PNG)
![Hướng dẫn tạo website bằng Theme Wordpress từ Bootstrap 4 [2019] - Phần 3](https://logicviet.com/images/posts/42289365.PNG)
Theo Dõi Trang
- Bài Viết Mới
- Tags
Các cách xóa và giảm dung lượng ổ C win 10 hiệu quả nhất
2 năm trước
Ổ cứng của máy tính, laptop bị đầy sau một thời gian dài sử dụng là vấn đề thường gặp của nhiều người. Nếu dung lượng ổ cứng quá lớn có thể ảnh hưởng đến tốc độ xử lý của nhiều ứng dụng và hoạt động của bạn. Vì vậy, việc quản lý, dọn dẹp ổ cứng nói chung và ổ đĩa C nói riêng nên thực hiện thường xuyên
Các website chuyển văn bản thành giọng nói online tốt nhất
2 năm trước
Bạn đang tìm kiếm các trang web giúp bạn chuyển văn bản thành giọng nói online trên máy tính một cách chính xác và nhanh chóng nhất. Bài viết dưới đây sẽ tổng hợp cho các bạn TOP 8 trang web chuyển văn bản thành giọng nói online tốt nhất.
UTM Tracking là gì? Hướng dẫn tạo UTM vào quản lý hiệu quả Marketing
2 năm trước
UTM (viết tắt cho Urchin tracking module), hay UTM code là một đoạn mã đơn giản được gắn vào các đường dẫn URL tùy chỉnh của bạn, giúp theo dõi các nguồn, phương tiện trung gian, hoặc tên các chiến dịch của bạn.
Cách sử dụng hàm Query trong Google Sheet
2 năm trước
Bạn làm việc với lượng lớn dữ liệu trên Google Sheet, việc lọc và tìm kiếm dữ liệu theo cách thủ công sẽ tốn rất nhiều thời gian. Hàm QUERY trong Google Sheet giúp bạn có thể tra cứu và lọc dữ liệu theo bất kỳ định dạng nào bạn muốn. Cùng tìm hiểu cách dùng hàm QUERY nhé!
Cách tính lãi suất vay mua nhà và số tiền phải trả hàng tháng
2 năm trước
Hiện nay, hầu hết những người có thu nhập thấp hoặc trung bình sẽ lựa chọn phương án vay vốn ngân hàng để mua nhà. Tuy nhiên, bạn có biết để có thể làm thủ tục vay vốn người mua cần đáp ứng được những điều kiện gì? Các mức lãi suất? Số tiền trả hàng tháng?
Hướng dẫn cách sử dụng và cài đặt Google Tag Manager
2 năm trước
Trình quản lý thẻ của Google – Google Tag Manager là một công cụ được thiết lập để giải quyết các vấn đề của doanh nghiệp giữa các phòng ban, theo dõi chiến dịch marketing, quản lý thẻ JavaScript và HTML, chủ động cập nhật website,…