Chèn custom nội dung vào trước hoặc sau bài viết WordPress

Trong các trang và bài đăng bạn có thể muốn thêm, chèn hoặc custom nội dung vào trước hoặc sau bài viết trong WordPress của bạn. Rất đơn giản, itsmeit sẽ minh họa cách dễ dàng nhất để bạn có thể thực hiện việc này mà không làm hỏng trang web của mình.

[HD] Cách chèn nội dung vào trước hoặc sau bài viết trong WordPress

Trước khi thực hiện, chúng ra hãy tìm hiểu qua về Hook trong WordPress, Hooks là một cách để một đoạn mã tương tác / sửa đổi một đoạn mã khác tại các điểm cụ thể, được xác định trước. Chúng tạo nên nền tảng cho cách các plugin và chủ đề tương tác với WordPress Core, nhưng chúng cũng được sử dụng rộng rãi bởi chính Core. (tham khảo).

Để có thể chèn hay custom một nội dung, đoạn text bất kỳ mà bạn muốn nó hiển thị, thêm nó vào đầu bài viết hoặc cuối bài viết bạn sẽ cần sử dụng đến hàm the_content. Hàm này có chức năng là hiển thị nội dung bài đăng và chức năng của nó như sau:

function the_content($more_link_text = null, $strip_teaser = false){
   $content = get_the_content($more_link_text, $strip_teaser);
   
   /**
    * Filters the post content.
    *
    * @param string $content Content of the current post.
    * @since 0.71
    *
    */   $content = apply_filters('the_content', $content);
   $content = str_replace(']]>', ']]>', $content);
   echo $content;
}

Nhìn vào function the_content bạn sẽ thấy nó echo $content, content ở đây tức là post/bài viết trên trang web cửa bạn. Vậy để thêm, custom nội dung vào trước hay sau content chắc hẳn bạn đã hình dung được phần nào rồi.

Trong WordPress sẽ có hai loại hook: Actions và Filters, và cách để hàm the_content hoạt động là như sau:

apply_filters( 'the_content', string $content )

Vậy để sử dụng được hàm the_content chúng ta sẽ sử dụng đến add_filter, hàm này có chức năng là callback, gọi lại vào một hook khác, cụ thể là sẽ add_filter sẽ callback đến the_content. Bây giờ sẽ là cách mà itsmeit sẽ hướng dẫn bạn thực hiện.

[HD] Cách chèn nội dung vào trước bài viết WordPress

Mã code để thêm custom nội dung vào trước post/page, chỉ cần nối chuỗi nó đứng trước biến $content và return biến $fullContent như sau:

add_filter('the_content', 'add_content_before');

function add_content_before($content) {

      $beforeContent = "Đây là nội dung sẽ hiển thị trước bài viết";

      $fullContent = $beforeContent . $content ;

      return $fullContent;

}

Hiểu đơn giản cho đoạn code trên nghĩa là nối chuỗi cho nó đứng trước biến $content thì nó sẽ đứng trước.

[HD] Cách custom nội dung vào sau bài viết WordPress

Tương tự như cách chèn nội dung vào trước post/page, mã code để thêm custom nội dung vào sau post/page bạn cũng chỉ cần nối chuỗi nó đứng sau biến $content và return biến $fullContent như sau:

add_filter('the_content', 'add_content_after');

function add_content_after($content) {

     $afterContent = "Đây là nội dung sẽ hiển thị sau bài viết";
 
     $fullContent = $content . $afterContent;

     return $fullContent;

}

[HD] Chèn nội dung vào cả trước và sau bài viết trong WordPress

Bạn cũng có thể có một kịch bản kết hợp mà bạn muốn hiển thị nội dung trước và sau the_content và điều này có thể đạt được bằng đoạn mã sau:

add_filter('the_content', ' add_content_before_and_after);

function add_content_before_and_after($content) {

      $beforeContent = "Đây là nội dung sẽ hiển thị trước bài viết";

      $afterContent = "Đây là nội dung sẽ hiển thị sau bài viết";

      $fullContent = $beforeContent . $content . $afterContent;

     return $fullContent;

}

Tương tự, chúng ta có thể hiểu đơn giản cho đoạn code trên nghĩa là nối chuỗi cho nó đứng sau biến $content thì nó sẽ đứng sau.

Vậy là với những phương pháp thêm/add, hay custom nội dung vào cuối hoặc đầu bài viết trong WordPress như itsmeit đã hướng dẫn, bạn có thể chèn code vào trang web của mình bằng cách viết plugin hoặc đơn giản hơn là chèn nó vào trong class function.php của theme bạn đang sử dụng. Nếu có câu hỏi hãy để lại bình luận bên dưới nhé!