oberonlai/wp-option

为WordPress添加选项页面。

维护者

详细信息

github.com/oberonlai/wp-option

主页

源代码

问题

安装: 57

依赖项: 0

建议者: 0

安全: 0

星标: 7

关注者: 1

分支: 2

开放问题: 0

v1.0.5 2021-11-27 03:02 UTC

Requires

  • php: >=7.2

MIT 59945dbfb544abb89eca8345aabcb0910e9b9777

This package is auto-updated.

Last update: 2024-09-27 09:23:27 UTC

README

一个简单的WordPress设置API类，修改自boo-settings-helper

需求

安装

使用Composer安装

在您的终端中运行以下命令以使用Composer安装。

$ composer require oberonlai/wp-option

WP Option PSR-4 自动加载，并可以使用Composer的自动加载器。以下是一个基本示例，尽管您的设置可能因您如何使用Composer而有所不同。

require __DIR__ . '/vendor/autoload.php';

use ODS\Option;

$prefix = 'plugin-prefix';

$books = new Option( $prefix );

有关使用Composer和自动加载的详细信息，请参阅Composer的基本使用指南。

基本用法

以下是一个设置简单选项页面的基本示例。

// Require the Composer autoloader.
require __DIR__ . '/vendor/autoload.php';

// Import PostTypes.
use ODS\Option;

$config = new Option( 'plugin-prefix' );
$config->addMenu();
$config->addTab();
$config->addText();
$config->register(); // Don't forget this.

用法

要创建一个选项，首先实例化一个Option实例。该类接受一个参数，即插件前缀。所有选项的名称都将添加此前缀。

$config = new Option( 'plugin-prefix' );

实例化上述选项后，您必须添加设置菜单和选项卡。

菜单

首先，我们需要将管理菜单添加到我们的管理页面上。

$config->addMenu(
	array(
		'page_title' => __( 'Plugin Name Settings', 'plugin-name' ),
		'menu_title' => __( 'Plugin Name', 'plugin-name' ),
		'capability' => 'manage_options',
		'slug'       => 'plugin-name',
		'icon'       => 'dashicons-performance',
		'position'   => 10,
		'submenu'    => true,
		'parent'     => 'edit.php?post_type=event',
	)
);

如果您想在设置菜单下添加菜单，则必须将选项设置为true。

$config->addMenu(
	array(
		'page_title' => __( 'Plugin Name Settings', 'plugin-name' ),
		'menu_title' => __( 'Plugin Name', 'plugin-name' ),
		'capability' => 'manage_options',
		'slug'       => 'plugin-name',
		'option'     => true
	)
);

选项卡

您必须添加至少一个选项卡。字段放置在选项卡中。

$config->addTab(
	array(
		array(
			'id'    => 'general_section',
			'title' => __( 'General Settings', 'plugin-name' ),
			'desc'  => __( 'These are general settings for Plugin Name', 'plugin-name' ),
		),
		array(
			'id'    => 'advance_section',
			'title' => __( 'Advanced Settings', 'plugin-name' ),
			'desc'  => __( 'These are advance settings for Plugin Name', 'plugin-name' )
		)
	)
);

可用字段

字段列表

  • 文本
  • URL
  • 数字
  • 颜色
  • 文本区域
  • 单选按钮
  • 选择
  • HTML
  • 复选框
  • 多选
  • 相关
  • 密码
  • 文件
  • 媒体上传

字段的通用参数

  • id - (string) 字段ID。使用 get_option( $plugin-prefix. 'field_id' ) 获取值。
  • label - (string) 字段名称。
  • desc - (string) 字段描述。
  • placeholder - (string) 字段占位符。
  • default - (string) 选择、复选框、单选默认选项。
  • options - (array) 选择、单选、多选选项。
  • callback - (callback) 用于渲染字段的函数名。
  • sanitize_callback (callback) 用于清理的函数名。
  • show_in_rest - (Boolean) 在REST API中显示。
  • class - (string) - 字段的CSS类名。使用空格分隔多个类。
  • size - (string) - 字段大小。选项为small、regular和large。
array(
	'id'                => 'text_field_id',
	'label'             => __( 'Text Field', 'plugin-name' ), 
	'desc'              => __( 'Some description of my field', 'plugin-name' ),
	'placeholder'       => 'This is Placeholder',
	'default'           => '', 
	'options'           => array(),
	'callback'          => '',
	'sanitize_callback' => '',
	'show_in_rest'      => true,
	'class'             => 'my_custom_css_class',
	'size'              => 'regular',
),

文本

有三个参数。第一个是选项卡ID，第二个是文本字段参数，最后一个是为渲染字段调用的回调函数。

$config->addText(
	'general_section',
	array(
		'id'                => 'text_field_id',
		'label'             => __( 'Hello World', 'plugin-name' ),
		'desc'              => __( 'Some description of my field', 'plugin-name' ),
		'placeholder'       => 'This is Placeholder',
		'show_in_rest'      => true,
		'class'             => 'my_custom_css_class',
		'size'              => 'regular',
	),
);

带有渲染回调函数

$config->addText(
	'general_section',
	array(
		'id'    => 'text_field_id',
		'label' => __( 'Hello World', 'plugin-name' ),
	),
	function( $args ) {
		$html  = sprintf(
			'<input 
				class="regular-text"
				type="%1$s"
				name="%2$s"
				value="%3$s"
				placeholder="%4$s"
            	style="border: 3px solid red;"
			/>',
			$args['type'],
			$args['name'],
			$args['value'],
			'Placeholder from callback'
		);
		$html .= '<br/><small>This field is generated with callback parameter</small>';
		echo $html;
		unset( $html );
	}
);

URL

$config->addUrl(
	'general_section',
	array(
		'id'    => 'url_field_id',
		'label' => __( 'URL Field', 'plugin-name' ),
	),
);

数字

$config->addNumber(
	'general_section',
	array(
		'id'          => 'number_field_id',
		'label'       => __( 'Number Input', 'plugin-name' ),
		'placeholder' => __( 'Your Age here', 'plugin-name' ),
		'options'     => array(
			'min'  => 0,
			'max'  => 99,
			'step' => '1',
		),
	),
);

颜色

$config->addColor(
	'general_section',
	array(
		'id'    => 'color_field_id',
		'label' => __( 'Color Field', 'plugin-name' ),
	),
);

文本区域

$config->addTextarea(
	'general_section',
	array(
		'id'          => 'textarea_field_id',
		'label'       => __( 'Textarea Input', 'plugin-name' ),
		'desc'        => __( 'Textarea description', 'plugin-name' ),
		'placeholder' => __( 'Textarea placeholder', 'plugin-name' ),
	),
);

单选按钮

$config->addRadio(
	'general_section',
	array(
		'id'      => 'radio_field_id',
		'label'   => __( 'Radio Button', 'plugin-name' ),
		'desc'    => __( 'A radio button', 'plugin-name' ),
		'options' => array(
			'radio_1' => 'Radio 1',
			'radio_2' => 'Radio 2',
			'radio_3' => 'Radio 3',
		),
		'default' => 'radio_2',
	),
);

选择

$config->addSelect(
	'general_section',
	array(
		'id'      => 'select_field_id',
		'label'   => __( 'A Dropdown Select', 'plugin-name' ),
		'desc'    => __( 'Dropdown description', 'plugin-name' ),
		'default' => 'option_2',
		'options' => array(
			'option_1' => 'Option 1',
			'option_2' => 'Option 2',
			'option_3' => 'Option 3',
		),
		'default' => 'option_3',
	),
);

HTML

在表格行中添加静态HTML。

$config->addHtml(
	'general_section',
	array(
		'id'    => 'html',
		'label' => 'HTML',
		'desc'  => __( 'HTML area description. You can use any <strong>bold</strong> or other HTML elements.', 'plugin-name' ),
	),
);

复选框

$config->addCheckbox(
	'general_section',
	array(
		'id'    => 'checkbox_field_id',
		'label' => __( 'Checkbox', 'plugin-name' ),
		'desc'  => __( 'A Checkbox', 'plugin-name' ),
	),
);

复选框

$config->addCheckboxes(
	'general_section',
	array(
		'id'      => 'multi_field_id',
		'label'   => __( 'Checkboxes', 'plugin-name' ),
		'desc'    => __( 'A checkboxes', 'plugin-name' ),
		'options' => array(
			'multi_1' => 'Multi 1',
			'multi_2' => 'Multi 2',
			'multi_3' => 'Multi 3',
		),
		'default' => array(
			'multi_1' => 'multi_1',
			'multi_3' => 'multi_3',
		),
	),
);

文章

添加特定帖子类型。第三个参数是自定义帖子类型的名称。

$config->addPost(
	'general_section',
	array(
		'id'      => 'pages_field_id',
		'label'   => __( 'Pages Field Type', 'plugin-name' ),
		'desc'    => __( 'List of Pages', 'plugin-name' ),
	),
	'page' // post type
);

密码

$config->addPassword(
	'general_section',
	array(
		'id'          => 'password_field_id',
		'label'       => __( 'Password Field', 'plugin-name' ),
		'desc'        => __( 'Password description', 'plugin-name' ),
		'placeholder' => __( 'Textarea placeholder', 'plugin-name' ),
	),
);

文件上传器

$config->addFile(
	'general_section',
	array(
		'id'      => 'file_field_id',
		'label'   => __( 'File', 'plugin-name' ),
		'desc'    => __( 'File description', 'plugin-name' ),
		'options' => array(
			'btn' => 'Get it', // upload button text
		),
	),
);

媒体上传器

$config->addMedia(
	'general_section',
	array(
		'id'      => 'media_field_id',
		'label'   => __( 'Media', 'plugin-name' ),
		'desc'    => __( 'Media', 'plugin-name' ),
		'type'    => 'media',
		'options' => array(
			'btn'       => __( 'Get the image', 'plugin-name' ),
			'width'     => 150,
			'max_width' => 150,
		),
	),
);

渲染字段

您可以在添加字段时使用回调函数来渲染字段。

$config->addText(
	'general_section',
	array(
		'id'    => 'text_field_id',
		'label' => __( 'Hello World', 'plugin-name' ),
	),
	function( $args ) {
		$html  = sprintf(
			'<input 
				class="regular-text"
				type="%1$s"
				name="%2$s"
				value="%3$s"
				placeholder="%4$s"
            	style="border: 3px solid red;"
			/>',
			$args['type'],
			$args['name'],
			$args['value'],
			'Placeholder from callback'
		);
		$html .= '<br/><small>This field is generated with callback parameter</small>';
		echo $html;
		unset( $html );
	}
);

在插件列表中添加链接

您可以在列表中插件名称下方添加链接。

$config->addLink(
	'my-plugin',  // Your plugin's folder and main file name.
	array(
		array(
			'type' => 'default',
			'text' => __( 'Configure', 'plugin-name' ),
		),
		array(
			'type' => 'internal',
			'text' => __( 'Gravity Forms', 'plugin-name' ),
			'url'  => 'admin.php?page=gf_edit_forms',
		),
		array(
			'type' => 'external',
			'text' => __( 'Github Repo', 'plugin-name' ),
			'url'  => 'https://github.com/boospot/boo-settings-helper',
		),
	)
);

检索字段的值

您可以使用WordPress get_option()来获取值。不要忘记字段ID的前缀名称。例如：

use ODS\Option;

$config = new Option( 'hello-world-' );
$config->addMenu();
$config->addTab();
$config->addText(
	'general_section',
	array(
		'id'                => 'my_text_field',
		'label'             => __( 'Hello World', 'plugin-name' ),
		'desc'              => __( 'Some description of my field', 'plugin-name' ),
		'placeholder'       => 'This is Placeholder',
		'show_in_rest'      => true,
		'class'             => 'my_custom_css_class',
		'size'              => 'regular',
	),
);

如果您想检索'my_text_field'字段的值，请使用以下代码

$my_text_field_value = get_option( 'hello-world-my_text_field' );