3 cách thêm rotating testimonials vào WordPress

3 Cách Thêm Rotating Testimonials Vào WordPress

Testimonials (Lời chứng thực) là một phần quan trọng của bất kỳ trang web nào, đặc biệt là những trang web bán hàng hoặc cung cấp dịch vụ. Chúng giúp xây dựng lòng tin, tăng độ uy tín và thuyết phục khách hàng tiềm năng về giá trị mà bạn mang lại. Việc hiển thị các lời chứng thực một cách tĩnh có thể hiệu quả, nhưng việc sử dụng rotating testimonials (lời chứng thực xoay vòng) sẽ thu hút sự chú ý hơn và cho phép bạn giới thiệu nhiều lời chứng thực hơn mà không làm trang web trở nên quá dài.

Trong bài viết này, chúng ta sẽ khám phá 3 cách đơn giản để thêm rotating testimonials vào trang web WordPress của bạn, từ việc sử dụng plugin miễn phí đến các giải pháp tùy chỉnh hơn.

Cách 1: Sử Dụng Plugin WordPress Miễn Phí

Đây là cách dễ dàng nhất và nhanh nhất để thêm rotating testimonials. Có rất nhiều plugin miễn phí có sẵn trong kho plugin WordPress, mỗi plugin có các tính năng và giao diện khác nhau. Dưới đây là một số plugin phổ biến:

• Testimonial Rotator: Plugin này cung cấp giao diện trực quan để tạo và quản lý testimonials. Nó cho phép bạn tùy chỉnh giao diện, tốc độ xoay vòng và các hiệu ứng chuyển tiếp.
• Easy Testimonials: Một plugin đơn giản và dễ sử dụng, phù hợp cho người mới bắt đầu. Nó có một số template dựng sẵn và tùy chọn tùy chỉnh cơ bản.
• Strong Testimonials: Một plugin mạnh mẽ với nhiều tính năng nâng cao, bao gồm hỗ trợ các trường tùy chỉnh, đánh giá sao và tích hợp với các mạng xã hội.

Hướng dẫn sử dụng plugin Testimonial Rotator (ví dụ):

1. Cài đặt và kích hoạt plugin: Truy cập “Plugins” > “Add New” trong bảng điều khiển WordPress của bạn. Tìm kiếm “Testimonial Rotator” và cài đặt plugin. Sau khi cài đặt, hãy kích hoạt plugin.
2. Thêm testimonials: Sau khi kích hoạt, bạn sẽ thấy một mục menu mới có tên “Testimonials” trong bảng điều khiển. Nhấp vào “Add New” để thêm lời chứng thực đầu tiên của bạn.
3. Điền thông tin testimonial: Nhập nội dung testimonial, tên tác giả, chức danh và ảnh (tùy chọn).
4. Tạo một rotator: Vào “Testimonial Rotator” > “Testimonial Rotators” và nhấp vào “Add New”. Đặt tên cho rotator của bạn và chọn các testimonials bạn muốn hiển thị trong rotator này.
5. Tùy chỉnh rotator: Tùy chỉnh các tùy chọn như tốc độ xoay vòng, hiệu ứng chuyển tiếp, hiển thị mũi tên điều hướng và chấm chỉ mục.
6. Nhúng rotator vào trang web: Sử dụng shortcode được cung cấp để nhúng rotator vào bất kỳ trang hoặc bài đăng nào. Shortcode thường có dạng [testimonial_rotator id="1"] (thay “1” bằng ID của rotator bạn đã tạo).

Ưu điểm:

• Dễ cài đặt và sử dụng.
• Có nhiều plugin miễn phí để lựa chọn.
• Không yêu cầu kiến thức lập trình.

Nhược điểm:

• Khả năng tùy chỉnh có thể bị hạn chế tùy thuộc vào plugin.
• Có thể làm chậm trang web nếu sử dụng quá nhiều plugin.

Cách 2: Sử Dụng Plugin WordPress Premium (Trả Phí)

Plugin premium (trả phí) thường cung cấp nhiều tính năng hơn, giao diện đẹp hơn và hỗ trợ tốt hơn so với plugin miễn phí. Nếu bạn muốn một giải pháp chuyên nghiệp hơn với khả năng tùy chỉnh cao, thì đây là một lựa chọn tốt.

Một số plugin premium phổ biến:

• Testimonial Slider: Plugin này cung cấp nhiều template đẹp mắt, các tùy chọn tùy chỉnh nâng cao và tích hợp với Visual Composer.
• GS Testimonial Slider: Một plugin mạnh mẽ với nhiều hiệu ứng chuyển tiếp, hỗ trợ video testimonials và tích hợp với WooCommerce.
• Ultimate Testimonials: Plugin này cho phép bạn tạo testimonials với các trường tùy chỉnh, đánh giá sao và hiển thị chúng trong nhiều định dạng khác nhau.

Ưu điểm:

• Nhiều tính năng và tùy chọn tùy chỉnh hơn.
• Giao diện chuyên nghiệp và đẹp mắt.
• Hỗ trợ tốt hơn từ nhà phát triển.

Nhược điểm:

• Yêu cầu chi phí đầu tư ban đầu.
• Có thể phức tạp hơn để sử dụng so với plugin miễn phí.

Cách 3: Tạo Rotating Testimonials Bằng Code (Custom)

Nếu bạn có kiến thức về HTML, CSS và JavaScript (hoặc PHP), bạn có thể tự tạo rotating testimonials bằng code. Cách này cho phép bạn hoàn toàn kiểm soát giao diện và chức năng, nhưng đòi hỏi nhiều thời gian và công sức hơn.

Ví dụ đơn giản sử dụng HTML, CSS và JavaScript:

<div class="testimonial-container">
  <div class="testimonial">
    <p>Đây là lời chứng thực thứ nhất.</p>
    <p class="author">- John Doe</p>
  </div>
  <div class="testimonial">
    <p>Đây là lời chứng thực thứ hai.</p>
    <p class="author">- Jane Smith</p>
  </div>
  <div class="testimonial">
    <p>Đây là lời chứng thực thứ ba.</p>
    <p class="author">- Peter Jones</p>
  </div>
</div>

<style>
.testimonial-container {
  position: relative;
  overflow: hidden;
  height: 150px; /* Điều chỉnh chiều cao cho phù hợp */
}

.testimonial {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.testimonial.active {
  opacity: 1;
}
</style>

<script>
const testimonials = document.querySelectorAll('.testimonial');
let currentTestimonial = 0;

function showNextTestimonial() {
  testimonials[currentTestimonial].classList.remove('active');
  currentTestimonial = (currentTestimonial + 1) % testimonials.length;
  testimonials[currentTestimonial].classList.add('active');
}

testimonials[currentTestimonial].classList.add('active'); // Hiển thị testimonial đầu tiên
setInterval(showNextTestimonial, 5000); // Thay đổi testimonial mỗi 5 giây
</script>

Lưu ý: Đoạn code trên là một ví dụ đơn giản và có thể cần được điều chỉnh để phù hợp với thiết kế trang web của bạn. Bạn có thể thêm CSS để tạo kiểu cho testimonials và JavaScript để tùy chỉnh các hiệu ứng chuyển tiếp.

Cách nhúng code vào WordPress:

1. Sử dụng theme con: Tạo một theme con để tránh mất các thay đổi khi cập nhật theme chính.
2. Thêm HTML vào trang hoặc bài đăng: Sử dụng trình soạn thảo văn bản hoặc plugin chỉnh sửa HTML để thêm đoạn code HTML vào trang hoặc bài đăng bạn muốn hiển thị testimonials.
3. Thêm CSS vào file style.css của theme con: Mở file style.css của theme con và thêm đoạn code CSS vào đó.
4. Thêm JavaScript vào file script.js của theme con: Tạo một file script.js trong thư mục của theme con và thêm đoạn code JavaScript vào đó. Sau đó, nhúng file script.js vào file functions.php của theme con. Ví dụ:

function my_theme_scripts() {
  wp_enqueue_script( 'custom-script', get_stylesheet_directory_uri() . '/script.js', array( 'jquery' ), '1.0', true );
}
add_action( 'wp_enqueue_scripts', 'my_theme_scripts' );

Sử dụng shortcode (phức tạp hơn): Bạn có thể tạo một shortcode trong file functions.php của theme để chứa đoạn code HTML. Điều này cho phép bạn nhúng testimonials vào trang web một cách dễ dàng bằng cách sử dụng shortcode.

Ưu điểm:

• Hoàn toàn kiểm soát giao diện và chức năng.
• Có thể tùy chỉnh mọi thứ theo ý muốn.
• Không phụ thuộc vào plugin.

Nhược điểm:

• Đòi hỏi kiến thức lập trình.
• Tốn nhiều thời gian và công sức.
• Cần phải bảo trì code khi có cập nhật WordPress.

Kết luận

Việc thêm rotating testimonials vào trang web WordPress của bạn là một cách tuyệt vời để cải thiện độ tin cậy và thuyết phục khách hàng. Tùy thuộc vào kỹ năng và nhu cầu của bạn, bạn có thể chọn một trong ba cách trên: sử dụng plugin miễn phí, plugin trả phí hoặc tự code. Chúc bạn thành công!