Thêm jQuery FAQ (Câu hỏi thường gặp) trong WordPress

Quảng cáo
Ads_ngang
Website dinhthuanit.com có bài Thêm jQuery FAQ (Câu hỏi thường gặp) trong WordPress

Gần đây, một trong các người sử dụng của chúng mình đã hỏi chúng tôi rằng có cách nào để họ thêm một câu hỏi thường gặp trên trang web WordPress của họ không. Có rất nhiều plugin có sẵn cho phép bạn thêm phần câu hỏi hoặc câu hỏi thường gặp trong WordPress. Trong bài viết này, chúng tôi sẽ chỉ cho bạn cách thêm một accordion FAQ của jQuery trong trang web WordPress của bạn.

Accordion là gì?

Trong thiết kế web, accordion là một thuật ngữ được sử dụng cho mẫu thiết kế giao diện người dùng có các tab hoặc khối nội dung thu gọn hoặc mở rộng. Mỗi tab có nội dung bên dưới chúng sẽ mở rộng khi người dùng nhấp vào mục menu. Nói một cách đơn giản, nó giống như một menu mở rộng khi bạn nhấp vào nó. Dưới đây tỉ dụ của một accordion mẫu.

Thêm jQuery FAQ Accordion

Trước khi bạn cũng có thể thêm một accordion FAQ của jQuery, bạn phải đáp ứng rằng bạn có phần FAQ. Nếu website của bạn chưa xuất hiện nội dung câu hỏi thường gặp hãy xem hướng dẫn của chúng tôi về kiểu cách thêm phần câu hỏi thường gặp trong WordPress.

WordPress đi cùng với thư viện jQuery tuy nhiên nó không có jquery themes. Chúng ta sẽ thêm nó từ Google CDN. Trong ví dụ này mình sẽ tạo một plugin đơn giản với shortcode hiển thị các câu hỏi thường gặp.

Tạo thư mục ‘my-accordion’ trên máy tính của bạn. Mở Notepad hoặc bất kỳ trình soạn thảo văn bản nào bạn muốn. Tạo một tệp có tên my-accordion.php và dán mã này vào:

    10, 'orderby' =>  'menu_order', 'order' =>  'ASC', 'post_type' =>  'question', )); // Generating Output $faq .= ' 
'; //Open the container foreach ( $posts as $post ) { // Generate the markup for each Question $faq .= sprintf(('

%1$s

%2$s
'), $post-> post_title, wpautop($post-> post_content) ); } $faq .= '
'; //Close the container return $faq; //Return the HTML. } add_shortcode('faq_accordion', 'accordion_shortcode');

Sau khi lưu tệp, hãy mở một tệp mới. Lưu nó với tên accordion.js . Tiếp theo dán mã này vào:

 jQuery(document).ready(function() { jQuery("#accordion").accordion(); })();  

Bây giờ bạn sẽ tải plugin này lên web hosting . Mở trình quản lý tệp FTP và tải thư mục ‘my-accordion’ lên thư mục /wp-content/plugins/. Tiếp theo, bạn phải kích hoạt plugin bằng cách truy cập trang quản lý plugin trong khu vực quản trị WordPress.

Thêm trang FAQ với Accordion

Để hiển thị trang FAQ, bạn phải tạo một trang mới và dán đoạn shortcode sau vào trình soạn thảo WordPress [faq_accordion]

Lưu và xuất bản trang. Nhấn vào xem trang bạn sẽ thấy nội dung FAQs với kiểu accordion.

Thay đổi kiểu dáng FAQ Accordion

Bạn có thể đổi màu sắc và mẫu mã Accordion cho câu hỏi thường gặp bằng phương pháp sử dụng jQuery UI Themes. Trang web jQuery có phần jQuery UI themes với một vài chủ đề đã có sẵn để sử dụng. Bạn có thể thay thế nó bằng bất kỳ chủ đề có sẵn nào như smoothness, cupertino, v.v. Bạn cũng cũng có thể tạo hoặc sửa đổi các chủ đề này trên Themeroller.

Hy vọng bài viết này sẽ giúp bạn tạo trang câu hỏi thường gặp trong WordPress.

Hãy cho mình biết suy nghĩ của bạn trong phần bình luận bên dưới bài viết này. Hãy theo dấu kênh chia sẻ kiến thức WordPress của TopVn trên Twitter và Facebook

Bài viết Thêm jQuery FAQ (Câu hỏi thường gặp) trong WordPress được tổng hợp và biên tập bởi: dinhthuanit.com. Mọi ý kiến đóng góp và phản hồi vui lòng gửi Liên Hệ cho dinhthuanit.com để điều chỉnh. dinhthuanit.com xin cảm ơn.

Bài Viết Liên Quan


Bài Viết Khác


Quảng cáo
Ads_ngang