插件制作


本文讲述内容

  • 最简单的插件
    • 插件制作认识
    • 为插件添加更多标头信息
    • 为插件添加功能
    • 阶段性总结
  • 为插件添加菜单
    • 插件UI分析
  • 将插件的操作结果保存到数据库
    • 为插件设置默认值
    • 将插件数据与UI连接
    • 为插件选项添加动作
    • 插件选项功能验证
  • 全文完整代码

如果在此之前,您尚未了解什么是插件,怎么制作插件,那么建议阅读wordpress 官网 插件手册

最简单的插件

简单来说,WordPress插件是一个带有WordPress插件标头注释的PHP文件。强烈建议您创建一个目录来保存插件,以便将所有插件文件整齐地组织在一个位置。

要开始创建新插件,请按照以下步骤操作。

  1. 导航到WordPress安装的  wp-content目录。
  2. 打开插件目录。
  3. 创建一个新目录,并以插件命名(例如plugin-name)。
  4. 打开新插件的目录。
  5. 创建一个新的PHP文件(最好在您的插件后命名该文件,例如plugin-name.php)。

使用适合您的任何编辑器(对于任何代码编辑,使用一款专业的编程工具尤为重要)。

现在,您正在编辑新插件的PHP文件,您需要添加一个插件标题注释。这是一种特殊格式的PHP块注释,其中包含有关插件的元数据,例如其名称,作者,版本,许可证等。插件头注释必须符合头要求,并且至少应包含插件  的名称。插入。

插件文件夹中只有一个文件应具有标题注释-如果插件具有多个PHP文件,则这些文件中只有一个应具有标题注释。

<?php
/**
 * Plugin Name:你的插件名称
 */
此图像的alt属性为空;文件名为20200528100407.png

保存文件后,您应该可以在WordPress网站中看到您的插件。

登录到你的WordPress网站,并在左侧导航窗格中点击插件。此页面显示您的WordPress网站具有的所有插件的列表。您的新插件现在应该在该列表中,如下图所示!

此图像的alt属性为空;文件名为image-53.png

为插件添加更多标头信息

插件标头代码

最简单的标头信息

<?php

/**
 * Plugin name: 迷路轮回演示插件
**/

完善标头信息

<?php

/**
 * Plugin name: 迷路轮回演示插件
 * Plugin URI: http://www.xyx115.com/xyx115
 * Description: 迷路轮回演示插件,用于演示插件基本制作过程。
 * Version: 1.1
 * Author: 迷路轮回
 * Author URI: http://www.xyx115.com/Author 
 * Author email: xyx115@qq.com
 * License: GPL-2.0
 * License URI: http://www.xyx115.com/
 * Donate URI: http://www.xyx115.com
 * Text Domain: 迷路轮回演示插件,专门用于演示插件制作过程。
 * Domain Path: /lang
 * Requires at least: 5.3
**/
效果演示:

最简单的插件显示效果

完善后的显示效果

为插件添加菜单

为插件添加菜单,更多信息可参考向wordpress添加后台管理菜单。此处将直接添加,并无过多解说。

在添加菜单前,请首先启用插件。方便后面测试效果。

<?php


// 添加一级菜单菜单
if ( !function_exists('add_my_menu') ) {
	function add_my_menu()	{
		add_menu_page(
			__('xyx115_Menu_Page_Tile', '页面标题文字') , 	// $page_title 页面标题
			__('xyx115_Menu', '菜单名称文字') , 			// $menu_title 菜单名称
			'manage_options', 								// $capability capability
			'xyx115', 										// $menu_slug xyx115_menu_slug ,链接别名,体现在URL中
			'xyx115_menu_page', 							// $function 函数将呈现其输出,即所有页面ui都在这个函数内部。
			'http://localhost/test/wp-content/uploads/2020/05/logo_16x16-2.png',   	// $icon_url 指定插件的图标为插件目录中的图片
			99,    											// $position 菜单选项的位置
		);
	}
}
add_action('admin_menu', 'add_my_menu');

?>
<?php

// 添加菜单内容
function xyx115_menu_page() {	
	?>
	<h1>迷路轮回测试菜单</h1>
	<p>可以从这里添加需要的菜单内容</p>
	<p>也可以使用引入单独页面的方法</p>
	<?php	
}

?>

为插件添加功能

将下面的代码添加到上面的完整插件代码的最后面。刷新后台插件页面或任意页面,观察后台。如下图所示,原来显示版本号的地方,已经添加了我们的辅助显示文字。

<?php







/** 
 *
 * 移除“WordPress后台管理界面”底部右侧文字“5.2.3版本 ”
 * add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);
 *
**/


add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);

function admin_footer_right_text_xyx115_20200510($text) {
	$text = '当前使用的wordpress版本信息:'.$text;
	return $text;
} 







?>
此图像的alt属性为空;文件名为image-59.png

再添加一个功能,为wordpress 网站登录界面,在logo图片下面添加网站的标题。请将下面的代码添加到您的插件的最后位置。并返回到登录界面,刷新。如右边图片所示,登录界面将成功显示网站的标题。

<?php

/**
 * 
 * 在登录页面Logo下方,登录框上方添加额外的信息
 * 即:给网站名称前面加上字符串。例如欢迎光临,或者公司名称,网站名称等
 * get_stylesheet_directory_uri()获取当前子主题目录。
 * get_template_directory_uri();获取当前父主题目录。
 * 迷路轮回    http://www.xyx115.com
 * //add_action('login_head', 'custom_login_message');// 登录页面的最上面,需要在css中规划和设置居中。
 * add_action('login_message', 'custom_login_message');// 登录页面Logo下方,登录框上方的位置。
 * 
**/
add_action('login_message', 'custom_login_message');// 登录页面Logo下方,登录框上方的位置。

function custom_login_message() {
    echo '<p 
	style="
	text-align:center;
	font-size:24px" 
	>
	' .get_bloginfo('name').
	'</p>
	</br>';
}


?>

阶段性总结

阶段性总结:

当前完整代码为:

<?php


/**
 * Plugin name: 迷路轮回演示插件
 * Plugin URI: http://www.xyx115.com/xyx115
 * Description: 迷路轮回演示插件,用于演示插件基本制作过程。
 * Version: 1.1
 * Author: 迷路轮回
 * Author URI: http://www.xyx115.com/Author 
 * Author email: xyx115@qq.com
 * License: GPL-2.0
 * License URI: http://www.xyx115.com/
 * Donate URI: http://www.xyx115.com
 * Text Domain: 迷路轮回演示插件,专门用于演示插件制作过程。
 * Domain Path: /lang
 * Requires at least: 5.3
**/


?>
<?php




// 添加一级菜单菜单
if ( !function_exists('add_my_menu') ) {
	function add_my_menu()	{
		add_menu_page(
			__('xyx115_Menu_Page_Tile', '页面标题文字') , 	// $page_title 页面标题
			__('xyx115_Menu', '菜单名称文字') , 			// $menu_title 菜单名称
			'manage_options', 								// $capability capability
			'xyx115', 										// $menu_slug xyx115_menu_slug ,链接别名,体现在URL中
			'xyx115_menu_page', 							// $function 函数将呈现其输出,即所有页面ui都在这个函数内部。
			'http://localhost/test/wp-content/uploads/2020/05/logo_16x16-2.png',   	// $icon_url 指定插件的图标为插件目录中的图片
			99,    											// $position 菜单选项的位置
		);
	}
}
add_action('admin_menu', 'add_my_menu');




?>
<?php



// 添加菜单内容
function xyx115_menu_page() {
	
	?>
	<h1>迷路轮回测试菜单</h1>
	<p>可以从这里添加需要的菜单内容</p>
	<p>也可以使用引入单独页面的方法</p>
	<?php	

}




?>
<?php




/** 
 *
 * 移除“WordPress后台管理界面”底部右侧文字“5.2.3版本 ”
 * add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);
 *
**/
add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);

function admin_footer_right_text_xyx115_20200510($text) {
	$text = '当前使用的wordpress版本信息:'.$text;
	return $text;
} 









?>
<?php







/**
 * 
 * 在登录页面Logo下方,登录框上方添加额外的信息
 * 即:给网站名称前面加上字符串。例如欢迎光临,或者公司名称,网站名称等
 * get_stylesheet_directory_uri()获取当前子主题目录。
 * get_template_directory_uri();获取当前父主题目录。
 * 迷路轮回    http://www.xyx115.com
 * //add_action('login_head', 'custom_login_message');// 登录页面的最上面,需要在css中规划和设置居中。
 * add_action('login_message', 'custom_login_message');// 登录页面Logo下方,登录框上方的位置。
 * 
**/
add_action('login_message', 'custom_login_message');// 登录页面Logo下方,登录框上方的位置。

function custom_login_message() {
    echo '<p 
	style="
	text-align:center;
	font-size:24px" 
	>
	' .get_bloginfo('name').
	'</p>
	</br>';
}




?>

当前已经实现的操作:

  • 建立了一个插件
  • 为插件添加了后台菜单
  • 为插件菜单添加图标
  • 为插件添加了2个功能

为插件添加菜单

现在假设我为插件添加了更多的功能,那么我们来想象一下,如果我只是想使用这众多功能中的某几个,而另外的插件不想启用,怎么办?如果有插件想做一个选择,怎么办?此时我们需要对插件已有的功能进行管理。

首先我们制作插件管理的ui,代码如下,替换原来添加的菜单内容:

<?php

// 添加菜单内容
function xyx115_menu_page() {
	
	?>
<div class="wrap">
	<h1>迷路轮回 菜单功能演示</h1>
	<form method="post" action="options.php">
		<table class="form-table" role="presentation">
			<tbody>
				<tr>
					<th scope="row">
						<label for="title">
							<?php _e( '插件标题:', 'xyx115_domain'); ?>
						</label>
					</th>
					<td>
						<input name="title" id="title" type="text" value="" class="regular-text" />
						<p class="description" >
							<?php _e('在条目下面可以添加文字进行说明,方便用户输入更有价值的内容。', 'xyx115_domain'); ?>
						</p>
					</td>
				</tr>
				<tr>
					<th scope="row">
						<label for="url">
							<?php _e( '插件网站:', 'xyx115_domain'); ?>
						</label>
					</th>
					<td>
						<input name="url"id="url" type="url" value="" class="regular-text code" />
						<p class="description">
							<?php _e('显示给用户的') . '<a href="http://www.xyx115.com/">' . _e('插件网址')  . '</a>' . _e(',请在此输入url地址。'); ?>
						</p>
					</td>
				</tr>
				<tr>
					<th scope="row">
						<label for="Expand">
							<?php _e( '数组扩展:', 'xyx115_domain'); ?>
						</label>
					</th>
					<td>
						<input name="Expand" id="Expand" type="checkbox" value="" />
						<nobr>启用数组功能扩展,使用
							<code>dump($array)</code>直观显示数组内容
						</nobr>
						<p class="description" >这里可以添加注释内容,也可以删除不添加。</p>
					</td>
				</tr>
				<tr>
					<th scope="row">
						<label for="sbak">
							<?php _e( '选择对本插件的欢迎程度:' , 'xyx115_domain'); ?>
						</label>
					</th>
					<td>
						<select name="sbak" id="sbak">
							<option value="0" >不做评价</option>
							<option value="1" >一星</option>
							<option value="2" >二星</option>
							<option value="3" >三星</option>
							<option value="4" >四星</option>
							<option value="5" >五星</option>
						</select>
						<p class="description" >这里是说明文字</p>
					</td>
				</tr>
				<tr>
					<th scope="row">
						<label for="Introduction">
							<?php _e( '备注信息:', 'xyx115_domain'); ?>
						</label>
					</th>
					<td>
						<textarea name="Introduction" id="Introduction" type="text" rows="10" cols="50" 
					class="large-text" placeholder="你好,这是占位符,可以输入一些内容,当用户在该区域没有输入任何内容的时候,可以给用户一些提示" ></textarea>
						<p class="description" >这里是说明文字</p>
					</td>
				</tr>
			</tbody>
		</table>
	</form>
</div>
<?php
}


?>

刷新页面,观察此时的后台页面,如下图。

插件UI分析

左边为代码,右边是代码分析。请仔细看,这部分是基础。只有理解透彻,才方便后面的强化和添加数据。

	<div class="wrap">
		<h1>迷路轮回 菜单功能演示</h1>
		<form method="post" action="options.php">

	<table class="form-table" role="presentation"><tbody>

		<tr>					
			<th scope="row"><label for="title"><?php _e( '插件标题:', 'xyx115_domain'); ?></label></th>
			<td><input name="title" id="title" type="text" value="" class="regular-text" />						
			<p class="description" ><?php _e('在条目下面可以添加文字进行说明,方便用户输入更有价值的内容。', 'xyx115_domain'); ?></p>
			</td>             
		</tr>
		
		<tr>
			<th scope="row"><label for="url"><?php _e( '插件网站:', 'xyx115_domain'); ?></label></th>
			<td><input name="url"id="url" type="url" value="" class="regular-text code" />
			<p class="description"><?php _e('显示给用户的') . '<a href="http://www.xyx115.com/">' . _e('插件网址')  . '</a>' . _e(',请在此输入url地址。'); ?></p>
			</td>
		</tr>
		
		<tr>
			<th scope="row"><label for="Expand"><?php _e( '数组扩展:', 'xyx115_domain'); ?></label></th>
			<td><input name="Expand" id="Expand" type="checkbox" value="" />
			<nobr>启用数组功能扩展,使用<code>dump($array)</code>直观显示数组内容</nobr>
			<p class="description" >这里可以添加注释内容,也可以删除不添加。</p>
			</td>		
		</tr>

		<tr>
			<th scope="row"><label for="sbak"><?php _e( '选择对本插件的欢迎程度:' , 'xyx115_domain'); ?></label></th>
			<td><select name="sbak" id="sbak">
				<option value="0" >不做评价</option>
				<option value="1" >一星</option>
				<option value="2" >二星</option>
				<option value="3" >三星</option>
				<option value="4" >四星</option>
				<option value="5" >五星</option></select>
				<p class="description" >这里是说明文字</p></td>
				
		</tr>
	
		<tr>
			<th scope="row"><label for="Introduction"><?php _e( '备注信息:', 'xyx115_domain'); ?></label></th>
			<td>
				<textarea name="Introduction" id="Introduction" type="text" rows="10" cols="50" 
					class="large-text" placeholder="你好,这是占位符,可以输入一些内容,当用户在该区域没有输入任何内容的时候,可以给用户一些提示" ></textarea>
					<p class="description" >这里是说明文字</p>
			</td>
		</tr>
	</tbody></table> 

		   </form>
	</div>

这是UI中的一段。

  • 首先使用<tr></tr><td></td>创建了标题列和内容列。
  • <tr></tr>table的加粗效果的单元格
  • <td></td>是正常的单元格
  • <label>元素用于将文本标签与表单字段相关联。标签用于告诉用户应该在相关输入字段中输入的值。
  • 为了使a <label>正常工作,它必须包含一个for属性,该属性标识<input>与之关联的属性。该for属性的值应与元素的id(而不是name)匹配<input>。
  • 表单提交依赖于name标签配对依赖id。这就是为什么您经常会<input>在两个属性中看到具有相同值的元素的原因。并且如果<input>复选框,您可能会在value属性中以及作为内容的内容中看到相同的值<label>元件。
  • 当然,也可以不使用该<label>元素,而只需将未标记的文本放在表单字段上方或旁边。但这不是一个好主意。具有成对的标签不仅仅具有良好的语义,还具有良好的可用性。使用正确标记的标签,用户可以单击(或点击)标签以将焦点移到元素上或将其选中。这在普通台式机和笔记本电脑上有一定帮助,但是在触摸屏手机上,它却起了很大的作用。
  • type属性指定要显示的<input>元素的类型。如果未指定type属性,则默认类型为"text"
  • <input type="url",输入URL的字段。看起来像文本输入,但在支持浏览器和带有动态键盘的设备中具有验证参数和相关的键盘。(更多类型请参考<input>:输入(表单输入)元素
  • _e( '数组扩展:', 'xyx115_domain');__()_e()_x()_ex()_n()国际化(i18n)您的所有字符串。__()_e()是最简单的函数:它们返回或回显转换后的字符串。它们的用法应该很明显:一个字符串,一个翻译。更多信息,请参考__(),_ e(),_ x()和_ex()有什么区别?
  • class="regular-text",引用式样,此式样可以让文本框具有wordpress后台默认的公共的宽度和式样,显得更为优美。
  • class=”description”,引用式样,此式样让文本具有默认的说明文字的式样。
  • <select<option,下拉选择框
  • <textarea type="text" rows="10" cols="50",文本框,高度为10,宽度50,类型text,class="large-text",引用wordpress后台默认的文本框式样,即全宽。
  • placeholder="你好,这是占位符,可以输......",占位符,在本文段没有任何内容的时候,给与提示。占位符也可以用于文本框等。

将插件的操作结果保存到数据库

上面的代码集中对ui中的各种代码含义,用法,效果进行了讲解。没有加入任何数据交互。接下来重点讲解怎么让用户的操作结果保存到数据库中。

先看代码:

<?php





function xyx115_register_settings(){

   $default_options=array(
        'title'=>'迷路轮回',
        'url'=>'http://www.xyx115.com/',
		'Expand'=>'1',
		'sbak'=>'5',
        'Introduction'=>		
			'插件标题,演示的是一个标准的文本字段
插件网站,演示的是一个标准的文本字段来填写网址。字段本身会验证输入的是否为网址。
数组扩展,演示的是一个复选框功能,并且演示了如何在一行文本中加入代码段。
选择,演示了如何创建文本段,并且加入了展位符提示功能和内容。
所有功能条目都可以设置说明文字。
所有功能条目的内容都可以正常保存到数据库中。
所有条目都可以设置默认值。',
         );

        add_option('xyx115_option1',$default_options);
		// 向数据库添加默认参数,如果数据库中已经存在该数据条目,则不执行任何操作。
        register_setting('register_xyx115_option1', 'xyx115_option1');
		// 注册合法的数据条目。
		
}

add_action('admin_init', 'xyx115_register_settings');


function xyx115_menu_page(){
        $options=get_option('xyx115_option1');
		//xyx115_option1_call($options);
        ?>

	<div class="wrap">
		<?php
	 screen_icon(); ?>
		<h1>迷路轮回 菜单功能演示</h1>
		<form method="post" action="options.php">
			<?php
	
	settings_fields('register_xyx115_option1'); ?>
<table class="form-table" role="presentation"><tbody>

	<tr>					
		<th scope="row"><label for="title"><?php _e( '插件标题:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[title]" id="title" type="text" value="<?php echo $options['title']; ?>" class="regular-text" />						
		<p class="description" ><?php _e('在条目下面可以添加文字进行说明,方便用户输入更有价值的内容。', 'xyx115_domain'); ?></p>
		</td>             
	</tr>
	
	<tr>
		<th scope="row"><label for="url"><?php _e( '插件网站:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[url]"id="url" type="url" value="<?php echo $options['url']; ?>" class="regular-text code" />
		<p class="description"><?php _e('显示给用户的') . '<a href="http://www.xyx115.com/">' . _e('插件网址')  . '</a>' . _e(',请在此输入url地址。'); ?></p>
		</td>
	</tr>
	
	<tr>
		<th scope="row"><label for="Expand"><?php _e( '数组扩展:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[Expand]" id="Expand" type="checkbox" 
		value="<?php echo $options['Expand']; ?>" <?php echo isset($options['Expand']) ? "checked " : ""; ?> />
		<nobr>启用数组功能扩展,使用<code>dump($array)</code>直观显示数组内容</nobr>
		<p class="description" >这里可以添加注释内容,也可以删除不添加。</p>
		</td>		
	</tr>

	<tr>
		<th scope="row"><label for="sbak"><?php _e( '选择对本插件的欢迎程度:' , 'xyx115_domain'); ?></label></th>
		<td><select name="xyx115_option1[sbak]" id="sbak">
			<option value="0" <?php echo ("0" == $options['sbak']) ? 'selected' : ""; ?> >不做评价</option>
			<option value="1" <?php echo ("1" == $options['sbak']) ? 'selected' : ""; ?> >一星</option>
			<option value="2" <?php echo ("2" == $options['sbak']) ? 'selected' : ""; ?> >二星</option>
			<option value="3" <?php echo ("3" == $options['sbak']) ? 'selected' : ""; ?> >三星</option>
			<option value="4" <?php echo ("4" == $options['sbak']) ? 'selected' : ""; ?> >四星</option>
			<option value="5" <?php echo ("5" == $options['sbak']) ? 'selected' : ""; ?> >五星</option></select>
			<p class="description" >这里是说明文字</p></td>
			
	</tr>
	
	<tr>
		<th scope="row"><label for="Introduction"><?php _e( '备注信息:', 'xyx115_domain'); ?></label></th>
		<td>
			<textarea name="xyx115_option1[Introduction]" id="Introduction" type="text" rows="10" cols="50" 
				class="large-text" placeholder='你好,这是占位符,可以输入一些内容,当用户在该区域没有输入任何内容的时候,可以给用户一些提示' ><?php echo $options['Introduction'] ;?></textarea>
				<p class="description" >这里是说明文字</p>
		</td>
	</tr>
</tbody></table> 
 <?php submit_button(); ?>
		   </form>
	</div>
	 

<?php  

} 




?>

保存上面的代码,然后刷新后台,我们可以看见你的插件界面显示如下:

为插件设置默认值

首先研究一下,为什么刷新后,界面中已经存在这些值了?答案:默认设置。还有ui中的合理设置。我们在插件中调用ui的时候,已经设定插件的默认设置参数。这些参数自动保存,并在随后的调用中显示出来。

请看下面这段代码,完成了两个动作,第一,增加了默认值,并使用add_option('xyx115_option1',$default_options);向数据库添加默认参数,如果数据库中已经存在该数据条目,则不执行任何操作。第二,register_setting('register_xyx115_option1', 'xyx115_option1')注册合法的数据标目。如果没有这句,在保存结果时,会报错 错误:选项页面register_xyx115_option1不在选项白名单中。

function xyx115_register_settings(){

   $default_options=array(
        'title'=>'迷路轮回',
        'url'=>'http://www.xyx115.com/',
		'Expand'=>'1',
		'sbak'=>'5',
        'Introduction'=>		
			'插件标题,演示的是一个标准的文本字段
插件网站,演示的是一个标准的文本字段来填写网址。字段本身会验证输入的是否为网址。
数组扩展,演示的是一个复选框功能,并且演示了如何在一行文本中加入代码段。
选择,演示了如何创建文本段,并且加入了展位符提示功能和内容。
所有功能条目都可以设置说明文字。
所有功能条目的内容都可以正常保存到数据库中。
所有条目都可以设置默认值。',
         );

        add_option('xyx115_option1',$default_options);
		// 向数据库添加默认参数,如果数据库中已经存在该数据条目,则不执行任何操作。
        register_setting('register_xyx115_option1', 'xyx115_option1');
		// 注册合法的数据条目。
		
}

add_action('admin_init', 'xyx115_register_settings');


将插件数据与UI连接

示例1,文本字段


   $default_options=array(
        'title'=>'迷路轮回',
        'url'=>'http://www.xyx115.com/',
		'Expand'=>'1',
		'sbak'=>'5',
	<tr>					
		<th scope="row"><label for="title"><?php _e( '插件标题:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[title]" id="title" type="text" value="<?php echo $options['title']; ?>" class="regular-text" />						
		<p class="description" ><?php _e('在条目下面可以添加文字进行说明,方便用户输入更有价值的内容。', 'xyx115_domain'); ?></p>
		</td>             
	</tr>
  • <input name="xyx115_option1[title]",实现用户输入数据的接收和读取
  • value="<?php echo $options['title']; ?>",将数据库中的值,或者默认值显示出来。

文本字段(网址)


	<tr>
		<th scope="row"><label for="url"><?php _e( '插件网站:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[url]"id="url" type="url" value="<?php echo $options['url']; ?>" class="regular-text code" />
		<p class="description"><?php _e('显示给用户的') . '<a href="http://www.xyx115.com/">' . _e('插件网址')  . '</a>' . _e(',请在此输入url地址。'); ?></p>
		</td>
	</tr>

  • $default_options=array('url'=>'http://www.xyx115.com/',默认值。
  • <input name="xyx115_option1[url]",实现用户输入数据的接收和读取
  • value="<?php echo $options['url']; ?>",将数据库中的值,或者默认值显示出来。
  • type="url",HTML格式,可以限制输入必须为URL格式。
  • class="regular-text code",这里的code作用是保证输入框中等宽显示等代码特征,方便正确识别数字和字母。

复选框示例


<tr>
		<th scope="row"><label for="Expand"><?php _e( '数组扩展:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[Expand]" id="Expand" type="checkbox" 
		value="<?php echo $options['Expand']; ?>" <?php echo isset($options['Expand']) ? "checked " : ""; ?> />
		<nobr>启用数组功能扩展,使用<code>dump($array)</code>直观显示数组内容</nobr>
		<p class="description" >这里可以添加注释内容,也可以删除不添加。</p>
		</td>		
	</tr>
  • <input name="xyx115_option1[Expand]",实现用户输入数据的接收和读取
  • value="<?php echo $options['Expand']; ?>",将数据库中的值,或者默认值显示出来。
  • <?php echo isset($options['Expand']) ? "checked " : ""; ?>,根据保存值对复选框进行勾选。
  • <nobr>,不换行文本,UI功能条目说明。

下拉框示例


	<tr>
		<th scope="row"><label for="sbak"><?php _e( '选择对本插件的欢迎程度:' , 'xyx115_domain'); ?></label></th>
		<td><select name="xyx115_option1[sbak]" id="sbak">
			<option value="0" <?php echo ("0" == $options['sbak']) ? 'selected' : ""; ?> >不做评价</option>
			<option value="1" <?php echo ("1" == $options['sbak']) ? 'selected' : ""; ?> >一星</option>
。。。
</select>
			<p class="description" >这里是说明文字</p></td>
			
	</tr>
  • <select name="xyx115_option1[sbak]",实现用户输入数据的接收和读取
  • <?php echo ("0" == $options['sbak']) ? 'selected' : ""; ?>",根据数据库中保存的值,对界面进行默认下拉选择操作。

文本段(一段文本)示例


		<td>
			<textarea name="xyx115_option1[Introduction]" id="Introduction" type="text" rows="10" cols="50" 
				class="large-text" placeholder='你好,这是占位符,可以输入一些内容,当用户在该区域没有输入任何内容的时候,可以给用户一些提示' >
<?php echo $options['Introduction'] ;?></textarea>
				<p class="description" >这里是说明文字</p>
		</td>

  • <textarea name="xyx115_option1[Introduction]",实现用户输入数据的接收和读取
  • <?php echo $options['Introduction']; ?>",根据数据库中保存的值,对界面进行默认下拉选择操作。

多条数据保存在一条记录中

为什么用xyx115_option1[title]$options['title']?为了把多个选项的值保存在一条数据库记录中。如下图所示:

为插件选项添加动作

两步走,第一,取消上面代码中的//xyx115_option1_call($options);前面的双斜杠。第二,将下面的代码添加到插件页面最后。

<?php






if ( !function_exists('xyx115_option1_call') ) {	
	function xyx115_option1_call($options) {		
		if (!empty($options['title'])){
			//echo $options['title'].'<hr>';
			};		
		if (!empty($options['url'])){
			//echo $options['url'].'<hr>';
			};
		
		if (isset($options['Expand'])){
			add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);
		};		
		if (!empty($options['sbak'])){
			//require_once(xyx115_PLUGIN_PATH.'/core/xyx115_core_Tab6_performance_Disable_Google_Fonts.php');
		};		
		if (!empty($options['Introduction'])){
			//echo '<textarea rows="10" cols="200">'.$options['Introduction'].'</textarea>'.'<hr>';
		};
	}	
}



?>
<?php



/** 
 *
 * 移除“WordPress后台管理界面”底部右侧文字“5.2.3版本 ”
 * add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);
 * 请注意,在插件中使用时,上面的这行调用代码,请放在可以控制的位置。除非必须与插件共存亡。
**/


function admin_footer_right_text_xyx115_20200510($text) {
	$text = '当前使用的wordpress版本信息:'.$text;
	return $text;
} 









?>
  • if (!empty($options['title'])){//echo $options['title'].'对$options[‘title’]的值进行判断,如果不为空,则进行某动作。此处为演示,添加了显示该内容。测试时,需要取消//echo $options[‘title’]前面的双斜杠。
  • if (!empty($options[‘url’])){//echo $options[‘url’].”;};,同上。
  • $options[‘Expand’] ,返回0或者1,即布尔值。
  • 此处的判断仅使用if (isset($options[‘Expand’]))即可。
  • //require_once(xyx115_PLUGIN_PATH.’/core/xyx115_core_Tab6_performance_Disable_Google_Fonts.php’);可以采用这样的方法,挂载php脚本到插件中。
  • 请注意:如果你的插件包含了几个功能,并且专门制作了针对单个功能的控制按钮,那么就要把单个功能的控制按钮用好。即:对这个功能的调用,必须在控制范围内。如左边所示,每个功能仅有函数定义。调用放在判断里面。

插件选项功能验证

最后我们来测试一下。在插件管理页面,左边的图是取消勾选,右边的图是加上勾选。现在用户选择可以保存到数据库中,也可以对插件功能进行控制。

因为此处仅只有一个复选框,所以只添加了对一个功能的控制。但在上面的示例中,已经添加了对所有值的判断。用户可以自行定义需要的功能。

本文虽说已经实现了各种功能,但也只是抛砖引玉,其中还有许多内容和细节等待优化。另外,由于本人初步接触wordpress,其中难免错误或不当之处,还请不吝赐教。

全文完整代码

最后,此处贴出所有代码。方便感兴趣的人进行研究。

<?php


/**
 * Plugin name: 迷路轮回演示插件
 * Plugin URI: http://www.xyx115.com/xyx115
 * Description: 迷路轮回演示插件,用于演示插件基本制作过程。
 * Version: 1.1
 * Author: 迷路轮回
 * Author URI: http://www.xyx115.com/Author 
 * Author email: xyx115@qq.com
 * License: GPL-2.0
 * License URI: http://www.xyx115.com/
 * Donate URI: http://www.xyx115.com
 * Text Domain: 迷路轮回演示插件,专门用于演示插件制作过程。
 * Domain Path: /lang
 * Requires at least: 5.3
**/


?>
<?php




// 添加一级菜单菜单
if ( !function_exists('add_my_menu') ) {
	function add_my_menu()	{
		add_menu_page(
			__('xyx115_Menu_Page_Tile', '页面标题文字') , 	// $page_title 页面标题
			__('xyx115_Menu', '菜单名称文字') , 			// $menu_title 菜单名称
			'manage_options', 								// $capability capability
			'xyx115', 										// $menu_slug xyx115_menu_slug ,链接别名,体现在URL中
			'xyx115_menu_page', 							// $function 函数将呈现其输出,即所有页面ui都在这个函数内部。
			'http://localhost/test/wp-content/uploads/2020/05/logo_16x16-2.png',   	// $icon_url 指定插件的图标为插件目录中的图片
			99,    											// $position 菜单选项的位置
		);
	}
}
add_action('admin_menu', 'add_my_menu');




?>
<?php





function xyx115_register_settings(){

   $default_options=array(
        'title'=>'迷路轮回',
        'url'=>'http://www.xyx115.com/',
		'Expand'=>'1',
		'sbak'=>'5',
        'Introduction'=>		
			'插件标题,演示的是一个标准的文本字段
插件网站,演示的是一个标准的文本字段来填写网址。字段本身会验证输入的是否为网址。
数组扩展,演示的是一个复选框功能,并且演示了如何在一行文本中加入代码段。
选择,演示了如何创建文本段,并且加入了展位符提示功能和内容。
所有功能条目都可以设置说明文字。
所有功能条目的内容都可以正常保存到数据库中。
所有条目都可以设置默认值。',
         );

        add_option('xyx115_option1',$default_options,1);
		// 向数据库添加默认参数,如果数据库中已经存在该数据条目,则不执行任何操作。
        register_setting('register_xyx115_option1', 'xyx115_option1');
		// 注册合法的数据条目。
		
}

add_action('admin_init', 'xyx115_register_settings');





function xyx115_menu_page(){
        $options=get_option('xyx115_option1');
		xyx115_option1_call($options);
        ?>

	<div class="wrap">
		<?php
	 screen_icon(); ?>
		<h1>迷路轮回 菜单功能演示</h1>
		<form method="post" action="options.php">
			<?php
	
	settings_fields('register_xyx115_option1'); ?>
<table class="form-table" role="presentation"><tbody>

	<tr>					
		<th scope="row"><label for="title"><?php _e( '插件标题:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[title]" id="title" type="text" value="<?php echo $options['title']; ?>" class="regular-text" />						
		<p class="description" ><?php _e('在条目下面可以添加文字进行说明,方便用户输入更有价值的内容。', 'xyx115_domain'); ?></p>
		</td>             
	</tr>
	
	<tr>
		<th scope="row"><label for="url"><?php _e( '插件网站:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[url]"id="url" type="url" value="<?php echo $options['url']; ?>" class="regular-text code" />
		<p class="description"><?php _e('显示给用户的') . '<a href="http://www.xyx115.com/">' . _e('插件网址')  . '</a>' . _e(',请在此输入url地址。'); ?></p>
		</td>
	</tr>
	
	<tr>
		<th scope="row"><label for="Expand"><?php _e( '数组扩展:', 'xyx115_domain'); ?></label></th>
		<td><input name="xyx115_option1[Expand]" id="Expand" type="checkbox" 
		value="<?php echo $options['Expand']; ?>" <?php echo isset($options['Expand']) ? "checked " : ""; ?> />
		<nobr>启用数组功能扩展,使用<code>dump($array)</code>直观显示数组内容</nobr>
		<p class="description" >这里可以添加注释内容,也可以删除不添加。</p>
		</td>		
	</tr>

	<tr>
		<th scope="row"><label for="sbak"><?php _e( '选择对本插件的欢迎程度:' , 'xyx115_domain'); ?></label></th>
		<td><select name="xyx115_option1[sbak]" id="sbak">
			<option value="0" <?php echo ("0" == $options['sbak']) ? 'selected' : ""; ?> >不做评价</option>
			<option value="1" <?php echo ("1" == $options['sbak']) ? 'selected' : ""; ?> >一星</option>
			<option value="2" <?php echo ("2" == $options['sbak']) ? 'selected' : ""; ?> >二星</option>
			<option value="3" <?php echo ("3" == $options['sbak']) ? 'selected' : ""; ?> >三星</option>
			<option value="4" <?php echo ("4" == $options['sbak']) ? 'selected' : ""; ?> >四星</option>
			<option value="5" <?php echo ("5" == $options['sbak']) ? 'selected' : ""; ?> >五星</option></select>
			<p class="description" >这里是说明文字</p></td>
			
	</tr>
	
	<tr>
		<th scope="row"><label for="Introduction"><?php _e( '备注信息:', 'xyx115_domain'); ?></label></th>
		<td>
			<textarea name="xyx115_option1[Introduction]" id="Introduction" type="text" rows="10" cols="50" 
				class="large-text" placeholder='你好,这是占位符,可以输入一些内容,当用户在该区域没有输入任何内容的时候,可以给用户一些提示' ><?php echo $options['Introduction'] ;?></textarea>
				<p class="description" >这里是说明文字</p>
		</td>
	</tr>
</tbody></table> 
 <?php submit_button(); ?>
		   </form>
	</div>
	 

<?php  

} 




?>
<?php






if ( !function_exists('xyx115_option1_call') ) {	
	function xyx115_option1_call($options) {		
		if (!empty($options['title'])){
			//echo $options['title'].'<hr>';
			};		
		if (!empty($options['url'])){
			//echo $options['url'].'<hr>';
			};
		
		if (isset($options['Expand'])){
			add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);
		};		
		if (!empty($options['sbak'])){
			//require_once(xyx115_PLUGIN_PATH.'/core/xyx115_core_Tab6_performance_Disable_Google_Fonts.php');
		};		
		if (!empty($options['Introduction'])){
			//echo '<textarea rows="10" cols="200">'.$options['Introduction'].'</textarea>'.'<hr>';
		};
	}	
}



?>
<?php



/** 
 *
 * 移除“WordPress后台管理界面”底部右侧文字“5.2.3版本 ”
 * add_filter('update_footer', 'admin_footer_right_text_xyx115_20200510', 11);
 * 请注意,在插件中使用时,上面的这行调用代码,请放在可以控制的位置。除非必须与插件共存亡。
**/


function admin_footer_right_text_xyx115_20200510($text) {
	$text = '当前使用的wordpress版本信息:'.$text;
	return $text;
} 









?>
<?php






/**
 * 
 * 在登录页面Logo下方,登录框上方添加额外的信息
 * 即:给网站名称前面加上字符串。例如欢迎光临,或者公司名称,网站名称等
 * get_stylesheet_directory_uri()获取当前子主题目录。
 * get_template_directory_uri();获取当前父主题目录。
 * 迷路轮回    http://www.xyx115.com
 * //add_action('login_head', 'custom_login_message');// 登录页面的最上面,需要在css中规划和设置居中。
 * //add_action('login_message', 'custom_login_message');// 登录页面Logo下方,登录框上方的位置。
 * 请注意,在插件中使用时,上面的这行调用代码,请放在可以控制的位置。除非必须与插件共存亡。
**/


function custom_login_message() {
    echo '<p 
	style="
	text-align:center;
	font-size:24px" 
	>
	' .get_bloginfo('name').
	'</p>
	</br>';
}




?>
Scroll to Top