اکنون روند ساخت پلاگین فیلتر کردن کلمات وردپرس به نام “Wpstorm Word Filter Plugin” را به شما آموزش خواهم داد. در آموزش ساخت افزونه فیلتر کردن کلمات در سایت وردپرس، افزونه ساخته شده به شما امکان می دهد لیستی از کلمات را در محتوای سایت وردپرس خود با کلمه یا علامتی جایگزین کنید. (افزونه به درد این می خوره که می خواهید یک سری از کلمات اصلاً توی سایتتون نشون داده نشه، مثلاً اسامی رقبائتان یا کلمات زشت و … )
در اینجا یک راهنمای گام به گام برای مبتدیان آورده شده است:
اگر به ساخت افزونه وردپرس علاقه داری آموزش ساخت افزونه وردپرس برای شمارش تعداد کلمات و زمان تخمینی مطالعه هر پست رو هم مطالعه کن 🙂
مرحله 1: فایل پلاگین را ایجاد کنید
برای ساخت پلاگین فیلتر کردن کلمات، یک فایل جدید با نام «wpstorm-word-filter-plugin.php» ایجاد کنید و کد زیر را در ابتدا قرار دهید:
<?php
/*
Plugin Name: Wpstorm Word Filter Plugin
Description: Replaces a list of words.
Version: 1.0
Author: Wpstorm DEV team
Author URI: https://wpstorm.ir/
*/
PHPاین کد اطلاعات اولیه پلاگین شما مانند نام، توضیحات، نسخه، نویسنده و آدرس سایت نویسنده را تنظیم می کند.
مرحله 2: کلاس پلاگین را تعریف کنید
در زیر کد قبلی، کد زیر را برای تعریف کلاس اصلی افزونه اضافه کنید:
if (!defined('ABSPATH')) {
exit; // Exit if accessed directly
}
class WpstormWordFilterPlugin {
function __construct() {
// Constructor
}
// Add other functions here
}
$ourWordFilterPlugin = new WpstormWordFilterPlugin();
PHPاین کد کلاس افزونه اصلی، «WpstormWordFilterPlugin» را تعریف می کند و نمونه ای از آن را مقداردهی اولیه می کند.
مرحله 3: قلاب ها و اقدامات مورد نیاز را اضافه کنید
داخل تابع «__construct()» کلاس «WpstormWordFilterPlugin»، کد زیر را اضافه کنید:
add_action('admin_menu', array($this, 'ourMenu'));
add_action('admin_init', array($this, 'ourSettings'));
if (get_option('plugin_words_to_filter')) {
add_filter('the_content', array($this, 'filterLogic'));
}
PHPاین خطوط کد به اقدامات و فیلترهای وردپرس متصل می شوند. تابع «ourMenu» یک صفحه منو برای افزونه اضافه می کند، عملکرد «ourSettings» تنظیمات افزونه را کنترل می کند، و تابع «filterLogic» جایگزین کلمات فیلتر شده در محتوا را مشخص می نماید.
مرحله 4: تنظیمات پلاگین را تعریف کنید
توابع زیر را به کلاس «WpstormWordFilterPlugin» اضافه کنید:
function ourSettings() {
add_settings_section('replacement-text-section', null, null, 'word-filter-options');
register_setting('replacementFields', 'replacementText');
add_settings_field('replacement-text', 'Filtered Text', array($this, 'replacementFieldHTML'), 'word-filter-options', 'replacement-text-section');
}
function replacementFieldHTML() {
?>
<input type="text" name="replacementText" value="<?php echo esc_attr(get_option('replacementText', '***')) ?>">
<p class="description">Leave blank to simply remove the filtered words.</p>
<?php
}
PHPاین توابع تنظیمات افزونه را تعریف می کنند و یک فیلد ورودی برای متن جایگزین نمایش می دهند. تابع ‘ourSettings’ یک بخش تنظیمات ایجاد می کند، تنظیمات را ثبت می کند و فیلد را اضافه می کند. تابع “replacementFieldHTML” کد مورد نیاز HTML را برای فیلد ورودی ارائه می کند.
مرحله 5: منطق فیلترینگ را پیاده سازی کنید
تابع زیر را به کلاس «WpstormWordFilterPlugin» اضافه کنید:
function filterLogic($content) {
$badWords = explode(',', get_option('plugin_words_to_filter'));
$badWordsTrimmed = array_map('trim', $badWords);
return str_ireplace($badWordsTrimmed, esc_html(get_option('replacementText', '****')), $content);
}
PHPاین تابع کلمات فیلتر شده را از تنظیمات افزونه بازیابی می کند، آنها را برای جایگزینی برش داده و آماده می کند و متن جایگزین مشخص شده در محتوا را جایگزین می کند.
مرحله 6: صفحات منوی پلاگین ایجاد کنید
تابع زیر را به کلاس «WpstormWordFilterPlugin» اضافه کنید:
function ourMenu() {
$mainPageHook = add_menu_page(
'Words To Filter', // Page title
'Word Filter', // Menu title
'manage_options', // Capability required to access
'ourwordfilter', // Menu slug
array($this, 'wordFilterPage'), // Callback function to render the page
'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMCAyMEMxNS41MjI5IDIwIDIwIDE1LjUyMjkgMjAgMTBDMjAgNC40NzcxNCAxNS41MjI5IDAgMTAgMEM0LjQ3NzE0IDAgMCA0LjQ3NzE0IDAgMTBDMCAxNS41MjI5IDQuNDc3MTQgMjAgMTAgMjBaTTExLjk5IDcuNDQ2NjZMMTAuMDc4MSAxLjU2MjVMOC4xNjYyNiA3LjQ0NjY2SDEuOTc5MjhMNi45ODQ2NSAxMS4wODMzTDUuMDcyNzUgMTYuOTY3NEwxMC4wNzgxIDEzLjMzMDhMMTUuMDgzNSAxNi45Njc0TDEzLjE3MTYgMTEuMDgzM0wxOC4xNzcgNy40NDY2NkgxMS45OVoiIGZpbGw9IiNGRkRGOEQiLz4KPC9zdmc+', // Menu icon
100 // Menu position
);
add_submenu_page(
'ourwordfilter', // Parent menu slug
'Words To Filter', // Page title
'Words List', // Submenu title
'manage_options', // Capability required to access
'ourwordfilter', // Submenu slug
array($this, 'wordFilterPage') // Callback function to render the page
);
add_submenu_page(
'ourwordfilter', // Parent menu slug
'Word Filter Options', // Page title
'Options', // Submenu title
'manage_options', // Capability required to access
'word-filter-options', // Submenu slug
array($this, 'optionsSubPage') // Callback function to render the page
);
add_action("load-{$mainPageHook}", array($this, 'mainPageAssets'));
}
function mainPageAssets() {
wp_enqueue_style('filterAdminCss', plugin_dir_url(__FILE__) . 'styles.css');
}
PHPاین تابع لینک صفحه منوی اصلی و صفحات زیر منو افزونه را ایجاد می کند و توابع مناسب و مرتبط را برای رندر کردن صفحه تنظیمات افزونه ثبت می کند. تابع ‘mainPageAssets’ فایل ‘styles.css’ را در صف برای لود شدن در زمان مناسب قرار می دهد که بعدا توضیح داده خواهد شد.
مرحله 7: پروسه ذخیره فرم تنظیمات افزونه
تابع زیر را به کلاس «WpstormWordFilterPlugin» اضافه کنید:
function handleForm() {
if (wp_verify_nonce($_POST['ourNonce'], 'saveFilterWords') && current_user_can('manage_options')) {
update_option('plugin_words_to_filter', sanitize_text_field($_POST['plugin_words_to_filter']));
?>
<div class="updated">
<p>Your filtered words were saved.</p>
</div>
<?php
} else {
?>
<div class="error">
<p>Sorry, you do not have permission to perform that action.</p>
</div>
<?php
}
}
PHPاین تابع ارسال فرم را از صفحه تنظیمات افزونه مدیریت می کند. قبل از بهروزرسانی گزینه کلمات فیلتر شده، قابلیتهای nonce و کاربر را تأیید میکند و پیامهای موفقیت یا خطا را بر این اساس نمایش میدهد.
مرحله 8: صفحه Word Filter را رندر کنید
تابع زیر را به کلاس «WpstormWordFilterPlugin» اضافه کنید:
function wordFilterPage() {
?>
<div class="wrap">
<h1>Word Filter</h1>
<?php if ($_POST['justsubmitted'] == "true") $this->handleForm() ?>
<form method="POST">
<input type="hidden" name="justsubmitted" value="true">
<?php wp_nonce_field('saveFilterWords', 'ourNonce') ?>
<label for="plugin_words_to_filter">
<p>Enter a <strong>comma-separated</strong> list of words to filter from your site's content.</p>
</label>
<div class="word-filter__flex-container">
<textarea name="plugin_words_to_filter" id="plugin_words_to_filter" placeholder="bad, mean, awful, horrible"><?php echo esc_textarea(get_option('plugin_words_to_filter')) ?></textarea>
</div>
<input type="submit" name="submit" id="submit" class="button button-primary" value="Save Changes">
</form>
</div>
<?php
}
PHPاین تابع صفحه اصلی افزونه را در بخش مدیریت افزونه نمایش می دهد. فرمی را با یک ناحیه متنی نمایش می دهد که می توانید کلمات را برای فیلتر وارد کنید و تغییرات را پس از ارسال فرم ذخیره می کند.
مرحله 9: صفحه فرعی گزینه ها را رندر کنید
تابع زیر را به کلاس «WpstormWordFilterPlugin» اضافه کنید:
function optionsSubPage() {
?>
<div class="wrap">
<h1>Word Filter Options</h1>
<form action="options.php" method="POST">
<?php
settings_errors();
settings_fields('replacementFields');
do_settings_sections('word-filter-options');
submit_button();
?>
</form>
</div>
<?php
}
PHPاین تابع صفحه فرعی گزینهها را برای افزونه ارائه میکند. فیلدهای تنظیمات را نمایش می دهد، خطاها را مدیریت می کند و دکمه ارسال را برای ذخیره گزینه ها ارائه می دهد.
مرحله 10: Stylesheet را ایجاد کنید
یک فایل جدید با نام «styles.css» ایجاد کنید و کد CSS زیر را به آن اضافه کنید:
.word-filter__flex-container {
display: flex;
}
.word-filter__flex-container textarea {
flex: 1;
height: 200px;
margin-bottom: 20px;
}
CSSاین کد CSS یک فایل استایل ساده برای صفحه تنظیمات افزونه تعریف می کند.
مرحله 11: Stylesheet را در صف قرار دهید
در نهایت، به تابع “mainPageAssets” (در مرحله 6 گذشت) در کلاس “WpstormWordFilterPlugin” برگردید و مطمئن شوید که خط زیر اضافه شده است:
wp_enqueue_style('filterAdminCss', plugin_dir_url(__FILE__) . 'styles.css');
PHPاین خط فایل ‘styles.css’ را در صف قرار می دهد تا در زمان مناسب در صفحه تنظیمات افزونه بارگذاری شود.
کد کامل index.php افزونه:
<?php
/*
Plugin Name: Our Word Filter Plugin
Description: Replaces a list of words.
Version 1.0
Author: Brad
Author URI: https://www.udemy.com/user/bradschiff/
*/
if( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly
class OurWordFilterPlugin {
function __construct() {
add_action('admin_menu', array($this, 'ourMenu'));
add_action('admin_init', array($this, 'ourSettings'));
if (get_option('plugin_words_to_filter')) add_filter('the_content', array($this, 'filterLogic'));
}
function ourSettings() {
add_settings_section('replacement-text-section', null, null, 'word-filter-options');
register_setting('replacementFields', 'replacementText');
add_settings_field('replacement-text', 'Filtered Text', array($this, 'replacementFieldHTML'), 'word-filter-options', 'replacement-text-section');
}
function replacementFieldHTML() { ?>
<input type="text" name="replacementText" value="<?php echo esc_attr(get_option('replacementText', '***')) ?>">
<p class="description">Leave blank to simply remove the filtered words.</p>
<?php }
function filterLogic($content) {
$badWords = explode(',', get_option('plugin_words_to_filter'));
$badWordsTrimmed = array_map('trim', $badWords);
return str_ireplace($badWordsTrimmed, esc_html(get_option('replacementText', '****')), $content);
}
function ourMenu() {
$mainPageHook = add_menu_page('Words To Filter', 'Word Filter', 'manage_options', 'ourwordfilter', array($this, 'wordFilterPage'), 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xMCAyMEMxNS41MjI5IDIwIDIwIDE1LjUyMjkgMjAgMTBDMjAgNC40NzcxNCAxNS41MjI5IDAgMTAgMEM0LjQ3NzE0IDAgMCA0LjQ3NzE0IDAgMTBDMCAxNS41MjI5IDQuNDc3MTQgMjAgMTAgMjBaTTExLjk5IDcuNDQ2NjZMMTAuMDc4MSAxLjU2MjVMOC4xNjYyNiA3LjQ0NjY2SDEuOTc5MjhMNi45ODQ2NSAxMS4wODMzTDUuMDcyNzUgMTYuOTY3NEwxMC4wNzgxIDEzLjMzMDhMMTUuMDgzNSAxNi45Njc0TDEzLjE3MTYgMTEuMDgzM0wxOC4xNzcgNy40NDY2NkgxMS45OVoiIGZpbGw9IiNGRkRGOEQiLz4KPC9zdmc+', 100);
add_submenu_page('ourwordfilter', 'Words To Filter', 'Words List', 'manage_options', 'ourwordfilter', array($this, 'wordFilterPage'));
add_submenu_page('ourwordfilter', 'Word Filter Options', 'Options', 'manage_options', 'word-filter-options', array($this, 'optionsSubPage'));
add_action("load-{$mainPageHook}", array($this, 'mainPageAssets'));
}
function mainPageAssets() {
wp_enqueue_style('filterAdminCss', plugin_dir_url(__FILE__) . 'styles.css');
}
function handleForm() {
if (wp_verify_nonce($_POST['ourNonce'], 'saveFilterWords') AND current_user_can('manage_options')) {
update_option('plugin_words_to_filter', sanitize_text_field($_POST['plugin_words_to_filter'])); ?>
<div class="updated">
<p>Your filtered words were saved.</p>
</div>
<?php } else { ?>
<div class="error">
<p>Sorry, you do not have permission to perform that action.</p>
</div>
<?php }
}
function wordFilterPage() { ?>
<div class="wrap">
<h1>Word Filter</h1>
<?php if ($_POST['justsubmitted'] == "true") $this->handleForm() ?>
<form method="POST">
<input type="hidden" name="justsubmitted" value="true">
<?php wp_nonce_field('saveFilterWords', 'ourNonce') ?>
<label for="plugin_words_to_filter"><p>Enter a <strong>comma-separated</strong> list of words to filter from your site's content.</p></label>
<div class="word-filter__flex-container">
<textarea name="plugin_words_to_filter" id="plugin_words_to_filter" placeholder="bad, mean, awful, horrible"><?php echo esc_textarea(get_option('plugin_words_to_filter')) ?></textarea>
</div>
<input type="submit" name="submit" id="submit" class="button button-primary" value="Save Changes">
</form>
</div>
<?php }
function optionsSubPage() { ?>
<div class="wrap">
<h1>Word Filter Options</h1>
<form action="options.php" method="POST">
<?php
settings_errors();
settings_fields('replacementFields');
do_settings_sections('word-filter-options');
submit_button();
?>
</form>
</div>
<?php }
}
$ourWordFilterPlugin = new OurWordFilterPlugin();
PHPاگر به ساخت افزونه وردپرس علاقه داری آموزش ساخت افزونه وردپرس برای شمارش تعداد کلمات و زمان تخمینی مطالعه هر پست رو هم مطالعه کن 🙂
خودشه! شما اکنون یک پلاگین وردپرس به نام “افزونه فیلتر کلمه طوفان وردپرس” را ایجاد کرده اید که به شما امکان می دهد لیستی از کلمات را در محتوای سایت وردپرس خود جایگزین کنید. به یاد داشته باشید که یک پوشه برای پلاگین خود ایجاد کنید و فایل «wpstorm-word-filter-plugin.php» و «styles.css» را درون آن قرار دهید. سپس، می توانید دایرکتوری را فشرده کرده و افزونه را از طریق داشبورد مدیریت وردپرس نصب کنید.
تیم طوفان وردپرس
اگر این کار را بلد نیستید، به مقاله دیگر ما در مورد آموزش ساخت پلاگین وردپرس مراجعه کنید.