Hướng dẫn WordPress: Cách tạo Plugin chứng thực

Bài viết được viết bởi:
  • WordPress
  • Cập nhật: Tháng Tám 12, 2013

Vì vậy, ở đây chúng tôi là hướng dẫn hàng tuần thứ hai của chúng tôi về WordPress. Chúng tôi đã học được cách tạo ra vô hạn cuộn WP trang webplugin lật trang trong quá khứ. Hôm nay, chúng ta sẽ tìm hiểu thêm một chút về các loại bài đăng tùy chỉnh và cách tải dữ liệu của chúng.

Tính năng này thực sự quan trọng trong trang web của bạn, vì nó cho phép bạn cho mọi người giới thiệu bạn. Lời chứng thực là một bằng chứng xã hội tuyệt vời về sự khiếp sợ của bạn. Và bạn không cần plugin phức tạp hoặc nhiều mã để đạt được điều này, vì bạn sẽ thấy với một vài tệp, bạn có thể tạo bản trình bày gợi cảm cho lời chứng thực của mình.

Hãy bắt đầu sau đó!

Zip & Cài đặt

Nếu bạn vội vàng kiểm tra điều này, bạn có thể tải về và cài đặt nó.

Bạn sẽ cần phải thêm một số dữ liệu sau đó, bằng cách thêm một vài lời chứng thực bằng cách sử dụng các lời chứng thực hoàn toàn mới, bạn có thể thấy trong trang tổng quan của mình:

danh sách chứng thực

Sau đó, bạn có thể sử dụng shortcode cơ bản để tải rằng:

[lời chứng thực rand = 0 max = 5]

Khi bạn đã thêm mã đó, bạn sẽ thấy nội dung như thế này trong trang của mình:

lời chứng thực chính

Bây giờ chúng ta sẽ xem cách tạo và khám phá điều này (bằng cách thêm các hàm khác và thay đổi giao diện).

Khái niệm cơ bản

Như chúng tôi đã nói trước đây, bạn cần phải thêm siêu dữ liệu tiêu đề, tạo tệp plugin và gọi tập lệnh của bạn. Dài câu chuyện ngắn, bạn sẽ tạo một thư mục mới theo wp-content / plugins của bạn với tên plugin của bạn, sau đó tạo một tập tin có cùng tên với thư mục làm tệp plugin chính của bạn.

Khi bạn đã hoàn thành việc sao chép và dán như sau:

<? php / * Tên plugin: Lời chứng thực Mô tả: Hiển thị lời chứng thực của khách hàng. Phiên bản: 1.0 Tác giả: Blog Doanh thu Web Giấy phép: GPL2 * / // enqueueing script và style function plugin_scripts () {wp_enqueue_script ('jquery'); wp_enqueue_script ('flexslider', plugins_url ('js / jquery.flexslider-min.js', __FILE__), mảng ('jquery'), '2.2', sai); wp_enqueue_script ('testimonials', plugins_url ('js / testimonials.js', __FILE__), mảng ('jquery'), '1.0', sai); wp_enqueue_style ('flexsliderCSS', plugins_url ('css / flexslider.css', __FILE__), sai, '2.2', 'all'); wp_enqueue_style ('testimonialsCSS', plugins_url ('css / testimonials.css', __FILE__), sai, '1.0', 'all'); } add_action ("wp_enqueue_scripts", "plugin_scripts");

Đây là những gì chúng tôi đang làm:

  • Nói cho WP biết tên plugin, tác giả của chúng tôi, những gì nó làm
  • Tạo một hàm, trong đó chúng ta chèn các kịch bản lệnh thông thường (như jQuery) và các kịch bản lệnh tùy chỉnh (như flexslider) và các Stylesheets
  • Nói với WP để tải các chức năng kịch bản trong cuộc gọi script mặc định của nó, vì vậy chúng sẽ được thực sự được tải trong các trang

Đó là tất cả khá mát mẻ, nhưng đừng quên để thực sự tạo ra các tập tin theo / js và / css. Bạn chỉ có thể tải chúng xuống trong nội dung demo của chúng tôi, do đó bạn không cần phải đào nhiều để tìm các tập tin flexslider.

Bây giờ chúng ta có tất cả những thứ cơ bản tại chỗ chúng ta có thể bắt đầu phần buồn cười.

Loại bài đăng tùy chỉnh

Theo mặc định, WordPress có các loại bài đăng, trang và bài đăng phổ biến. Nhưng nó cũng có rất nhiều loại bài đăng nội bộ (như tệp đính kèm), do đó định nghĩa “loại bài đăng” là: Mọi loại dữ liệu bạn cần lưu trữ.

Vì plugin của chúng ta sẽ tạo ra một chức năng mới, WP không có sẵn nơi lưu trữ, vì vậy chúng ta cần phải tạo ra nó. Đừng sợ ít châu chấu, nó khá đơn giản, bạn có thể sử dụng mã này:

// ma thuật đen để tạo chức năng loại bài đăng created_post_type () {register_post_type ('testimonials', // mảng loại bài đăng mới ('nhãn' => mảng ('name' => __ ('Testimonials'), 'singular_name' => __ ('Lời chứng thực')), 'công khai' => đúng, / * Loại bài đăng được sử dụng cho mục đích công cộng. Điều này bao gồm ở mặt trước và trong wp-admin. * / 'Hỗ trợ' => mảng ('title ',' biên tập viên ',' hình thu nhỏ ',' custom_fields '),' phân cấp '=> sai)); }

Ở đây chúng ta chỉ sử dụng hàm register_post_type () để nói với WP “Hey Buddy, chúng ta cần lưu trữ loại dữ liệu này, hãy sẵn sàng để nhận nó”.

Chúng tôi cũng nói với anh ta rằng loại dữ liệu này được gọi là "lời chứng thực", nó sẽ có sẵn để truy cập công cộng (vì vậy nó thực sự tạo ra một mục trình đơn mới trong bảng điều khiển của bạn cho nó), các lĩnh vực chúng ta cần trên đó, và nếu nó là phân cấp hoặc không (giống như các trang mà chúng tôi có trang cha và con).

Sau đó, chúng ta cần phải gọi nó mỗi khi chúng ta tải WordPress. Cái móc này sẽ làm điều đó:

add_action ('init', 'create_post_type');

Trường tùy chỉnh

Giờ đây, loại bài đăng tùy chỉnh của chúng tôi có tiêu đề (tên người), nội dung (lời chứng thực của người đó), ảnh (hình ảnh nổi bật) nhưng thiếu liên kết, vì nếu người đó đủ tốt để nói về bạn, bạn nên liên kết trang web của họ, phải không?

Chúng ta có thể làm điều này với các trường tùy chỉnh thông thường, nhưng sẽ tốt hơn nếu có một trường đóng kín, nơi người dùng không cần phải nhập tên của trường và cũng là nơi bạn có thể thêm một số quy tắc xác thực.

Trước hết, chúng tôi cần tạo một metabox mới, đó là những bảng đẹp mà bạn có trong khu vực chỉnh sửa bài đăng của mình, mỗi bảng nhỏ là một metabox. Hàm này sẽ tạo và gọi nó:

// thêm chức năng trường hộp meta URL add_custom_metabox () {add_meta_box ('custom-metabox', __ ('Link'), 'url_custom_metabox', 'testimonials', 'side', 'low'); } add_action ('admin_init', 'add_custom_metabox');

Hàm add_meta_box () yêu cầu các tham số sau:

  1. ID - Mã định danh duy nhất cho nó. Bạn có thể sử dụng bất cứ điều gì độc đáo ở đây như “kỳ lân-ăn-cầu vồng” hoặc “lời chứng thực-liên kết”. Bất cứ thứ gì có thể được sử dụng trong nội bộ
  2. Tiêu đề - Điều gì sẽ được hiển thị cho người dùng? Ở đây, điều quan trọng là sử dụng hàm __ (), đây là chức năng cho phép người dùng từ các ngôn ngữ nước ngoài dịch plugin của bạn bằng các tệp .po (mà không cần chỉnh sửa tệp plugin)
  3. Gọi lại - Chức năng mà bạn có nội dung thực tế của metabox
  4. Loại bài đăng - Trong trường hợp của chúng tôi, chúng tôi muốn nó chỉ hiển thị cho những lời chứng thực
  5. Bối cảnh - Vị trí trong trang bạn muốn hiển thị
  6. Ưu tiên - Nếu cần trước các mục khác của cùng một vị trí hoặc sau chúng

Bây giờ chúng ta cần tạo hàm url_custom_metabox (), vì chúng ta đã gọi nó.

// HTML cho chức năng khu vực quản trị url_custom_metabox () {global $ post; $ urllink = get_post_meta ($ post-> ID, 'urllink', true); // xác thực! if (! preg_match ("/ http (s?): ///", $ urllink) && $ urllink! = "") {$ lỗi = "URL này không hợp lệ"; $ urllink = "http: //"; } // xuất thông báo url invlid và thêm http: // vào trường đầu vào if (isset ($ error)) {echo $ error; }?> <p> <nhãn for = "siteurl"> URL: ) {echo $ urllink;}?> "/> </ nhãn> </ p> <? php}

Ok, bây giờ dịch này sang tiếng Anh đơn giản:

  • Biến $ post toàn cầu được gọi, vì vậy chúng ta có thể biết POSTID của mục hiện tại là gì
  • Chúng tôi tải giá trị hiện tại cho URL
  • Chúng tôi xác thực Nếu giá trị mà người dùng đã chèn là hợp lệ. Nếu có ít nhất một lần xuất hiện “http” hoặc “https” thì giá trị là OK, nếu không giá trị hợp lệ và chúng tôi cần sử dụng giá trị mặc định
  • Sau đó, chúng tôi hiển thị lỗi, nếu có
  • Bây giờ chúng ta bắt đầu HTML thực tế, thêm giá trị mặc định vào trường đầu vào như chúng ta đã có trong PHP

Sau thời điểm này, chúng ta cần phải thực sự lưu những gì được gửi bởi người dùng. Chúng tôi sẽ sử dụng móc “save_post”, vì vậy mỗi khi WordPress lưu một bài đăng, nó sẽ gọi hàm này:

// lưu chức năng dữ liệu trường tùy chỉnh save_custom_url ($ post_id) {global $ post; if (isset ($ _ POST ['siteurl'])) {update_post_meta ($ post-> ID, 'urllink', $ _POST ['siteurl']); }} add_action ('save_post', 'save_custom_url');

Ở đây chúng tôi chỉ kiểm tra xem có bất kỳ dữ liệu bài đăng nào được gọi là "liên kết trang web" hay không là tên trường của chúng tôi. Nếu có một liên kết trang web, hãy lưu nó.

Sau khi mọi thứ đã sẵn sàng, đây là cách trang lời chứng thực của bạn sẽ trông như thế nào:

lời chứng thực mới

Tải dữ liệu tùy chỉnh của chúng tôi

Bây giờ chúng ta cần tải các mục của chúng ta, và chúng ta sẽ sử dụng hàm get_posts (), chủ yếu là vì chúng ta chỉ có dữ liệu đơn giản, vì vậy chúng ta không cần vòng lặp WP thích hợp (có thể thêm nhiều cuộc gọi DB và chúng ta thực sự không không cần nó).

Vì vậy, trước tiên chúng ta hãy tạo một chức năng để có được liên kết của trang web của chúng tôi, nếu có.

// trả về URL cho chức năng đăng bài get_url ($ post) {$ urllink = get_post_meta ($ post-> ID, 'urllink', true); trả lại $ urllink; }

Bây giờ, chúng ta có thể bắt đầu hàm shortcode. Một cách đơn giản để mặc định và xác nhận hợp lệ dữ liệu shortcode là tạo các thuộc tính cho vòng lặp dưới dạng mảng, vì vậy chúng tôi có thể thêm các mục mới khi cần, như sau:

// đăng ký shortcode để hiển thị hàm chứng thực load_testimonials ($ a) {$ args = mảng ("post_type" => "testimonials"); if (isset ($ a ['rand']) && $ a ['rand'] == true) {$ args ['orderby'] = 'rand'; } if (isset ($ a ['max'])) {$ args ['post_per_page'] = (int) $ a ['max']; } // nhận tất cả lời chứng thực $ post = get_posts ($ args); // HTML OUTPUT} add_shortcode ("lời chứng thực", "load_testimonials");

Như bạn có thể thấy chúng ta có các thuộc tính shortcode được nạp và chuyển tới mảng $ args khi chúng xác nhận hợp lệ, theo định dạng mà WordPress cần nó, vì vậy chúng ta có thể tải các bài viết bằng cách sử dụng chúng.

Bây giờ chúng ta cần thêm một số mã HTML ở đó, theo cấu trúc mặc định của trình rút gọn. Đây là cách nó sẽ như thế nào:

tiếng vang '<div>'; tiếng vang '<ul>'; foreach ($ post as $ post) {// lấy hình ảnh ngón tay cái $ url_thumb = wp_get_attachment_thumb_url (get_post_thumbnail_id ($ post-> ID)); $ link = get_url ($ bài); tiếng vang '<li>'; if (! trống ($ url_thumb)) {echo '<img src = "'. $ url_thumb. '" />'; } echo '<h2>'. $ post-> post_title. '</ h2>'; if (! trống ($ post-> post_content)) {echo '<p>'. $ post-> post_content. '<br />'; } if (! trống ($ link)) {echo '<a href="'.$link.'"> Truy cập trang web </a> </ p>'; } tiếng vang '</ li>'; } tiếng vang '</ ul>'; tiếng vang '</ div>';

Đợi đã, nhưng tại sao chúng ta tạo mã HTML bên trong hàm PHP? Đó là bởi vì chúng tôi chỉ có thể tải nội dung một cách có điều kiện nếu người dùng đã thêm nội dung, vì vậy bạn sẽ không có thẻ HTML trống, chỉ cần đợi để làm hỏng bố cục của bạn.

Còn sidebar thì sao?

Hầu hết mọi người chỉ muốn hiển thị lời chứng thực trong thanh bên và plugin này sẽ không hoạt động thực sự tốt vì tiện ích văn bản không xử lý mã ngắn. Có một giải pháp đơn giản cho việc này, chỉ cần thêm giải pháp này vào mã của bạn:

add_filter ('widget_text', 'do_shortcode');

Cái gì tiếp theo?

Vậy, bạn có thích hướng dẫn này không? Bạn sẽ thêm gì làm tùy chọn cho shortcode chứng thực của mình? Bạn có ý tưởng nào cho các bài viết trong tương lai không? Hãy cho chúng tôi biết bằng cách sử dụng phần bình luận!

Giới thiệu về Olive Oliveira

Tôi là một nhà thiết kế web và doanh nhân từ Itajubá (MG), Brasil. Tôi thích viết về những chủ đề tối nghĩa và làm một số thứ hay ho.

Kết nối: