email-templates / admin / test.php

test.php in Email Templates Customizer and Designer for WordPress and WooCommerce trunk, at admin/test.php

140 lines 5.7 KB

Raw Download Zip

1	<?php
2	/**
3	* Contains methods for customizing the theme customization screen.
4	*
5	* @link http://codex.wordpress.org/Theme_Customization_API
6	* @since MyTheme 1.0
7	*/
8	class MyTheme_Customize {
9	/**
10	* This hooks into 'customize_register' (available as of WP 3.4) and allows
11	* you to add new sections and controls to the Theme Customize screen.
12	*
13	* Note: To enable instant preview, we have to actually write a bit of custom
14	* javascript. See live_preview() for more.
15	*
16	* @see add_action('customize_register',$func)
17	* @param \WP_Customize_Manager $wp_customize
18	* @link http://ottopress.com/2012/how-to-leverage-the-theme-customizer-in-your-own-themes/
19	* @since MyTheme 1.0
20	*/
21	public static function register ( $wp_customize ) {
22	//1. Define a new section (if desired) to the Theme Customizer
23	$wp_customize->add_section( 'mytheme_options',
24	array(
25	'title' => __( 'MyTheme Options', 'mytheme' ), //Visible title of section
26	'priority' => 35, //Determines what order this appears in
27	'capability' => 'edit_theme_options', //Capability needed to tweak
28	'description' => __('Allows you to customize some example settings for MyTheme.', 'mytheme'), //Descriptive tooltip
29	)
30	);
31
32	//2. Register new settings to the WP database...
33	$wp_customize->add_setting( 'link_textcolor', //No need to use a SERIALIZED name, as `theme_mod` settings already live under one db record
34	array(
35	'default' => '#2BA6CB', //Default setting/value to save
36	'type' => 'theme_mod', //Is this an 'option' or a 'theme_mod'?
37	'capability' => 'edit_theme_options', //Optional. Special permissions for accessing this setting.
38	'transport' => 'postMessage', //What triggers a refresh of the setting? 'refresh' or 'postMessage' (instant)?
39	)
40	);
41
42	//3. Finally, we define the control itself (which links a setting to a section and renders the HTML controls)...
43	$wp_customize->add_control( new WP_Customize_Color_Control( //Instantiate the color control class
44	$wp_customize, //Pass the $wp_customize object (required)
45	'mytheme_link_textcolor', //Set a unique ID for the control
46	array(
47	'label' => __( 'Link Color', 'mytheme' ), //Admin-visible name of the control
48	'section' => 'colors', //ID of the section this control should render in (can be one of yours, or a WordPress default section)
49	'settings' => 'link_textcolor', //Which setting to load and manipulate (serialized is okay)
50	'priority' => 10, //Determines the order this control appears in for the specified section
51	)
52	) );
53
54	//4. We can also change built-in settings by modifying properties. For instance, let's make some stuff use live preview JS...
55	$wp_customize->get_setting( 'blogname' )->transport = 'postMessage';
56	$wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
57	$wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
58	$wp_customize->get_setting( 'background_color' )->transport = 'postMessage';
59	}
60
61	/**
62	* This will output the custom WordPress settings to the live theme's WP head.
63	*
64	* Used by hook: 'wp_head'
65	*
66	* @see add_action('wp_head',$func)
67	* @since MyTheme 1.0
68	*/
69	public static function header_output() {
70	?>
71	<!--Customizer CSS-->
72	<style type="text/css">
73	<?php self::generate_css('#site-title a', 'color', 'header_textcolor', '#'); ?>
74	<?php self::generate_css('body', 'background-color', 'background_color', '#'); ?>
75	<?php self::generate_css('a', 'color', 'link_textcolor'); ?>
76	</style>
77	<!--/Customizer CSS-->
78	<?php
79	}
80
81	/**
82	* This outputs the javascript needed to automate the live settings preview.
83	* Also keep in mind that this function isn't necessary unless your settings
84	* are using 'transport'=>'postMessage' instead of the default 'transport'
85	* => 'refresh'
86	*
87	* Used by hook: 'customize_preview_init'
88	*
89	* @see add_action('customize_preview_init',$func)
90	* @since MyTheme 1.0
91	*/
92	public static function live_preview() {
93	wp_enqueue_script(
94	'mytheme-themecustomizer', // Give the script a unique ID
95	get_template_directory_uri() . '/assets/js/theme-customizer.js', // Define the path to the JS file
96	array( 'jquery', 'customize-preview' ), // Define dependencies
97	'', // Define a version (optional)
98	true // Specify whether to put in footer (leave this true)
99	);
100	}
101
102	/**
103	* This will generate a line of CSS for use in header output. If the setting
104	* ($mod_name) has no defined value, the CSS will not be output.
105	*
106	* @uses get_theme_mod()
107	* @param string $selector CSS selector
108	* @param string $style The name of the CSS property to modify
109	* @param string $mod_name The name of the 'theme_mod' option to fetch
110	* @param string $prefix Optional. Anything that needs to be output before the CSS property
111	* @param string $postfix Optional. Anything that needs to be output after the CSS property
112	* @param bool $echo Optional. Whether to print directly to the page (default: true).
113	* @return string Returns a single line of CSS with selectors and a property.
114	* @since MyTheme 1.0
115	*/
116	public static function generate_css( $selector, $style, $mod_name, $prefix='', $postfix='', $echo=true ) {
117	$return = '';
118	$mod = get_theme_mod($mod_name);
119	if ( ! empty( $mod ) ) {
120	$return = sprintf('%s { %s:%s; }',
121	$selector,
122	$style,
123	$prefix.$mod.$postfix
124	);
125	if ( $echo ) {
126	echo $return;
127	}
128	}
129	return $return;
130	}
131	}
132
133	// Setup the Theme Customizer settings and controls...
134	add_action( 'customize_register' , array( 'MyTheme_Customize' , 'register' ) );
135
136	// Output custom CSS to live site
137	add_action( 'wp_head' , array( 'MyTheme_Customize' , 'header_output' ) );
138
139	// Enqueue live preview javascript in Theme Customizer admin screen
140	add_action( 'customize_preview_init' , array( 'MyTheme_Customize' , 'live_preview' ) );