Last active
December 21, 2015 15:19
-
-
Save konradsroka/6325980 to your computer and use it in GitHub Desktop.
A small class to help building the FrontEnd CSS from the WP Customizer Options. Better Readability. Lean CSS. No more PHP Noodles in your styles!
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* This small PHP class provides you some functions to build the frontend CSS from the WP Customizer Options. | |
* | |
* == Fight the PHP Noodles in your CSS! == | |
* As the resulting dynamic CSS of themes can look ugly, | |
* we thought about a sweet and short solution for this. | |
* | |
* == Better Readabilty == | |
* No need of writing CSS with all that PHP checks and echos inside.. brr.. | |
* Actually you simply write down which CSS selectors should be defined with what option. | |
* The rest just happens automagically. | |
* | |
* == Lean CSS == | |
* You will only get a CSS style back if a value has been saved in the WP Customizer | |
* You can still add static CSS that should be added anyway, no matter if the option has been set | |
* You can generate one style from multiple options (for example font size, weight and color just for the h1) | |
* | |
* @author Sven Lehnert, Konrad Sroka | |
* @license GPL http://www.gnu.org/licenses/gpl.html | |
* @package WP Customizer Frontend CSS | |
* @since 1.0 | |
* | |
*/ | |
class Customizer_Frontend_CSS { | |
var $css_tmp = ''; | |
/** | |
* PHP 4 constructor | |
* | |
* @package WP Customizer Frontend CSS | |
* @since 1.0 | |
*/ | |
function CC_Customizer() { | |
$this->__construct(); | |
} | |
/** | |
* PHP 5 constructor | |
* | |
* @package WP Customizer Frontend CSS | |
* @since 1.0 | |
*/ | |
function __construct() { | |
} | |
/** | |
* Add a style to the Customizer_Frontend_CSS object! | |
* | |
* @package WP Customizer Frontend CSS | |
* @since 1.0 | |
*/ | |
function add_style( $selector, $args = Array() ) { | |
$this->css_tmp .= $selector.' { '; | |
foreach ($args as $key => $css) { | |
$option_value = ''; | |
if( isset( $css['option'] ) ) | |
$option_value = get_theme_mod( $css['option'] ); | |
if( isset( $css['value'] ) && !empty($option_value) ) : | |
$this->css_tmp .= $css['style'].': '; | |
$this->css_tmp .= str_replace("$", $option_value, $css['value']); | |
$this->css_tmp .= '; '; | |
elseif(!empty($option_value)) : | |
$this->css_tmp .= $css['style'].': '; | |
$this->css_tmp .= $option_value; | |
$this->css_tmp .= '; '; | |
endif; | |
if(isset($css['static'])) | |
$this->css_tmp .= $css['static']; | |
} | |
$this->css_tmp .= ' } '; | |
} | |
/** | |
* Output the Customizer CSS! | |
* | |
* @package cc2 | |
* @since 2.0 | |
*/ | |
function output_css(){ | |
echo $this->css_tmp; | |
} | |
} | |
?> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Some Examples how to use this class can be found here:
https://gist.github.com/konradsroka/6326016