Làm thế nào để Thêm một hộp Thông tin Tác giả trong WordPress Bài viết

Bạn có muốn thêm một hộp sinh viên tác giả trong các bài đăng WordPress của mình không? Hộp sinh học của tác giả là một phần nhỏ, nơi bạn có thể hiển thị thông tin về tác giả bài đăng có liên kết đến trang web và tiểu sử trên mạng xã hội của họ. Trong bài này, chúng tôi sẽ giới thiệu cách thêm một hộp thông tin tác giả trong WordPress.

Thêm hộp thông tin của tác giả trong WordPress

Tại sao và khi nào bạn cần một hộp Thông tin Tác giả trong WordPress

Nhìn thấy một người thực sự đằng sau nội dung giúp xây dựng sự tín nhiệm và tăng cường thẩm quyền của trang web giữa những người dùng.

Đối với các trang web tác giả duy nhất, bạn chỉ có thể thêm một trang về tôi. Nhưng đối với một trang web WordPress nhiều tác giả, bạn sẽ cần thêm một hộp thông tin của tác giả bên dưới mỗi bài đăng.

Hộp tác giả khuyến khích tác giả tương tác với độc giả. Nó cung cấp một động lực bổ sung cho các tác giả để xây dựng của riêng mình sau.

Nếu bạn chấp nhận bài đăng của khách từ các blogger khác trên trang web của bạn, thì hộp thông tin của tác giả sẽ giúp bạn thu hút nhiều hơn trên trang web của bạn.

Có nói rằng, chúng ta hãy xem làm thế nào để dễ dàng thêm một hộp thông tin tác giả trong WordPress bài viết.

Thêm Hộp Thông tin về Tác giả trong WordPress Bài đăng

Tuy nhiên, nếu bạn chỉ muốn theo các hướng dẫn văn bản, sau đó bạn có thể làm theo hướng dẫn từng bước về cách thêm hộp thông tin của tác giả trong WordPress.

Có nhiều cách khác nhau mà bạn có thể sử dụng để thêm phần thông tin của tác giả. Chúng tôi sẽ cho bạn thấy hai plugin khác nhau cũng như phương pháp mã. Bằng cách này bạn có thể chọn một phương pháp hoạt động tốt nhất cho trang web của bạn.

Phương pháp 1: Hộp tác giả Dưới đây WordPress Bài viết Sử dụng Plugin

Hầu hết các chủ trang web muốn hiển thị thông tin tác giả ở cuối bài đăng. Đây là cách bạn có thể dễ dàng hiển thị một hộp thông tin tác giả ở cuối bài viết WordPress.

Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Khung tác giả của Guerrilla. Để biết thêm chi tiết

Mỗi tác giả trên trang web của bạn sẽ cần phải thêm thông tin tiểu sử của họ và các liên kết đến hồ sơ người dùng của họ. Họ có thể làm điều này bằng cách đăng nhập vào tài khoản WordPress của họ trên trang web của bạn và sau đó nhấp vào liên kết Tiểu sử từ trình đơn quản trị WordPress.

Người dùng chỉnh sửa hồ sơ riêng của họ trong WordPress

Là quản trị viên trang web, bạn cũng có thể tự điền thông tin này bằng cách chỉnh sửa hồ sơ của mỗi người dùng. Bạn sẽ cần phải truy cập Người dùng »Tất cả người dùng trang và sau đó nhấp vào liên kết chỉnh sửa bên dưới người dùng bạn muốn chỉnh sửa.

Chỉnh sửa hồ sơ người dùng bằng một Quản trị viên trong WordPress

Bây giờ bạn có thể truy cập bất kỳ bài viết WordPress nào trên trang web của bạn và bạn sẽ thấy hộp thông tin của tác giả bên dưới bài đăng.

Hộp thông tin của tác giả được thêm vào với plugin

Plugin này sử dụng hệ thống avatar WordPress mặc định, được gọi là Gravatar. Tác giả của bạn sẽ cần phải thêm ảnh của họ trên trang web Gravatar. Để biết thêm thông tin, hãy xem hướng dẫn của chúng tôi về Gravatar, và tại sao bạn nên bắt đầu sử dụng nó ngay.

Tùy chỉnh giao diện của Hộp Thông tin Tác giả

Hộp thoại Tác giả của Quái vật đi kèm với CSS rất cơ bản. Nó kế thừa các liên kết và màu chữ từ chủ đề WordPress của bạn.

Tuy nhiên, nếu bạn muốn tùy chỉnh nó, và bạn cảm thấy thoải mái khi làm việc với CSS, thì bạn có thể sao chép CSS mặc định của plugin và dán nó vào chủ đề hoặc biểu mẫu kiểu chủ đề của trẻ.

Dưới đây là một mẫu CSS mà bạn có thể sử dụng như một điểm khởi đầu. Chúng tôi đã thay đổi màu nền và làm cho hình ảnh của tác giả thay vì hình vuông.

.guerrillawrap {
     nền: #ECECEC;
     -chọn hộp-hộp-hộp: hộp-biên;
     -moz-box-sizing: hộp biên giới;
     -ms-box-sizing: hộp biên giới;
     hộp kích thước: hộp biên giới;
     biên giới: 1px solid # d0d0d0;
     phao: trái;
     đệm: 2%;
     Chiều rộng: 100%;
 }

 .guerrillagravatar {
     phao: trái;
     lề: 0 10px 0 0;
     chiều rộng: 10%;
 }

 .guerrillagravatar img {
 bán kính biên giới: 50%;
 biên giới: 1 px chắc chắn #eee;
 }

 .guerrillatext {
     phao: trái;
     Chiều rộng: 84%;
 }

 .guerrillatext h4 {
     font-size: 20px;
     chiều cao dòng: 20px;
     lề: 0 0 0 0;
     đệm: 0;
 }

 .guerrillatext p {
     lề: 10px 0 15px 0;
     kiểu chữ: italic;
 }

 .guerrillasocial {
     phao: trái;
     Chiều rộng: 100%;
 }

 .guerrillasocial a {
     biên giới: 0;
     lề phải: 10px;
 } 

Đây là cách hộp thông tin tác giả nhìn vào trang web giới thiệu của chúng tôi sau khi áp dụng CSS này. Bạn có thể trông hơi khác nhau tùy thuộc vào phông chữ và màu sắc được sử dụng bởi chủ đề WordPress của bạn.

Hộp thông tin tác giả có hình tròn

Phương pháp 2: Thông tin về Tác giả trong Widget Thanh bên Đối với Các bài đăng Đơn

Phương pháp trên là tuyệt vời nếu bạn muốn hiển thị thông tin tác giả dưới bài viết. Tuy nhiên, một số bạn có thể muốn hiển thị tác giả sinh học trong thanh bên hoặc bất kỳ khu vực nào sẵn có của widget.

Đây là cách bạn có thể hiển thị thông tin tác giả trong tiện ích phụ.

Điều đầu tiên bạn cần làm là cài đặt và kích hoạt trình cắm Widget Tác giả thông minh của Mex

Khi kích hoạt, bạn cần truy cập Appearance »Widget trang. Ở đó bạn sẽ tìm thấy Tác giả thông minh của Microsoft dưới danh sách các vật dụng có sẵn. Thêm tiện ích này vào thanh bên mà bạn muốn hiển thị thông tin tác giả.

Tiện ích tác giả thông minh

Widget đi kèm với một số tùy chọn. Tùy chọn quan trọng nhất mà bạn cần kiểm tra là hộp kiểm bên cạnh ‘Tự động phát hiện tác giả’ Tùy chọn.

Tự động phát hiện phụ tùng tác giả

Nhấp vào nút lưu để lưu cài đặt tiện ích của bạn. Giờ đây, bạn có thể truy cập trang web của mình để xem tiện ích thông tin tác giả đang hoạt động.

Tiện ích thông tin của tác giả trong WordPress

Plugin này cũng tìm nạp thông tin người dùng từ hồ sơ WordPress của họ. Tác giả của bạn sẽ cần phải điền thông tin tiểu sử của họ.

Phương pháp 3: Thêm Hộp Thông tin Tác giả Sử dụng Mã

Cả hai phương pháp mô tả ở trên đều dựa vào các plugin. Nếu vì lý do nào đó bạn cần phải thêm hộp thông tin tác giả theo cách thủ công, thì đây là cách bạn có thể làm điều đó.

Đầu tiên, bạn cần thêm mã này vào tệp functions.php của chủ đề hoặc một plugin dành cho trang web.

hàm wpb_author_info_box ($ nội dung) {

 bài đăng toàn cầu $;

 // Phát hiện nếu đó là một bài đăng với tác giả bài đăng
 if (is_single () && isset ($ post-> post_author)) {

 // Lấy tên hiển thị của tác giả
 $ display_name = get_the_author_meta ('display_name', $ post-> post_author);

 // Nếu tên hiển thị không có sẵn, hãy sử dụng biệt hiệu làm tên hiển thị
 if (empty ($ display_name))
 $ display_name = get_the_author_meta ('biệt danh', $ post-> post_author);

 // Lấy thông tin hoặc mô tả tiểu sử của tác giả
 $ user_description = get_the_author_meta ('user_description', $ post-> post_author);

 // Lấy URL trang web của tác giả
 $ user_website = get_the_author_meta ('url', $ post-> post_author);

 // Lấy liên kết đến trang lưu trữ tác giả
 $ user_posts = get_author_posts_url (get_the_author_meta ('ID', $ post-> post_author));
 
 if (! empty ($ display_name))

 $ author_details = ' 

Trong khoảng ' . $ display_name. '

'; if (! empty ($ user_description)) // Ảnh đại diện của tác giả và tiểu sử $ author_details. = '

'. get_avatar (get_the_author_meta ('user_email'), 90). nl2br ($ user_description). '

'; $ author_details. = ' '; } else { / / nếu không có tác giả trang web sau đó chỉ cần đóng đoạn $ author_details. = ''; } // Truyền hết thông tin này để đăng nội dung $ nội dung = $ nội dung. '
'. $ author_details. '
'; } trở lại nội dung $; } // Thêm chức năng của chúng tôi vào bộ lọc nội dung bài đăng add_action ('the_content', 'wpb_author_info_box'); // Cho phép HTML trong phần sinh học của tác giả remove_filter ('pre_user_description', 'wp_filter_kses');

Mã này đơn giản tìm nạp thông tin của tác giả và hiển thị nó dưới các bài viết WordPress. Bạn cần phải tô hộp thông tin tác giả này để nó trông đẹp mắt và phù hợp với chủ đề WordPress của bạn.

Bạn có thể sử dụng CSS này vào chủ đề hoặc biểu mẫu kiểu chủ đề của trẻ em. Bạn có thể sửa đổi nó để đáp ứng nhu cầu của bạn.

.author_bio_section {
 nền: không lặp lại cuộn 0 0 # F5F5F5;
 padding: 15px;
 biên giới: 1px solid #ccc;
 }

 .tên tác giả{
 kích cỡ phông chữ: 16px;
 phông chữ trọng lượng: đậm;
 }

 .author_details img {
 biên giới: 1px rắn # D8D8D8;
 bán kính biên giới: 50%;
 phao: trái;
 lề: 0 10px 10px 0;
 } 

Đây là cách hộp thông tin của tác giả nhìn vào trang demo của chúng tôi.

Hộp thông tin tác giả thủ công

Chúng tôi hy vọng bài viết này đã giúp bạn thêm hộp thông tin tác giả trong các bài viết WordPress