Как избежать динамического значения свойства CSS

Question

Как избежать динамического значения свойства CSS

У меня есть следующий динамический CSS редукса, включенный в wp_add_inline_style ().

// redux dynamic css

global $x_redux_option;
$x_blogpost_overlay_switch = $ x_redux_option [' x_blogpost_overlay_switch];

$x_redux_dynamic_css = '
.single_post:hover{
background: ". if ($x_blogpost_overlay_switch == true): echo $x_blogpost_overlay; endif; ." ;
-webkit-box-shadow: " . if($x_blogpost_overlay_switch == true): ." 0 1px 10px 0 rgba(251,252,252,0.8) " . endif; ." ;
-moz-box-shadow: " . if($x_blogpost_overlay_switch == true): . " 0 1px 10px 0 rgba(251,252,252,0.8) " . endif; . " ;
box-shadow: " . if($x_blogpost_overlay_switch == true): . " 0 1px 10px 0 rgba(251,252,252,0.8) " . endif; . " ;
}
';
wp_add_inline_style( 'x-main-style', $x_redux_dynamic_css );

Плагин Mentor Themeforest показывает следующую ошибку:

Все динамические данные должны быть правильно экранированы для контекста, в котором они отображаются. в файле inc / scripts-styles.php, строка 213: background: «. if ($ x_blogpost_overlay_switch == true): echo $ x_blogpost_overlay; endif;.» ;

Как я могу избежать этого динамического ($ x_blogpost_overlay) значения свойства css?

Заранее спасибо.

0

css escaping php redux

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

Попробуйте так.

global $x_redux_option;
$x_blogpost_overlay_switch = $x_redux_option['x_blogpost_overlay_switch'];

// You must specify this variable as a valid CSS style.
$x_blogpost_overlay = 'white';

$x_redux_dynamic_css = '
.single_post:hover{
';
if ($x_blogpost_overlay_switch == true){
$x_redux_dynamic_css = $x_redux_dynamic_css . 'background: '. $x_blogpost_overlay . ';' .
'-webkit-box-shadow: 0 1px 10px 0 rgba(251,252,252,0.8);
-moz-box-shadow: 0 1px 10px 0 rgba(251,252,252,0.8);
box-shadow: 0 1px 10px 0 rgba(251,252,252,0.8);';
}
$x_redux_dynamic_css .= '}';
wp_add_inline_style( 'x-main-style', $x_redux_dynamic_css );

1