Version Description
- New Feature: option to scan parent theme for additional stylesheets. This allows CTC to be used with themes such as "Responsive" by CyberChimps.
- New Feature: automatically copies parent theme screenshot to child.
Download this release
Release Info
Developer | lilaeamedia |
Plugin | Child Theme Configurator |
Version | 1.3.3 |
Comparing to | |
See all releases |
Code changes from version 1.3.2 to 1.3.3
- child-theme-configurator.php +4 -2
- includes/class-ctc-css.php +86 -21
- includes/class-ctc-ui.php +23 -5
- includes/class-ctc.php +26 -12
- js/chld-thm-cfg.js +2 -2
- js/chld-thm-cfg.min.js +1 -1
- readme.txt +56 -39
- screenshot-1.jpg +0 -0
child-theme-configurator.php
CHANGED
@@ -6,7 +6,7 @@ if ( !defined('ABSPATH')) exit;
|
|
6 |
Plugin Name: Child Theme Configurator
|
7 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
8 |
Description: Create a Child Theme from any installed Theme. Each CSS selector, rule and value can then be searched, previewed and modified.
|
9 |
-
Version: 1.3.
|
10 |
Author: Lilaea Media
|
11 |
Author URI: http://www.lilaeamedia.com/
|
12 |
Text Domain: chld_thm_cfg
|
@@ -16,7 +16,9 @@ if ( !defined('ABSPATH')) exit;
|
|
16 |
*/
|
17 |
|
18 |
defined('LF') or define('LF', "\n");
|
19 |
-
define('CHLD_THM_CFG_VERSION', '1.3.
|
|
|
|
|
20 |
|
21 |
if (is_admin()):
|
22 |
include_once( 'includes/class-ctc.php' );
|
6 |
Plugin Name: Child Theme Configurator
|
7 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
8 |
Description: Create a Child Theme from any installed Theme. Each CSS selector, rule and value can then be searched, previewed and modified.
|
9 |
+
Version: 1.3.3
|
10 |
Author: Lilaea Media
|
11 |
Author URI: http://www.lilaeamedia.com/
|
12 |
Text Domain: chld_thm_cfg
|
16 |
*/
|
17 |
|
18 |
defined('LF') or define('LF', "\n");
|
19 |
+
define('CHLD_THM_CFG_VERSION', '1.3.3');
|
20 |
+
define('CHLD_THM_CFG_MAX_SELECTORS', '5000');
|
21 |
+
define('CHLD_THM_CFG_MAX_RECURSE_LOOPS', '100');
|
22 |
|
23 |
if (is_admin()):
|
24 |
include_once( 'includes/class-ctc.php' );
|
includes/class-ctc-css.php
CHANGED
@@ -6,7 +6,7 @@ if ( !defined('ABSPATH')) exit;
|
|
6 |
Class: Child_Theme_Configurator_CSS
|
7 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
8 |
Description: Handles all CSS output, parsing, normalization
|
9 |
-
Version: 1.3.
|
10 |
Author: Lilaea Media
|
11 |
Author URI: http://www.lilaeamedia.com/
|
12 |
Text Domain: chld_thm_cfg
|
@@ -44,7 +44,7 @@ class Child_Theme_Configurator_CSS {
|
|
44 |
|
45 |
function __construct() {
|
46 |
// scalars
|
47 |
-
$this->version = '1.3.
|
48 |
$this->querykey = 0;
|
49 |
$this->selkey = 0;
|
50 |
$this->qskey = 0;
|
@@ -65,7 +65,7 @@ class Child_Theme_Configurator_CSS {
|
|
65 |
$this->dict_seq = array();
|
66 |
$this->sel_ndx = array();
|
67 |
$this->val_ndx = array();
|
68 |
-
$this->imports = array('child' =>
|
69 |
$this->updates = array();
|
70 |
}
|
71 |
|
@@ -78,7 +78,7 @@ class Child_Theme_Configurator_CSS {
|
|
78 |
case 'updates':
|
79 |
return $this->obj_to_utf8($this->updates);
|
80 |
case 'imports':
|
81 |
-
return $this->obj_to_utf8($this->imports['child']);
|
82 |
case 'sel_ndx':
|
83 |
return $this->obj_to_utf8($this->denorm_sel_ndx(empty($params['key'])?null:$params['key']));
|
84 |
case 'rule_val':
|
@@ -150,6 +150,9 @@ class Child_Theme_Configurator_CSS {
|
|
150 |
function get_child_target($file = 'style.css') {
|
151 |
return get_theme_root() . '/' . $this->get_prop('child') . '/' . $file;
|
152 |
}
|
|
|
|
|
|
|
153 |
|
154 |
/*
|
155 |
* update_arrays
|
@@ -230,16 +233,72 @@ class Child_Theme_Configurator_CSS {
|
|
230 |
|
231 |
function read_stylesheet($template = 'child') {
|
232 |
$source = $this->get_prop($template);
|
|
|
233 |
if (empty($source) || !is_scalar($source)) return false;
|
234 |
-
$
|
235 |
-
|
236 |
-
|
237 |
-
|
238 |
-
|
|
|
239 |
endif;
|
240 |
-
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
241 |
}
|
242 |
-
|
243 |
/*
|
244 |
* parse_post_data
|
245 |
* Parse user form input into separate properties and pass to update_arrays
|
@@ -250,9 +309,10 @@ class Child_Theme_Configurator_CSS {
|
|
250 |
$this->parse_css('child', LF . $this->parse_css_input($_POST['ctc_new_selectors']),
|
251 |
(isset($_POST['ctc_sel_ovrd_query'])?trim($_POST['ctc_sel_ovrd_query']):null), false);
|
252 |
elseif (isset($_POST['ctc_child_imports'])):
|
253 |
-
$this->
|
|
|
254 |
else:
|
255 |
-
$newselector = isset($_POST['ctc_rewrite_selector']) ? sanitize_text_field(
|
256 |
// set the custom sequence value
|
257 |
foreach (preg_grep('#^ctc_ovrd_child_seq_#', array_keys($_POST)) as $post_key):
|
258 |
if (preg_match('#^ctc_ovrd_child_seq_(\d+)$#', $post_key, $matches)):
|
@@ -268,7 +328,7 @@ class Child_Theme_Configurator_CSS {
|
|
268 |
if (null == $rule || !isset($this->dict_rule[$rule])) continue;
|
269 |
$ruleid = $this->dict_rule[$rule];
|
270 |
$qsid = $matches[3];
|
271 |
-
$value = sanitize_text_field(
|
272 |
$important = $this->is_important($value);
|
273 |
if (!empty($_POST['ctc_' . $valid . '_child_' . $rule . '_i_' . $qsid])) $important = 1;
|
274 |
|
@@ -343,7 +403,7 @@ class Child_Theme_Configurator_CSS {
|
|
343 |
* TODO: this is a stub for future use
|
344 |
*/
|
345 |
function parse_css_input($styles) {
|
346 |
-
return $styles;
|
347 |
}
|
348 |
|
349 |
/*
|
@@ -377,10 +437,11 @@ class Child_Theme_Configurator_CSS {
|
|
377 |
if ($parse_imports):
|
378 |
$regex = '#(\@import.+?);#';
|
379 |
preg_match_all($regex, $styles, $matches);
|
380 |
-
|
|
|
381 |
$this->updates[] = array(
|
382 |
'obj' => 'imports',
|
383 |
-
'data' => $this->imports[$template],
|
384 |
);
|
385 |
endif;
|
386 |
// break into @ segments
|
@@ -400,6 +461,7 @@ class Child_Theme_Configurator_CSS {
|
|
400 |
$stuff = array_shift($matches[2]);
|
401 |
$this->update_arrays($template, $query, $sel);
|
402 |
foreach (explode(';', $stuff) as $ruleval):
|
|
|
403 |
if (false === strpos($ruleval, ':')) continue;
|
404 |
list($rule, $value) = explode(':', $ruleval, 2);
|
405 |
$rule = trim($rule);
|
@@ -754,10 +816,13 @@ class Child_Theme_Configurator_CSS {
|
|
754 |
$param[2] = '0%';
|
755 |
$param[4] = '100%';
|
756 |
endif;
|
757 |
-
$
|
758 |
-
|
759 |
-
|
760 |
-
|
|
|
|
|
|
|
761 |
}
|
762 |
|
763 |
/*
|
6 |
Class: Child_Theme_Configurator_CSS
|
7 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
8 |
Description: Handles all CSS output, parsing, normalization
|
9 |
+
Version: 1.3.3
|
10 |
Author: Lilaea Media
|
11 |
Author URI: http://www.lilaeamedia.com/
|
12 |
Text Domain: chld_thm_cfg
|
44 |
|
45 |
function __construct() {
|
46 |
// scalars
|
47 |
+
$this->version = '1.3.3';
|
48 |
$this->querykey = 0;
|
49 |
$this->selkey = 0;
|
50 |
$this->qskey = 0;
|
65 |
$this->dict_seq = array();
|
66 |
$this->sel_ndx = array();
|
67 |
$this->val_ndx = array();
|
68 |
+
$this->imports = array('child' => array(), 'parnt' => array());
|
69 |
$this->updates = array();
|
70 |
}
|
71 |
|
78 |
case 'updates':
|
79 |
return $this->obj_to_utf8($this->updates);
|
80 |
case 'imports':
|
81 |
+
return $this->obj_to_utf8(array_keys($this->imports['child']));
|
82 |
case 'sel_ndx':
|
83 |
return $this->obj_to_utf8($this->denorm_sel_ndx(empty($params['key'])?null:$params['key']));
|
84 |
case 'rule_val':
|
150 |
function get_child_target($file = 'style.css') {
|
151 |
return get_theme_root() . '/' . $this->get_prop('child') . '/' . $file;
|
152 |
}
|
153 |
+
function get_parent_source($file = 'style.css') {
|
154 |
+
return get_theme_root() . '/' . $this->get_prop('parnt') . '/' . $file;
|
155 |
+
}
|
156 |
|
157 |
/*
|
158 |
* update_arrays
|
233 |
|
234 |
function read_stylesheet($template = 'child') {
|
235 |
$source = $this->get_prop($template);
|
236 |
+
$configtype = $this->get_prop('configtype');
|
237 |
if (empty($source) || !is_scalar($source)) return false;
|
238 |
+
$stylesheets = array();
|
239 |
+
$themedir = get_theme_root() . '/' . $source;
|
240 |
+
if ('parnt' == $template && (empty($configtype) || 'theme' == $configtype) && isset($_POST['ctc_scan_subdirs'])):
|
241 |
+
$stylesheets = $this->recurse_directory($themedir);
|
242 |
+
else:
|
243 |
+
$stylesheets[] = apply_filters('chld_thm_cfg_' . $template, $themedir . '/style.css', $this);
|
244 |
endif;
|
245 |
+
|
246 |
+
// read stylesheets
|
247 |
+
$styles = '';
|
248 |
+
foreach ($stylesheets as $stylesheet):
|
249 |
+
if ($stylesheet_verified = $this->is_file_ok($stylesheet, 'read')):
|
250 |
+
$import_url = preg_replace('%^' . preg_quote($themedir) . '/%', '', $stylesheet_verified);
|
251 |
+
$styles .= @file_get_contents($stylesheet_verified) . "\n";
|
252 |
+
if ($styles && isset($_POST['ctc_scan_subdirs']) && 'parnt' == $template && (empty($configtype) || 'theme' == $configtype) && 'style.css' != $import_url):
|
253 |
+
$this->imports['child']["@import url('../" . $source . '/' . $import_url . "')"] = 1;
|
254 |
+
|
255 |
+
// convert relative urls to absolute
|
256 |
+
$this->convert_parent_rel_url_to_abs_url($import_url, $styles);
|
257 |
+
endif;
|
258 |
+
endif;
|
259 |
+
endforeach;
|
260 |
+
return $styles;
|
261 |
+
}
|
262 |
+
|
263 |
+
function recurse_directory($rootdir, $ext = 'css') {
|
264 |
+
$files = array();
|
265 |
+
$dirs = array($rootdir);
|
266 |
+
$loops = 0;
|
267 |
+
while(count($dirs) && $loops < CHLD_THM_CFG_MAX_RECURSE_LOOPS):
|
268 |
+
$loops++;
|
269 |
+
$dir = array_shift($dirs);
|
270 |
+
if ($handle = opendir($dir)):
|
271 |
+
while (false !== ($file = readdir($handle))):
|
272 |
+
if (preg_match("/^\./", $file)) continue;
|
273 |
+
$filepath = $dir . '/' . $file;
|
274 |
+
if (is_dir($filepath)):
|
275 |
+
array_unshift($dirs, $filepath);
|
276 |
+
elseif (is_file($filepath) && preg_match("/\.".$ext."$/", $filepath)):
|
277 |
+
$files[] = $filepath;
|
278 |
+
endif;
|
279 |
+
endwhile;
|
280 |
+
closedir($handle);
|
281 |
+
endif;
|
282 |
+
endwhile;
|
283 |
+
return $files;
|
284 |
+
}
|
285 |
+
|
286 |
+
function convert_parent_rel_url_to_abs_url($url, &$styles) {
|
287 |
+
$source = $this->get_prop('parnt');
|
288 |
+
$spliton = '%[/\\\\]%';
|
289 |
+
$dirname = dirname($url);
|
290 |
+
$dirs = preg_split($spliton, $dirname);
|
291 |
+
$dds = '';
|
292 |
+
$themeuri = get_theme_root_uri();
|
293 |
+
while (count($dirs)):
|
294 |
+
$thisdir = array_pop($dirs);
|
295 |
+
$upone = implode('/', $dirs);
|
296 |
+
$dds .= '\.\.\/';
|
297 |
+
$regex = '%url\([\'" ]*' . $dds . '(.+?)[\'" ]*\)%';
|
298 |
+
$fullurl = $themeuri . '/' . $source . '/' . $upone . ('' == $upone ? '' : '/' );
|
299 |
+
$styles = preg_replace($regex, "url(" . $fullurl . "$1)", $styles);
|
300 |
+
endwhile;
|
301 |
}
|
|
|
302 |
/*
|
303 |
* parse_post_data
|
304 |
* Parse user form input into separate properties and pass to update_arrays
|
309 |
$this->parse_css('child', LF . $this->parse_css_input($_POST['ctc_new_selectors']),
|
310 |
(isset($_POST['ctc_sel_ovrd_query'])?trim($_POST['ctc_sel_ovrd_query']):null), false);
|
311 |
elseif (isset($_POST['ctc_child_imports'])):
|
312 |
+
$this->imports['child'] = array();
|
313 |
+
$this->parse_css('child', $this->parse_css_input($_POST['ctc_child_imports']));
|
314 |
else:
|
315 |
+
$newselector = isset($_POST['ctc_rewrite_selector']) ? sanitize_text_field($this->parse_css_input(($_POST['ctc_rewrite_selector']))) : NULL;
|
316 |
// set the custom sequence value
|
317 |
foreach (preg_grep('#^ctc_ovrd_child_seq_#', array_keys($_POST)) as $post_key):
|
318 |
if (preg_match('#^ctc_ovrd_child_seq_(\d+)$#', $post_key, $matches)):
|
328 |
if (null == $rule || !isset($this->dict_rule[$rule])) continue;
|
329 |
$ruleid = $this->dict_rule[$rule];
|
330 |
$qsid = $matches[3];
|
331 |
+
$value = sanitize_text_field($this->parse_css_input(($_POST[$post_key])));
|
332 |
$important = $this->is_important($value);
|
333 |
if (!empty($_POST['ctc_' . $valid . '_child_' . $rule . '_i_' . $qsid])) $important = 1;
|
334 |
|
403 |
* TODO: this is a stub for future use
|
404 |
*/
|
405 |
function parse_css_input($styles) {
|
406 |
+
return stripslashes($styles);
|
407 |
}
|
408 |
|
409 |
/*
|
437 |
if ($parse_imports):
|
438 |
$regex = '#(\@import.+?);#';
|
439 |
preg_match_all($regex, $styles, $matches);
|
440 |
+
foreach (preg_grep('#style\.css#', $matches[1], PREG_GREP_INVERT) as $import)
|
441 |
+
$this->imports[$template][$import] = 1;
|
442 |
$this->updates[] = array(
|
443 |
'obj' => 'imports',
|
444 |
+
'data' => array_keys($this->imports[$template]),
|
445 |
);
|
446 |
endif;
|
447 |
// break into @ segments
|
461 |
$stuff = array_shift($matches[2]);
|
462 |
$this->update_arrays($template, $query, $sel);
|
463 |
foreach (explode(';', $stuff) as $ruleval):
|
464 |
+
if ($this->qskey > CHLD_THM_CFG_MAX_SELECTORS) break;
|
465 |
if (false === strpos($ruleval, ':')) continue;
|
466 |
list($rule, $value) = explode(':', $ruleval, 2);
|
467 |
$rule = trim($rule);
|
816 |
$param[2] = '0%';
|
817 |
$param[4] = '100%';
|
818 |
endif;
|
819 |
+
if (isset($parts[7]) && isset($parts[10])):
|
820 |
+
$param[1] = $parts[7];
|
821 |
+
$param[3] = $parts[10];
|
822 |
+
ksort($param);
|
823 |
+
return implode(':', $param);
|
824 |
+
else: return $value;
|
825 |
+
endif;
|
826 |
}
|
827 |
|
828 |
/*
|
includes/class-ctc-ui.php
CHANGED
@@ -5,7 +5,7 @@ if ( !defined('ABSPATH')) exit;
|
|
5 |
Class: Child_Theme_Configurator_UI
|
6 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
7 |
Description: Handles the plugin User Interface
|
8 |
-
Version: 1.3.
|
9 |
Author: Lilaea Media
|
10 |
Author URI: http://www.lilaeamedia.com/
|
11 |
Text Domain: chld_thm_cfg
|
@@ -16,9 +16,11 @@ if ( !defined('ABSPATH')) exit;
|
|
16 |
class Child_Theme_Configurator_UI {
|
17 |
var $swatch_text;
|
18 |
var $themes;
|
|
|
19 |
|
20 |
function __construct() {
|
21 |
-
$this->swatch_text
|
|
|
22 |
}
|
23 |
|
24 |
function render_options() {
|
@@ -34,7 +36,7 @@ class Child_Theme_Configurator_UI {
|
|
34 |
?>
|
35 |
|
36 |
<div class="wrap">
|
37 |
-
<div id="icon-tools" class="icon32"></div
|
38 |
<h2><?php echo $chld_thm_cfg->pluginName; ?></h2>
|
39 |
<div id="ctc_error_notice">
|
40 |
<?php $this->settings_errors(); ?>
|
@@ -154,7 +156,18 @@ class Child_Theme_Configurator_UI {
|
|
154 |
</div>
|
155 |
<div class="ctc-input-cell">
|
156 |
<input class="ctc_checkbox" id="ctc_backup" name="ctc_backup" type="checkbox"
|
157 |
-
value="1"
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
158 |
</div>
|
159 |
</div>
|
160 |
<div class="ctc-input-row clearfix" id="input_row_child_template">
|
@@ -351,7 +364,10 @@ class Child_Theme_Configurator_UI {
|
|
351 |
echo '<div class="updated"><p>' . LF
|
352 |
. apply_filters('chld_thm_cfg_update_msg', sprintf(__('Child Theme <strong>%s</strong> has been generated successfully.', 'chld_thm_cfg'),
|
353 |
$chld_thm_cfg->css->get_prop('child_name')), $chld_thm_cfg) . LF
|
354 |
-
. '</p
|
|
|
|
|
|
|
355 |
endif;
|
356 |
}
|
357 |
|
@@ -384,6 +400,7 @@ class Child_Theme_Configurator_UI {
|
|
384 |
<li>Enter a Name for the child theme.</li>
|
385 |
<li>Enter an author for the child theme.</li>
|
386 |
<li>Enter the child theme version number.</li>
|
|
|
387 |
<li>Click "Generate Child Theme." If you are loading an existing child theme, The Child Theme Configurator will create a backup of your existing stylesheet in the theme directory.</li></ol>
|
388 |
', 'chld_thm_cfg'
|
389 |
),
|
@@ -432,6 +449,7 @@ class Child_Theme_Configurator_UI {
|
|
432 |
'title' => __( '@imports', 'chld_thm_cfg' ),
|
433 |
'content' => __( '
|
434 |
<p>You can add additional stylesheets and web fonts by typing @import rules into the textarea on the @import tab. <strong>Important: The Child Theme Configurator adds the @import rule that loads the Parent Theme\'s stylesheet automatically. Do not need to add it here.</strong></p>
|
|
|
435 |
<p>Below is an example that loads a local custom stylesheet (you would have to add the "fonts" directory and stylesheet) as well as the web font "Open Sans" from Google Web Fonts:</p>
|
436 |
<blockquote><pre><code>
|
437 |
@import url(fonts/stylesheet.css);
|
5 |
Class: Child_Theme_Configurator_UI
|
6 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
7 |
Description: Handles the plugin User Interface
|
8 |
+
Version: 1.3.3
|
9 |
Author: Lilaea Media
|
10 |
Author URI: http://www.lilaeamedia.com/
|
11 |
Text Domain: chld_thm_cfg
|
16 |
class Child_Theme_Configurator_UI {
|
17 |
var $swatch_text;
|
18 |
var $themes;
|
19 |
+
var $extLink;
|
20 |
|
21 |
function __construct() {
|
22 |
+
$this->swatch_text = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.';
|
23 |
+
$this->extLink = '<a href="http://www.lilaeamedia.com/plugins/child-theme-configurator-plugins/" target="_blank" title="' . __('Easily customize your plugins with the CTC Plugin Extension', 'chld_thm_cfg') . '" style="float:right">' . __('Use this to customize your plugins', 'chld_thm_cfg') . '</a>';
|
24 |
}
|
25 |
|
26 |
function render_options() {
|
36 |
?>
|
37 |
|
38 |
<div class="wrap">
|
39 |
+
<div id="icon-tools" class="icon32"></div><?php echo $this->extLink; ?>
|
40 |
<h2><?php echo $chld_thm_cfg->pluginName; ?></h2>
|
41 |
<div id="ctc_error_notice">
|
42 |
<?php $this->settings_errors(); ?>
|
156 |
</div>
|
157 |
<div class="ctc-input-cell">
|
158 |
<input class="ctc_checkbox" id="ctc_backup" name="ctc_backup" type="checkbox"
|
159 |
+
value="1" />
|
160 |
+
</div>
|
161 |
+
</div>
|
162 |
+
<div class="ctc-input-row clearfix" id="input_row_child_template">
|
163 |
+
<div class="ctc-input-cell">
|
164 |
+
<label>
|
165 |
+
<?php _e('Scan Parent Theme<br/>for Additional Stylesheets', 'chld_thm_cfg'); ?>
|
166 |
+
</label>
|
167 |
+
</div>
|
168 |
+
<div class="ctc-input-cell">
|
169 |
+
<input class="ctc_checkbox" id="ctc_scan_subdirs" name="ctc_scan_subdirs" type="checkbox"
|
170 |
+
value="1" />
|
171 |
</div>
|
172 |
</div>
|
173 |
<div class="ctc-input-row clearfix" id="input_row_child_template">
|
364 |
echo '<div class="updated"><p>' . LF
|
365 |
. apply_filters('chld_thm_cfg_update_msg', sprintf(__('Child Theme <strong>%s</strong> has been generated successfully.', 'chld_thm_cfg'),
|
366 |
$chld_thm_cfg->css->get_prop('child_name')), $chld_thm_cfg) . LF
|
367 |
+
. '</p>';
|
368 |
+
|
369 |
+
if ( 9 == $_GET['updated']) echo '<p>' . __('Please verify the imports below and remove any imports that are not needed by the front end, such as admin or configuration stylesheets.', 'chld_thm_cfg') . '</p>' . LF;
|
370 |
+
echo '</div>' . LF;
|
371 |
endif;
|
372 |
}
|
373 |
|
400 |
<li>Enter a Name for the child theme.</li>
|
401 |
<li>Enter an author for the child theme.</li>
|
402 |
<li>Enter the child theme version number.</li>
|
403 |
+
<li>If your theme uses multiple stylesheets, check "Scan Parent Theme for additional stylesheets.</li>
|
404 |
<li>Click "Generate Child Theme." If you are loading an existing child theme, The Child Theme Configurator will create a backup of your existing stylesheet in the theme directory.</li></ol>
|
405 |
', 'chld_thm_cfg'
|
406 |
),
|
449 |
'title' => __( '@imports', 'chld_thm_cfg' ),
|
450 |
'content' => __( '
|
451 |
<p>You can add additional stylesheets and web fonts by typing @import rules into the textarea on the @import tab. <strong>Important: The Child Theme Configurator adds the @import rule that loads the Parent Theme\'s stylesheet automatically. Do not need to add it here.</strong></p>
|
452 |
+
<p><strong>Important:</strong> If you chose "Scan Parent Theme for additional stylesheets," the Child Theme Configurator automically places @import rules for the additional stylesheets here. Be sure to delete any imports that are not needed by the front end, such as admin or configuration stylesheets.</p>
|
453 |
<p>Below is an example that loads a local custom stylesheet (you would have to add the "fonts" directory and stylesheet) as well as the web font "Open Sans" from Google Web Fonts:</p>
|
454 |
<blockquote><pre><code>
|
455 |
@import url(fonts/stylesheet.css);
|
includes/class-ctc.php
CHANGED
@@ -6,7 +6,7 @@ if ( !defined('ABSPATH')) exit;
|
|
6 |
Class: Child_Theme_Configurator
|
7 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
8 |
Description: Main Controller Class
|
9 |
-
Version: 1.3.
|
10 |
Author: Lilaea Media
|
11 |
Author URI: http://www.lilaeamedia.com/
|
12 |
Text Domain: chld_thm_cfg
|
@@ -31,18 +31,19 @@ class Child_Theme_Configurator {
|
|
31 |
var $hook;
|
32 |
var $is_ajax;
|
33 |
var $updated;
|
34 |
-
|
35 |
function __construct($file) {
|
36 |
$this->dir = dirname( $file );
|
37 |
-
$this->optionsName
|
38 |
-
$this->menuName
|
39 |
-
$lang_dir
|
40 |
load_plugin_textdomain('chld_thm_cfg', false, $lang_dir, $lang_dir);
|
41 |
|
42 |
-
$this->pluginName
|
43 |
-
$this->shortName
|
44 |
-
$this->pluginPath
|
45 |
-
$this->pluginURL
|
|
|
46 |
|
47 |
// setup plugin hooks
|
48 |
add_action('admin_menu', array(&$this, 'admin_menu'));
|
@@ -50,6 +51,7 @@ class Child_Theme_Configurator {
|
|
50 |
add_action('wp_ajax_ctc_update', array(&$this, 'ajax_save_postdata' ));
|
51 |
add_action('wp_ajax_ctc_query', array(&$this, 'ajax_query_css' ));
|
52 |
add_action('chld_thm_cfg_addl_files', array(&$this, 'add_functions_file'), 10, 2);
|
|
|
53 |
//add_action('update_option_' . $this->optionsName, array(&$this, 'update_redirect'), 10);
|
54 |
}
|
55 |
|
@@ -255,7 +257,8 @@ class Child_Theme_Configurator {
|
|
255 |
$this->css->reset_updates();
|
256 |
update_option($this->optionsName, $this->css);
|
257 |
do_action('chld_thm_cfg_addl_options', $this); // hook for add'l plugin options
|
258 |
-
$
|
|
|
259 |
endif;
|
260 |
//$this->errors[] = sprintf(__('Child Theme %s was unchanged.', 'chld_thm_cfg'), $name, $this->optionsName);
|
261 |
}
|
@@ -303,10 +306,21 @@ class Child_Theme_Configurator {
|
|
303 |
|
304 |
function add_functions_file($obj){
|
305 |
// add functions.php file
|
306 |
-
$file = $obj->css->get_child_target('functions.php');
|
307 |
-
if (!file_exists($file)):
|
308 |
if (false === file_put_contents($file,
|
309 |
"<?php\n// Exit if accessed directly\nif ( !defined('ABSPATH')) exit;\n\n/* Add custom functions below */")) return false;
|
310 |
endif;
|
311 |
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
312 |
}
|
6 |
Class: Child_Theme_Configurator
|
7 |
Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
8 |
Description: Main Controller Class
|
9 |
+
Version: 1.3.3
|
10 |
Author: Lilaea Media
|
11 |
Author URI: http://www.lilaeamedia.com/
|
12 |
Text Domain: chld_thm_cfg
|
31 |
var $hook;
|
32 |
var $is_ajax;
|
33 |
var $updated;
|
34 |
+
var $image_formats;
|
35 |
function __construct($file) {
|
36 |
$this->dir = dirname( $file );
|
37 |
+
$this->optionsName = 'chld_thm_cfg_options';
|
38 |
+
$this->menuName = 'chld_thm_cfg_menu';
|
39 |
+
$lang_dir = $this->dir . '/lang';
|
40 |
load_plugin_textdomain('chld_thm_cfg', false, $lang_dir, $lang_dir);
|
41 |
|
42 |
+
$this->pluginName = __('Child Theme Configurator', 'chld_thm_cfg');
|
43 |
+
$this->shortName = __('Child Themes', 'chld_thm_cfg');
|
44 |
+
$this->pluginPath = $this->dir . '/';
|
45 |
+
$this->pluginURL = plugin_dir_url($file);
|
46 |
+
$this->image_formats = array('jpg','jpeg','gif','png','JPG','JPEG','GIF','PNG');
|
47 |
|
48 |
// setup plugin hooks
|
49 |
add_action('admin_menu', array(&$this, 'admin_menu'));
|
51 |
add_action('wp_ajax_ctc_update', array(&$this, 'ajax_save_postdata' ));
|
52 |
add_action('wp_ajax_ctc_query', array(&$this, 'ajax_query_css' ));
|
53 |
add_action('chld_thm_cfg_addl_files', array(&$this, 'add_functions_file'), 10, 2);
|
54 |
+
add_action('chld_thm_cfg_addl_files', array(&$this, 'copy_screenshot'), 10, 2);
|
55 |
//add_action('update_option_' . $this->optionsName, array(&$this, 'update_redirect'), 10);
|
56 |
}
|
57 |
|
257 |
$this->css->reset_updates();
|
258 |
update_option($this->optionsName, $this->css);
|
259 |
do_action('chld_thm_cfg_addl_options', $this); // hook for add'l plugin options
|
260 |
+
$msg = isset($_POST['ctc_scan_subdirs']) ? '9&tab=import_options' : 1;
|
261 |
+
$this->update_redirect($msg);
|
262 |
endif;
|
263 |
//$this->errors[] = sprintf(__('Child Theme %s was unchanged.', 'chld_thm_cfg'), $name, $this->optionsName);
|
264 |
}
|
306 |
|
307 |
function add_functions_file($obj){
|
308 |
// add functions.php file
|
309 |
+
$file = $obj->css->is_file_ok($obj->css->get_child_target('functions.php'));
|
310 |
+
if ($file && !file_exists($file)):
|
311 |
if (false === file_put_contents($file,
|
312 |
"<?php\n// Exit if accessed directly\nif ( !defined('ABSPATH')) exit;\n\n/* Add custom functions below */")) return false;
|
313 |
endif;
|
314 |
}
|
315 |
+
|
316 |
+
function copy_screenshot($obj) {
|
317 |
+
foreach ($this->image_formats as $ext):
|
318 |
+
if ($screenshot_parent = $obj->css->is_file_ok($obj->css->get_parent_source('screenshot.' . $ext))) break;
|
319 |
+
endforeach;
|
320 |
+
$screenshot_child = $obj->css->get_child_target('screenshot.' . $ext);
|
321 |
+
if ($screenshot_parent && $screenshot_child && !file_exists($screenshot_child)):
|
322 |
+
if (false === file_put_contents($screenshot_child,
|
323 |
+
@file_get_contents($screenshot_parent))) return false;
|
324 |
+
endif;
|
325 |
+
}
|
326 |
}
|
js/chld-thm-cfg.js
CHANGED
@@ -2,7 +2,7 @@
|
|
2 |
* Script: chld-thm-cfg.js
|
3 |
* Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
4 |
* Description: Handles jQuery, AJAX and other UI
|
5 |
-
* Version: 1.3.
|
6 |
* Author: Lilaea Media
|
7 |
* Author URI: http://www.lilaeamedia.com/
|
8 |
* License: GPLv2
|
@@ -189,7 +189,7 @@ jQuery(document).ready(function($){
|
|
189 |
});
|
190 |
},
|
191 |
ctc_image_url = function(theme, value) {
|
192 |
-
var parts = value.toString().match(/url\([" ]*(.+?)[" ]*\)/),
|
193 |
path = ctc_is_empty(parts) ? null : parts[1],
|
194 |
url = ctcAjax.theme_uri + '/' + ('parent' == theme ? ctcAjax.parnt : ctcAjax.child) + '/',
|
195 |
image_url;
|
2 |
* Script: chld-thm-cfg.js
|
3 |
* Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
4 |
* Description: Handles jQuery, AJAX and other UI
|
5 |
+
* Version: 1.3.3
|
6 |
* Author: Lilaea Media
|
7 |
* Author URI: http://www.lilaeamedia.com/
|
8 |
* License: GPLv2
|
189 |
});
|
190 |
},
|
191 |
ctc_image_url = function(theme, value) {
|
192 |
+
var parts = value.toString().match(/url\(['" ]*(.+?)['" ]*\)/),
|
193 |
path = ctc_is_empty(parts) ? null : parts[1],
|
194 |
url = ctcAjax.theme_uri + '/' + ('parent' == theme ? ctcAjax.parnt : ctcAjax.child) + '/',
|
195 |
image_url;
|
js/chld-thm-cfg.min.js
CHANGED
@@ -2,7 +2,7 @@
|
|
2 |
* Script: chld-thm-cfg.js
|
3 |
* Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
4 |
* Description: Handles jQuery, AJAX and other UI
|
5 |
-
* Version: 1.3.
|
6 |
* Author: Lilaea Media
|
7 |
* Author URI: http://www.lilaeamedia.com/
|
8 |
* License: GPLv2
|
2 |
* Script: chld-thm-cfg.js
|
3 |
* Plugin URI: http://www.lilaeamedia.com/plugins/child-theme-configurator/
|
4 |
* Description: Handles jQuery, AJAX and other UI
|
5 |
+
* Version: 1.3.3
|
6 |
* Author: Lilaea Media
|
7 |
* Author URI: http://www.lilaeamedia.com/
|
8 |
* License: GPLv2
|
readme.txt
CHANGED
@@ -3,8 +3,8 @@ Contributors: lilaeamedia
|
|
3 |
Donate link: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=8QE5YJ8WE96AJ
|
4 |
Tags: child theme, custom theme, CSS, responsive design, CSS editor, theme generator
|
5 |
Requires at least: 3.7
|
6 |
-
Tested up to: 3.8.
|
7 |
-
Stable tag: 1.3.
|
8 |
License: GPLv2 or later
|
9 |
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
10 |
|
@@ -51,77 +51,81 @@ We offer a premium extension to let you easily modify styles for any WordPress P
|
|
51 |
|
52 |
= Is there a tutorial? =
|
53 |
|
54 |
-
|
55 |
|
56 |
-
= Why doesn't this work with my (insert theme vendor here) theme? =
|
57 |
|
58 |
-
Some themes (particularly commercial themes) do not adhere to the Theme Development guidelines set forth by WordPress.org, and do not automatically load child theme stylesheets or php files. This is unfortunate, because it effectively prohibits the webmaster from adding any customizations (other than those made through the admin theme options) that will survive past an upgrade.
|
59 |
|
60 |
-
|
61 |
|
62 |
-
|
63 |
-
|
64 |
-
= Why are my menus displaying incorrectly when I activate the new child theme? =
|
65 |
-
|
66 |
-
The child theme creates a new instance in the WordPress options data and the menus have to be assigned. Go to Appearance > Menus and assign locations to each of the menus for the new Child Theme.
|
67 |
|
68 |
-
|
69 |
|
70 |
-
|
71 |
|
72 |
-
|
73 |
|
74 |
-
|
75 |
|
|
|
76 |
Click the "Help" tab at the top right for a quick reference.
|
77 |
|
78 |
-
= Where are the styles? The configurator doesn't show anything! =
|
79 |
|
80 |
All of the styles are loaded dynamically. You must start typing in the text boxes to select styles to edit.
|
81 |
-
|
82 |
"Base" is the query group that contains styles that are not associated with any particular "At-rule."
|
83 |
|
84 |
Start by clicking the "Query/Selector" tab and typing "base" in the first box. You can then start typing in the second box to retrieve the style selectors to edit.
|
85 |
|
86 |
-
=
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
87 |
|
88 |
No. This is the point of using child themes. Changes to the parent theme are automatically inherited by the child theme.
|
89 |
|
90 |
A child theme is not a "copy" of the parent theme. It is a special feature of WordPress that let's you override specific styles and functions leaving the rest of the theme intact. The only time you need to make changes after an upgrade is if the parent removes or changes style or function names. Quality themes should identify any deprecated functions or styles in the upgrade notes so that child theme users can make adjustments accordingly.
|
91 |
|
92 |
-
= Where are the .php files? =
|
93 |
|
94 |
The configurator automatically adds a blank functions.php file to the child theme directory. You can add any additional files and directories you need for your Child Theme. The Child Theme Configurator helps you identify and override selectors in the Parent stylesheet without touching the other files.
|
95 |
|
96 |
-
= How do I change a specific color/font style/background? =
|
97 |
-
|
98 |
-
You can override a specific value globally using the Rule/Value tab. See "Rule/Value," below.
|
99 |
-
|
100 |
-
= How do I add styles that aren't in the Parent Theme? =
|
101 |
|
102 |
-
You can
|
103 |
|
104 |
-
= How do I
|
105 |
|
106 |
-
|
107 |
|
108 |
-
= How do I remove a style from the Parent Theme? =
|
109 |
|
110 |
You shouldn't really "remove" a style from the Parent. You can, however, set the rule to "inherit," "none," or zero (depending on the rule). This will negate the Parent value. Some experimentation may be necessary.
|
111 |
|
112 |
-
= How do I remove a style from the Child Theme? =
|
113 |
|
114 |
Delete the value from the input for the rule you wish to remove. The Child Theme Configurator only adds overrides for rules that contain values.
|
115 |
|
116 |
-
= How do I set the !important flag? =
|
117 |
|
118 |
-
We always recommend relying on good cascading design over global overrides.
|
119 |
|
120 |
-
= How do I create cross-browser gradients? =
|
121 |
|
122 |
The Child Theme Configurator uses a standardized syntax for gradients and only supports two-color gradients without intermediate stops. The inputs consist of origin (e.g., top, left, 135deg, etc.), start color and end color. The browser-specific syntax is generated automatically when you save these values. See Caveats, below, for more information.
|
123 |
|
124 |
-
= How do I make my Theme responsive? =
|
125 |
|
126 |
This topic is beyond the scope of this document. The short answer is to use a responsive Parent Theme. Some common characteristics of responsive design are:
|
127 |
|
@@ -129,9 +133,9 @@ This topic is beyond the scope of this document. The short answer is to use a re
|
|
129 |
* Combining floats and clears with inline and relative positions allow the elements to adjust gracefully to their container's width.
|
130 |
* Showing and hiding content with Javascript.
|
131 |
|
132 |
-
= How do I add Web Fonts? =
|
133 |
|
134 |
-
The easiest method is to paste the @import code provided by Google, Font Squirrel or any other Web Font site into the @import tab. The fonts will then be available to use as a value of the font-family rule. Be sure you understand the license for any embedded fonts.
|
135 |
|
136 |
You can also create a secondary stylesheet that contains @font-face rules and import it using the @import tab.
|
137 |
|
@@ -145,6 +149,10 @@ You can also create a secondary stylesheet that contains @font-face rules and im
|
|
145 |
|
146 |
== Changelog ==
|
147 |
|
|
|
|
|
|
|
|
|
148 |
= 1.3.2 =
|
149 |
* Fixed unquoted regex pattern in file path security check function. Thanks to buzcuz for reporting this.
|
150 |
|
@@ -221,8 +229,8 @@ You can also create a secondary stylesheet that contains @font-face rules and im
|
|
221 |
* Initial release.
|
222 |
|
223 |
== Upgrade Notice ==
|
224 |
-
= 1.3.
|
225 |
-
* This
|
226 |
|
227 |
== Create Your Child Theme ==
|
228 |
|
@@ -235,7 +243,14 @@ The first step is to create a child theme and import your parent theme styles in
|
|
235 |
3. Enter a Name for the child theme.
|
236 |
4. Enter an author for the child theme.
|
237 |
5. Enter the child theme version number.
|
238 |
-
6.
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
239 |
|
240 |
== Override Parent Styles ==
|
241 |
|
@@ -272,7 +287,9 @@ If you prefer to use shorthand syntax for rules and values instead of the inputs
|
|
272 |
|
273 |
== Add Imports ==
|
274 |
|
275 |
-
You can add additional stylesheets and web fonts by typing @import rules into the textarea on the @import tab. Important: The Child Theme Configurator adds the @import rule that loads the Parent Theme's stylesheet automatically.
|
|
|
|
|
276 |
|
277 |
== Preview and Activate ==
|
278 |
|
3 |
Donate link: https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=8QE5YJ8WE96AJ
|
4 |
Tags: child theme, custom theme, CSS, responsive design, CSS editor, theme generator
|
5 |
Requires at least: 3.7
|
6 |
+
Tested up to: 3.8.2
|
7 |
+
Stable tag: 1.3.3
|
8 |
License: GPLv2 or later
|
9 |
License URI: http://www.gnu.org/licenses/gpl-2.0.html
|
10 |
|
51 |
|
52 |
= Is there a tutorial? =
|
53 |
|
54 |
+
https://www.youtube.com/watch?v=xL2HkWQxgOA
|
55 |
|
56 |
+
= Why doesn't this work with my (insert theme vendor here) theme? =
|
57 |
|
58 |
+
Some themes (particularly commercial themes) do not adhere to the Theme Development guidelines set forth by WordPress.org, and do not automatically load child theme stylesheets or php files. This is unfortunate, because it effectively prohibits the webmaster from adding any customizations (other than those made through the admin theme options) that will survive past an upgrade.
|
59 |
|
60 |
+
Contact the vendor directly to ask for this core functionality. It is our opinion that ALL themes (especially commercial ones) must pass the Theme Unit Tests outlined by WordPress.org.
|
61 |
|
62 |
+
= Why doesn't the Parent Theme have any styles when I "View Parent CSS"? =
|
|
|
|
|
|
|
|
|
63 |
|
64 |
+
Your Parent theme is probably using a non-standard location for the stylesheets. Check "Scan Parent Theme for additional stylesheets" on the Parent/Child tab and load the Child Theme again.
|
65 |
|
66 |
+
= Why is everything backwards? =
|
67 |
|
68 |
+
More than likely you selected "Scan Parent Theme for additional stylesheets" and your theme uses a "right-to-left" (rtl) stylesheet. Go to the @imports tab and remove the rtl stylesheet from the list of imported stylesheets.
|
69 |
|
70 |
+
= Where is it in the Admin? =
|
71 |
|
72 |
+
The Child Theme Configurator can be found under the "Tools" menu in the WordPress Admin. Click "Child Themes" to get started.
|
73 |
Click the "Help" tab at the top right for a quick reference.
|
74 |
|
75 |
+
= Where are the styles? The configurator doesn't show anything! =
|
76 |
|
77 |
All of the styles are loaded dynamically. You must start typing in the text boxes to select styles to edit.
|
|
|
78 |
"Base" is the query group that contains styles that are not associated with any particular "At-rule."
|
79 |
|
80 |
Start by clicking the "Query/Selector" tab and typing "base" in the first box. You can then start typing in the second box to retrieve the style selectors to edit.
|
81 |
|
82 |
+
= Why do the preview tabs return "Stylesheet could not be displayed"? =
|
83 |
+
|
84 |
+
You have to load a child theme from the Parent/Child tab for the preview to display. This can also happen when your WP_CONTENT_URL is different than $bloginfo('site_url'). Ajax cannot make cross-domain requests by default. Check that your Settings > General > "WordPress Address (URL)" value is correct. (Often caused by missing "www" in the domain.)
|
85 |
+
|
86 |
+
= Can I edit the Child Theme stylesheet manually offline or by using the Editor or do I have to use the Configurator? =
|
87 |
+
|
88 |
+
You can make any manual changes you wish to the stylesheet. Just make sure you import the revised stylesheet using the Parent/Child panel or the Configurator will overwrite your changes the next time you use it. Just follow the steps as usual but select the "Use Existing Child Theme" radio button as the "Child Theme" option. The Configurator will automatically update its internal data from the new stylesheet.
|
89 |
+
|
90 |
+
= Why are my menus displaying incorrectly when I activate the new child theme? =
|
91 |
+
|
92 |
+
The child theme creates a new instance in the WordPress options data and the menus have to be assigned. Go to Appearance > Menus and assign locations to each of the menus for the new Child Theme.
|
93 |
+
|
94 |
+
= If the parent theme changes (e.g., upgrade), do I have to update the child theme? =
|
95 |
|
96 |
No. This is the point of using child themes. Changes to the parent theme are automatically inherited by the child theme.
|
97 |
|
98 |
A child theme is not a "copy" of the parent theme. It is a special feature of WordPress that let's you override specific styles and functions leaving the rest of the theme intact. The only time you need to make changes after an upgrade is if the parent removes or changes style or function names. Quality themes should identify any deprecated functions or styles in the upgrade notes so that child theme users can make adjustments accordingly.
|
99 |
|
100 |
+
= Where are the .php files? =
|
101 |
|
102 |
The configurator automatically adds a blank functions.php file to the child theme directory. You can add any additional files and directories you need for your Child Theme. The Child Theme Configurator helps you identify and override selectors in the Parent stylesheet without touching the other files.
|
103 |
|
104 |
+
= How do I change a specific color/font style/background? =
|
|
|
|
|
|
|
|
|
105 |
|
106 |
+
You can override a specific value globally using the Rule/Value tab. See Rule/Value, above.
|
107 |
|
108 |
+
= How do I add styles that aren't in the Parent Theme? =
|
109 |
|
110 |
+
You can add queries and selectors using the "Raw CSS" textarea on the Query/Selector tab. See Query/Selector, above.
|
111 |
|
112 |
+
= How do I remove a style from the Parent Theme? =
|
113 |
|
114 |
You shouldn't really "remove" a style from the Parent. You can, however, set the rule to "inherit," "none," or zero (depending on the rule). This will negate the Parent value. Some experimentation may be necessary.
|
115 |
|
116 |
+
= How do I remove a style from the Child Theme? =
|
117 |
|
118 |
Delete the value from the input for the rule you wish to remove. The Child Theme Configurator only adds overrides for rules that contain values.
|
119 |
|
120 |
+
= How do I set the !important flag? =
|
121 |
|
122 |
+
We always recommend relying on good cascading design over global overrides. To that end, you have ability to change the load order of child theme styles by entering a value in the "Order" field. And yes, you can now set rules as important by checking the "!" box next to each input. Please use judiciously.
|
123 |
|
124 |
+
= How do I create cross-browser gradients? =
|
125 |
|
126 |
The Child Theme Configurator uses a standardized syntax for gradients and only supports two-color gradients without intermediate stops. The inputs consist of origin (e.g., top, left, 135deg, etc.), start color and end color. The browser-specific syntax is generated automatically when you save these values. See Caveats, below, for more information.
|
127 |
|
128 |
+
= How do I make my Theme responsive? =
|
129 |
|
130 |
This topic is beyond the scope of this document. The short answer is to use a responsive Parent Theme. Some common characteristics of responsive design are:
|
131 |
|
133 |
* Combining floats and clears with inline and relative positions allow the elements to adjust gracefully to their container's width.
|
134 |
* Showing and hiding content with Javascript.
|
135 |
|
136 |
+
= How do I add Web Fonts? =
|
137 |
|
138 |
+
The easiest method is to paste the @import code provided by Google, Font Squirrel or any other Web Font site into the @import tab. The fonts will then be available to use as a value of the font-family rule. Be sure you understand the license for any embedded fonts.
|
139 |
|
140 |
You can also create a secondary stylesheet that contains @font-face rules and import it using the @import tab.
|
141 |
|
149 |
|
150 |
== Changelog ==
|
151 |
|
152 |
+
= 1.3.3 =
|
153 |
+
* New Feature: option to scan parent theme for additional stylesheets. This allows CTC to be used with themes such as "Responsive" by CyberChimps.
|
154 |
+
* New Feature: automatically copies parent theme screenshot to child.
|
155 |
+
|
156 |
= 1.3.2 =
|
157 |
* Fixed unquoted regex pattern in file path security check function. Thanks to buzcuz for reporting this.
|
158 |
|
229 |
* Initial release.
|
230 |
|
231 |
== Upgrade Notice ==
|
232 |
+
= 1.3.3 =
|
233 |
+
* This version adds the ability to parse additional stylesheets from the Parent theme as well as the main style.css file.
|
234 |
|
235 |
== Create Your Child Theme ==
|
236 |
|
243 |
3. Enter a Name for the child theme.
|
244 |
4. Enter an author for the child theme.
|
245 |
5. Enter the child theme version number.
|
246 |
+
6. Check "Backup Stylesheet" if you want to backup original version of child stylesheet.
|
247 |
+
7. Check "Scan Parent Theme for Additional Stylesheets" if your theme uses multiple stylesheets or if the the stylesheets are in a non-standard location. For example, the "Responsive" theme puts the stylesheets in a subdirectory named "core."
|
248 |
+
8. Click "Generate Child Theme Files."
|
249 |
+
|
250 |
+
If you are loading an existing child theme and checked "Backup Stylesheet," the Child Theme Configurator will create a backup of your existing stylesheet in the theme directory.
|
251 |
+
|
252 |
+
If you checked "Scan Parent Theme for additional stylesheets," the "@import" tab will appear automatically. Important: Any additional stylesheets are added as imports here. If your theme has a "right-to-left" stylesheet, it will appear here as well. Remove any @import statements that are not needed by the front end, such as admin or configuration stylesheets.
|
253 |
+
|
254 |
|
255 |
== Override Parent Styles ==
|
256 |
|
287 |
|
288 |
== Add Imports ==
|
289 |
|
290 |
+
You can add additional stylesheets and web fonts by typing @import rules into the textarea on the @import tab. Important: The Child Theme Configurator adds the @import rule that loads the Parent Theme's stylesheet automatically. Do not need to add it here.
|
291 |
+
|
292 |
+
If you checked "Scan Parent Theme for additional stylesheets" when you created your child theme, the "@import" tab will appear automatically. Important: By default, any additional stylesheets are added as imports. If your theme has a "right-to-left" stylesheet, it will appear here as well. In many cases, the theme will automatically load the additional stylesheets, so you do not need to import them (for example, the "Responsive" theme). Remove any @import statements that are not needed by the front end, such as admin or configuration stylesheets, or, as in the case described above, any stylesheets that are automatically loaded by the Theme.
|
293 |
|
294 |
== Preview and Activate ==
|
295 |
|
screenshot-1.jpg
CHANGED
Binary file
|