Cấu trúc các thẻ trong 1 trang để tốt cho SEO

seo-meta-tags-banners
Xem trực tiếp

Hãy kiểm tra và xem xét một số điểm cải thiện trong trang post của bạn:
1. Cấu trúc HTML semantics:
Sử dụng các thẻ như <header>, <main>, <aside> cơ bản.
Có thể thêm các thẻ như <article>, <section>, <nav> để cấu trúc rõ ràng hơn.
2. Tiêu đề:
Sử dụng <h1> cho tiêu đề chính, tốt cho SEO.
Nên sử dụng thêm cấu trúc tiêu đề phân cấp (h2, h3, h4…) trong nội dung bài viết.
3. Meta tags:
Cần thêm các meta tags quan trọng như title, description trong <head>.
4. Schema markup:
Thêm schema markup để cung cấp thông tin cấu trúc cho công cụ tìm kiếm.
5.Tối ưu hóa hình ảnh:
Đảm bảo tất cả hình ảnh đều có thuộc tính alt.
6. Liên kết nội bộ:
Tăng cường liên kết nội bộ giữa các bài viết liên quan.
7. Tốc độ tải trang:
Tối ưu CSSJavaScript để cải thiện tốc độ tải trang.
8. URL thân thiện:
Đảm bảo URL của bài viết ngắn gọn và chứa từ khóa.
9. Nội dung chất lượng:
Tập trung vào việc tạo nội dung chất lượng, độc đáo và có giá trị.
10.Responsive design:
Sử dụng media query, cần đảm bảo trang hiển thị tốt trên mọi thiết bị.

Để cải thiện SEO, bạn có thể thêm các cấu trúc sau:
1. Thêm meta tags trong <head>:

<head>
    <title><?php wp_title('|', true, 'right'); ?></title>
    <meta name="description" content="<?php echo get_the_excerpt(); ?>">
    <!-- Các meta tags khác -->
</head>
2. Thêm schema markup cho bài viết:
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Article",
  "headline": "<?php the_title(); ?>",
  "author": {
    "@type": "Person",
    "name": "<?php the_author(); ?>"
  },
  "datePublished": "<?php the_date('c'); ?>",
  "image": "<?php the_post_thumbnail_url(); ?>"
}
</script>
3. Cải thiện cấu trúc HTML:
<article class="post">
    <header class="head-post">
        <!-- Existing header content -->
    </header>
    
    <div class="post-content-wrapper">
        <main class="area-post">
            <section class="thumbnail-post-wrapper">
                <!-- Thumbnail content -->
            </section>
            <section class="content-post">
                <?php the_content(); ?>
            </section>
        </main>
        
        <aside class="sidebar-post">
            <!-- Sidebar content -->
        </aside>
    </div>
</article>
4. Thêm breadcrumbs để cải thiện điều hướng và SEO:
function custom_breadcrumb() {
    // Không hiển thị trên trang chủ
    if (is_front_page()) return;
    
    // Bắt đầu breadcrumb
    echo '<nav class="breadcrumbs" aria-label="Breadcrumb">';
    echo '<a href="' . home_url() . '">Trang chủ</a> » ';

    if (is_category() || is_single()) {
        $categories = get_the_category();
        if ($categories) {
            echo '<a href="' . esc_url(get_category_link($categories[0]->term_id)) . '">' . esc_html($categories[0]->name) . '</a>';
        }
        if (is_single()) {
            echo ' » ';
            the_title();
        }
    } elseif (is_page()) {
        if ($post->post_parent) {
            $anc = get_post_ancestors($post->ID);
            $anc = array_reverse($anc);
            foreach ($anc as $ancestor) {
                echo '<a href="' . get_permalink($ancestor) . '">' . get_the_title($ancestor) . '</a> » ';
            }
        }
        echo get_the_title();
    } elseif (is_tag()) {
        single_tag_title();
    } elseif (is_day()) {
        echo "Lưu trữ ngày "; the_time('F jS, Y');
    } elseif (is_month()) {
        echo "Lưu trữ tháng "; the_time('F, Y');
    } elseif (is_year()) {
        echo "Lưu trữ năm "; the_time('Y');
    } elseif (is_author()) {
        echo "Lưu trữ tác giả";
    } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) {
        echo "Lưu trữ Blog";
    } elseif (is_search()) {
        echo "Kết quả tìm kiếm";
    }
    
    echo '</nav>';
}
Sau đó, bạn có thể sử dụng hàm này trong template của bạn như sau:
<?php
get_header();
?>

<div class="post-container">
    <?php custom_breadcrumb(); ?>
    
    <header class="head-post">
        <!-- Rest of your code -->
    </header>
    
    <!-- Rest of your template -->
</div>

<?php get_footer(); ?>
Bạn cũng nên thêm một số CSS để định dạng breadcrumb. Ví dụ:
.breadcrumbs {
    margin-bottom: 20px;
    padding: 10px;
    background-color: #f5f5f5;
    border-radius: 5px;
}

.breadcrumbs a {
    color: #0077be;
    text-decoration: none;
}

.breadcrumbs a:hover {
    text-decoration: underline;
}
Nếu bạn sử dụng thêm custom post type trong breadcrumb, bạn sẽ cần chèn mã sau vào function
function custom_breadcrumb() {
    // Không hiển thị trên trang chủ
    if (is_front_page()) return;
    
    // Bắt đầu breadcrumb
    echo '<nav class="breadcrumbs" aria-label="Breadcrumb">';
    echo '<a href="' . home_url() . '">Trang chủ</a> » ';

    if (is_category() || is_single()) {
        $post_type = get_post_type();
        if ($post_type != 'post') {
            $post_type_object = get_post_type_object($post_type);
            $post_type_archive = get_post_type_archive_link($post_type);
            echo '<a href="' . $post_type_archive . '">' . $post_type_object->labels->name . '</a> » ';
        }
        
        if (is_category()) {
            $category = get_category(get_query_var('cat'));
            echo esc_html($category->name);
        } elseif (is_single()) {
            if ($post_type == 'post') {
                $categories = get_the_category();
                if ($categories) {
                    echo '<a href="' . esc_url(get_category_link($categories[0]->term_id)) . '">' . esc_html($categories[0]->name) . '</a> » ';
                }
            }
            the_title();
        }
    } elseif (is_page()) {
        if ($post->post_parent) {
            $anc = get_post_ancestors($post->ID);
            $anc = array_reverse($anc);
            foreach ($anc as $ancestor) {
                echo '<a href="' . get_permalink($ancestor) . '">' . get_the_title($ancestor) . '</a> » ';
            }
        }
        echo get_the_title();
    } elseif (is_tag()) {
        single_tag_title();
    } elseif (is_day()) {
        echo "Lưu trữ ngày "; the_time('F jS, Y');
    } elseif (is_month()) {
        echo "Lưu trữ tháng "; the_time('F, Y');
    } elseif (is_year()) {
        echo "Lưu trữ năm "; the_time('Y');
    } elseif (is_author()) {
        echo "Lưu trữ tác giả";
    } elseif (is_post_type_archive()) {
        echo post_type_archive_title('', false);
    } elseif (is_tax()) {
        $term = get_term_by('slug', get_query_var('term'), get_query_var('taxonomy'));
        $taxonomy = get_taxonomy(get_query_var('taxonomy'));
        echo $taxonomy->labels->name . ' » ' . $term->name;
    } elseif (isset($_GET['paged']) && !empty($_GET['paged'])) {
        echo "Lưu trữ Blog";
    } elseif (is_search()) {
        echo "Kết quả tìm kiếm";
    }
    
    echo '</nav>';
}
Những thay đổi chính trong hàm này bao gồm:

1. Xử lý cho custom post types trong trường hợp bài viết đơn (is_single()).
2. Thêm xử lý cho trang lưu trữ của custom post type (is_post_type_archive()).
3. Thêm xử lý cho các trang taxonomy của custom post type (is_tax()).

Hàm này sẽ hiển thị breadcrumb cho hầu hết các loại trang trong WordPress, bao gồm cả các custom post types và taxonomies của chúng.
Để sử dụng, bạn có thể gọi hàm này trong template của bạn như trước:
<?php custom_breadcrumb(); ?>