Chia sẻ kiến thức

Hướng dẫn tạo một WordPress Plugin chi tiết nhất

0

WordPress ngoài cốt lõi còn có 2 thành phần rất quan trọng đó là Theme và Plugin. Hai thành phần này giúp các nhà phát triển xây dựng một Website WordPress hoàn chỉnh. Trong bài viết này, chúng tôi sẽ giới thiệu, xây dựng một plugin cho WordPress.

Plugin WordPress là gì?

WordPress Plugin là một gói mã giúp mở rộng chức năng của một trang web được xây dựng bằng mã nguồn mở WordPress. Họ có thể thêm các yếu tố giao diện bằng cách thêm các File kiểu, javascript.

Xây dựng một Plugin WordPress

Bước 1: Tạo một thư mục cho plugin

Một plugin WordPress là một thư mục nằm tại thư mục // wp-content / plugins /

Ví dụ: Tôi tạo một plugin DMCA Reports với chức năng là để người dùng gửi báo cáo về những bài báo vi phạm. Tôi sẽ tạo một thư mục cho plugin với đường dẫn // wp-content / plugins / dmca-report /

Tải game crack việt hoá tại: https://daominhha.com

Bước 2: Tạo File chính của plugin.

Trong thư mục plugin vừa tạo ở trên, bạn cần tạo một file main chứa mã nguồn của plugin. File chính này sẽ bao gồm các thành phần plugin như các File php, js, css khác. Tên của File chính là do bạn quyết định nhưng thường nó là tên của plugin. VĐ: dmca-report.php

File chính phải có phần Doc Block chứa thông tin khai báo cho plugin.

Tạo File //wp-content/plugins/dmca-report/dmca-report.php với nội dung sau:

<?php
/**
 * Plugin Name:       DMCA Reports
 * Plugin URI:        https://vinasupport.com/plugins/dmca-report
 * Description:       DMCA Link Reports Management
 * Version:           1.0
 * Requires at least: 5.2
 * Requires PHP:      7.4
 * Author:            Manlivo
 * Author URI:        https://vinasupport.com
 * License:           GPL v2 or later
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 * Update URI:        https://vinasupport.com/plugins/dmca-reports
 * Text Domain:       dmca-report
 * Domain Path:       /languages
 */

Nó sẽ hiển thị thông tin trong cài đặt plugin trong [ Settings ] => [ Plugins ]

Để kích hoạt chúng ta nhấn [ Active ]. Plugin sẽ được kích hoạt thành công.

Đó là bước cơ bản để tạo plugin cho WordPress nhưng quan trọng nhất là nội dung plugin của bạn như thế nào? Ở đây tôi muốn xây dựng một plugin cho báo cáo bản quyền DMCA để người dùng có thể báo cáo các bài viết có bản quyền trên trang web của bạn.

Trong tập tin //wp-content/plugins/dmca-report/dmca-report.php Tôi có mã tải các File và thư mục sẽ được sử dụng trong plugin

<?php
// Plugin Directory
define('DMCA_REPORT_PATH', plugin_dir_path(__FILE__));

$includeDirs = [
    'includes',
    'database',
];
// Load all files in folder
foreach ($includeDirs as $dir) {
    foreach (glob(DMCA_REPORT_PATH . "/src/{$dir}/*.php") as $filename) {
        include_once $filename;
    }
}

Bước 2: Tạo cơ sở dữ liệu cho plugin.

Tôi sẽ tạo một cơ sở dữ liệu với thiết kế sau:

Tạo một File php với đường dẫn //wp-content/plugins/dmca-report/src/database/dmca-report-table.php chứa mã để tạo cơ sở dữ liệu.

<?php
global $dmcaReportDbVersion;
// DMCA Report DB Version
$dmcaReportDbVersion = '1';

/**
 * @return void
 */
function dmcaReportInstall(): void
{
    global $wpdb,
    $dmcaReportDbVersion;
    // Table Name
    $tableName = $wpdb->prefix . 'dmca_report_links';
    // Charset Collate
    $charsetCollate = $wpdb->get_charset_collate();
    // Run SQL
    require_once ABSPATH . 'wp-admin/includes/upgrade.php';
    dbDelta( "
        CREATE TABLE $tableName (
          `report_link_id` bigint(20) UNSIGNED NOT NULL PRIMARY KEY AUTO_INCREMENT,
          `post_id` bigint(20) UNSIGNED NOT NULL,
          `post_title` tinytext COLLATE utf8mb4_unicode_ci NOT NULL,
          `post_link` tinytext COLLATE utf8mb4_unicode_ci NOT NULL,
          `report_date` datetime NOT NULL,
          `report_name` varchar(200) COLLATE utf8mb4_unicode_ci NOT NULL,
          `report_email` varchar(200) COLLATE utf8mb4_unicode_ci NOT NULL,
          `report_content` text COLLATE utf8mb4_unicode_ci NOT NULL,
          `report_ip_address` varchar(50) COLLATE utf8mb4_unicode_ci NOT NULL,
          `user_agent` text COLLATE utf8mb4_unicode_ci NOT NULL,
          `ignored` tinyint(1) UNSIGNED NOT NULL DEFAULT '0',
          `deleted_at` datetime DEFAULT NULL
        ) ENGINE=InnoDB $charsetCollate;
    " );
    // Add index
    $wpdb->query("ALTER TABLE $tableName ADD KEY `post_id_idx` (`post_id`);");
    // Add option
    add_option( 'dmca_report_db_version', $dmcaReportDbVersion );
}

Trong File chính của plugin //wp-content/plugins/dmca-report/dmca-report.php Thêm móc sau:

register_activation_hook( __FILE__, 'dmcaReportInstall' );

Hook này sẽ được kích hoạt để gọi hàm xử lý tạo cơ sở dữ liệu khi bạn nhấp vào kích hoạt một plugin.

Bước 3: Tạo một nút trên trang bài viết để báo cáo DMCA

Tôi đã tạo thêm 2 thư mục trong plugin / src / bao gồm là nhúng các File xử lý php và thư mục / src / lượt xem để chứa giao diện hiển thị.

Sau đó, tôi tạo File /src/includes/functions.php để xử lý mã hiển thị sau:

// Add button to post content
add_filter( 'the_content', function ($content) {
    ob_start();
    include(DMCA_REPORT_PATH . 'src/views/dmca-button.php');
    return $content . ob_get_clean();
}, 1 );

Và tạo một File mẫu cho nút /src/views/dmca-button.php

<a class="button" href="https://vinasupport.com/huong-dan-tao-mot-wordpress-plugin-chi-tiet-nhat/<?php bloginfo("wpurl'); ?>/dmca/<?= get_the_ID(); ?>/">DMCA Report</a>

Nó sẽ hiển thị nút dmca trong bài đăng:

Bước 3: Tạo một trang chứa biểu mẫu để báo cáo các bài báo.

Tạo File src / include / rewrite.php có nội dung sau:

// Add rule for dmca page
add_action( 'init', function () {
    flush_rewrite_rules();
    add_rewrite_rule(
        'dmca/([0-9]+)/?$',
        'index.php?pagename=dmca&dmca_report_post_id=$matches[1]',
        'top'
    );
} );

// Add query var
add_filter( 'query_vars', function ($query_vars) {
    $query_vars[] = 'dmca_report_post_id';
    return $query_vars;
});

// Modify include url
add_filter( 'template_include', function ($template) {
    if (get_query_var('dmca_report_post_id')) {
        return DMCA_REPORT_PATH . 'src/views/dmca-report-form.php';
    }
    return $template;
});

Và File mẫu src / views / dmca-report-form.php

<?php
$post = get_post(get_query_var('dmca_report_post_id'))
?>

<form action="" method="post">
    <p>
        Report URL: <?php echo get_permalink($post->ID); ?>
    </p>
    <p>
        <label for="report_name">Name:</label><br />
        <input type="text" name="report_name" id="report_name" value="" />
    </p>
    <p>
        <label for="report_email">Email:</label><br />
        <input type="text" name="report_email" id="report_email" value="" />
    </p>
    <p>
        <label for="report_content">Message:</label><br />
        <textarea name="report_content" id="report_content"></textarea>
    </p>
    <p>
        <input type="hidden" name="post_id" value="<?= $post->ID; ?>">
        <input type="submit" name="dmca_report_submit" value="Submit" />
    </p>
</form>

Nó sẽ tạo ra một biểu mẫu giống như sau:

Bước 4: Tạo dữ liệu cập nhật xử lý vào cơ sở dữ liệu WordPress

Chỉnh sửa File src / include / functions.php và thêm mã sau:

// Update data for dmca
add_action('init', function (){
    global $wpdb;
    if (isset($_POST['dmca_report_submit'])) {
        // get Post ID
        $postId = intval($_POST['post_id']);
        if ($postId > 0) {
            // Get Post
            $post = get_post($postId);
            if ($post) {
                $data = [
                    'post_id' => $postId,
                    'post_title' => $post->post_title,
                    'post_link' => get_permalink($postId),
                    'report_date' => current_time('Y-m-d H:i:s'),
                    'report_name' => sanitize_text_field($_POST['report_name']),
                    'report_email' => sanitize_email($_POST['report_email']),
                    'report_content' => sanitize_textarea_field($_POST['report_content']),
                    'report_ip_address' => $_SERVER['REMOTE_ADDR'] ?? '',
                    'user_agent' => $_SERVER['HTTP_USER_AGENT'] ?? '',
                ];
                $table = $wpdb->prefix . 'dmca_report_links';
                // Insert to database
                $wpdb->insert($table, $data);
            }
        }
    }
});

Sau khi gửi biểu mẫu, mã này sẽ được lưu vào cơ sở dữ liệu.

Sự kết luận

Trong bài viết này, mình chỉ hướng dẫn các bạn cách xây dựng một plugin với các thao tác cơ bản như chỉnh sửa chức năng WordPress, tạo giao diện, tạo và cập nhật cơ sở dữ liệu. Nó vẫn chưa hoàn chỉnh, vì vậy hãy phát triển nó hơn nữa.

Bạn có thể tải xuống mã nguồn demo tại đây:

Báo cáo DMCA của plugin

Nguồn: vinasupport.com

Leave a comment