Rút gọn tiêu đề trong WordPress không cần plugin

Có một vài lý do trong khi thiết kế theme cho wordpress, các bạn không muốn tiêu đề của bài viết quá dài. Bởi vì như vậy có thể làm vỡ layout hoặc bố cục trông xấu hơn. Để giải quyết vấn đề này có một cách khá đơn giản mà chúng ta không cần sử dụng plugin nào cả. Sau đây mình sẽ hướng dẫn các bạn làm điều đó.  

Cách 1: Sử dụng Action Hooks trong WordPress

Trong vòng lặp của WordPress hàm để gọi tiêu đề bài viết là

<?php the_title( $before, $after, $echo ); ?>
  • $before : Nội dung phía trước Tiêu đề (Có thể là text, html) (Mặc định là none)
  • $after: Nội dung phía sau Tiêu đề (Có thể là text, html) (Mặc định là none)
  • $echo: Hiển thị tiêu đề hay không (FALSE, TRUE) (Mặc định là TRUE)

Để rút ngắn tiêu đề của các bạn thêm đoạn code sau vào file functions.php

function short_title($after = '', $length) {
    $qdztitle = explode(' ', get_the_title(), $length);
    if (count($qdztitle)>=$length) {
        array_pop($qdztitle);
        $qdztitle = implode(" ",$qdztitle). $after;
    } else {
        $qdztitle = implode(" ",$qdztitle);
    }
    return $qdztitle;
}

Để sử dụng thay vì các bạn gọi hàm the_title các bạn sử dụng short_title. Các bạn có thể quy định số lượng ký tự tùy ý

<?php echo short_title('...', 10); ?>

 

Cách 2: Sử dụng HTML và CSS

Các bạn sử dụng đoạn CSS phía dưới đây để quy định chiều dài tối đa cho tiêu đề. Nêu tiêu đề dài quá 220px nó tự động chuyển thành ký tự “…”

.title {
    display: inline-block;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

Và để sử dụng trong themes các bạn chỉ cần thêm class .title vào những chỗ nào cần rút ngắn. Chúc các bạn thành công !

5/5 - (1 bình chọn)