inc2734 / wp-customizer-framework
A library for WordPress Customizer.
Installs: 8 055
Dependents: 1
Suggesters: 0
Security: 0
Stars: 21
Watchers: 3
Forks: 3
Open Issues: 4
Requires
- php: >=7.4
Requires (Dev)
- dev-master
- 11.0.4
- 11.0.3
- 11.0.2
- 11.0.1
- 11.0.0
- 10.1.1
- 10.1.0
- 10.0.1
- 10.0.0
- 9.0.0
- 8.0.0
- 7.1.4
- 7.1.3
- 7.1.2
- 7.1.1
- 7.1.0
- 7.0.2
- 7.0.1
- 7.0.0
- 6.0.3
- 6.0.2
- 6.0.1
- 6.0.0
- 5.0.3
- 5.0.2
- 5.0.1
- 5.0.0
- 4.1.0
- 4.0.0
- 3.3.2
- 3.3.1
- 3.3.0
- 3.2.5
- 3.2.4
- 3.2.3
- 3.2.2
- 3.2.1
- 3.2.0
- 3.1.5
- 3.1.4
- 3.1.3
- 3.1.2
- 3.1.1
- 3.1.0
- 3.0.8
- 3.0.7
- 3.0.6
- 3.0.5
- 3.0.4
- 3.0.3
- 3.0.2
- 2.3.0
- 2.2.2
- 2.2.1
- 2.2.0
- 2.1.3
- 2.1.2
- 2.1.1
- 2.1.0
- 2.0.6
- 2.0.5
- 2.0.4
- 2.0.3
- 2.0.2
- 2.0.1
- 2.0.0
- 1.1.0
- 1.0.2
- 1.0.1
- 1.0.0
- dev-dependabot/npm_and_yarn/http-cache-semantics-4.1.1
- dev-dependabot/npm_and_yarn/simple-git-3.16.0
- dev-dependabot/npm_and_yarn/shell-quote-1.7.4
- dev-dependabot/npm_and_yarn/minimatch-3.1.2
- dev-develop
This package is auto-updated.
Last update: 2024-10-07 13:00:23 UTC
README
A Framework of WordPress Customizer API.
Install
In your theme directory.
$ composer require inc2734/wp-customizer-framework
How to use
Initialize
require_once( get_theme_file_path( '/vendor/autoload.php' ) );
new \Inc2734\WP_Customizer_Framework\Bootstrap(
'handle' => 'main style sheet handle',
);
Customizer
use Inc2734\WP_Customizer_Framework\Framework;
Framework::panel( 'panel-id', [
'title' => 'panel-name',
] );
Framework::section( 'section-id', [
'title' => 'section-name',
] );
Framework::control( 'type', 'control-id', [
'label' => 'Header Color',
'default' => '#f00',
] );
$panel = Framework::get_panel( 'panel-id' );
$section = Framework::get_section( 'section-id' );
$control = Framework::get_control( 'control-id' );
$control->join( $section )->join( $panel );
$control->partial( [
'selector' => '.blogname',
] );
Set styles
use Inc2734\WP_Customizer_Framework\Style;
add_action(
'inc2734_wp_customizer_framework_load_styles',
function() {
$accent_color = get_theme_mod( 'accent-color' );
Style::attach(
'The handle of enqueued style',
[
[
'selectors' => [
'.page-title',
'.strong',
],
'properties' => [
"color: {$accent_color}",
"border-bottom-color: {$accent_color}",
],
'media_query' => '@media (min-width: 768px)', // Optional
],
]
);
}
);
Using placeholder
use Inc2734\WP_Customizer_Framework\Style;
add_action(
'inc2734_wp_customizer_framework_load_styles',
function() {
/**
* Extend "btn-base" placeholder
*
* Style::extend( 'btn-base', [ '.btn-a' ] );
*/
include_once( get_theme_file_path( '/css/btn-a.php' ) );
/**
* Extend "btn-base" placeholder
*
* Style::extend( 'btn-base', [ '.btn-b' ] );
*/
include_once( get_theme_file_path( '/css/btn-b.php' ) );
/**
* Extend "btn-base" placeholder
*
* Style::extend( 'btn-base', [ '.btn-c' ] );
*/
include_once( get_theme_file_path( '/css/btn-c.php' ) );
}
);
add_action(
'inc2734_wp_customizer_framework_after_load_styles',
function() {
Style::placeholder(
'btn-base',
function( $selectors ) {
$accent_color = get_theme_mod( 'accent-color' );
Style::attach(
'The handle of enqueued style',
[
[
'selectors' => $selectors,
'properties' => [ "border-color: {$accent_color}" ],
],
]
);
}
);
}
);