function custom_post_css() { $post_id = get_the_ID(); $css = array(); $style = ''; $rules = array('.section-post.post-' . $post_id => array(array('prop' => 'font-size', 'key' => array('font_size', 'font_size_unit')), array('prop' => 'font-family', 'key' => 'font_family'), array('prop' => 'color', 'key' => 'font_color'), array('prop' => 'background-color', 'key' => 'background_color')), '.section-post.post-' . $post_id . ' a' => array(array('prop' => 'color', 'key' => 'link_color'))); foreach ($rules as $selector => $property) { foreach ($property as $val) { $prop = $val['prop']; $key = $val['key']; if (is_array($key)) { if ('font-size' == $prop && themify_check($key[0])) { $css[$selector][$prop] = $prop . ': ' . themify_get($key[0]) . themify_get($key[1]); } if ('background-position' == $prop && themify_check($key[0])) { $css[$selector][$prop] = $prop . ': ' . themify_get($key[0]) . ' ' . themify_get($key[1]); } } elseif (themify_check($key) && 'default' != themify_get($key)) { if ('color' == $prop || stripos($prop, 'color')) { $css[$selector][$prop] = $prop . ': #' . themify_get($key); } elseif ('background-image' == $prop) { $css[$selector][$prop] = $prop . ': url(' . themify_get($key) . ')'; } elseif ($prop == 'font-family') { $font = themify_get($key); $css[$selector][$prop] = $prop . ': ' . $font; if (!in_array($font, themify_get_web_safe_font_list(true))) { $this->google_fonts .= str_replace(' ', '+', $font . '|'); } } else { $css[$selector][$prop] = $prop . ': ' . themify_get($key); } } } if (!empty($css[$selector])) { $style .= "{$selector} {\n\t" . implode(";\n\t", $css[$selector]) . "\n}\n"; } } if ('' != $style) { echo "\n<!-- #{$post_id} Style -->\n<style>\n{$style}</style>\n<!-- #{$post_id} Style -->\n"; } }
/** * Print the field based on field type * @param array $field */ public static function print_field($field) { $field = wp_parse_args($field, array('id' => '', 'name' => '', 'class' => '')); switch ($field['type']) { case 'text': ?> <input id="<?php echo esc_attr($field['id']); ?> " name="<?php echo esc_attr($field['id']); ?> " type="text" value="" class="<?php echo esc_attr($field['class']); ?> tfb_lb_option"> <?php if (isset($field['description'])) { echo wp_kses_post($field['description']); } break; case 'separator': if (isset($field['meta']['html']) && '' != $field['meta']['html']) { echo wp_kses_post($field['meta']['html']); } else { ?> <hr class="meta_fields_separator" /> <?php } break; case 'image': ?> <input id="<?php echo esc_attr($field['id']); ?> " name="<?php echo esc_attr($field['id']); ?> " placeholder="<?php if (isset($field['value'])) { echo esc_attr($field['value']); } ?> " class="<?php echo esc_attr($field['class']); ?> themify-builder-uploader-input tfb_lb_option" type="text" /><br /> <input type="hidden" name="<?php echo esc_attr($field['id'] . '_attach_id'); ?> " class="themify-builder-uploader-input-attach-id" value=""> <div class="small"> <?php if (is_multisite() && !is_upload_space_available()) { ?> <?php echo sprintf(__('Sorry, you have filled your %s MB storage quota so uploading has been disabled.', 'themify'), get_space_allowed()); ?> <?php } else { ?> <div class="themify-builder-plupload-upload-uic hide-if-no-js tf-upload-btn" id="<?php echo esc_attr($field['id']); ?> themify-builder-plupload-upload-ui"> <input id="<?php echo esc_attr($field['id']); ?> themify-builder-plupload-browse-button" type="button" value="<?php esc_attr_e(__('Upload', 'themify')); ?> " class="builder_button" /> <span class="ajaxnonceplu" id="ajaxnonceplu<?php echo wp_create_nonce($field['id'] . 'themify-builder-plupload'); ?> "></span> </div> <?php _e('or', 'themify'); ?> <a href="#" class="themify-builder-media-uploader tf-upload-btn" data-uploader-title="<?php esc_attr_e('Upload an Image', 'themify'); ?> " data-uploader-button-text="<?php esc_attr_e('Insert file URL', 'themify'); ?> "><?php _e('Browse Library', 'themify'); ?> </a> <?php } ?> </div> <p class="thumb_preview"> <span class="img-placeholder"></span> <a href="#" class="themify_builder_icon small delete themify-builder-delete-thumb"></a> </p> <?php break; case 'select': ?> <select id="<?php echo esc_attr($field['id']); ?> " name="<?php echo esc_attr($field['id']); ?> " class="tfb_lb_option <?php echo esc_attr($field['class']); ?> "> <?php if (isset($field['default'])) { ?> <option value="<?php echo esc_attr($field['default']); ?> "><?php echo esc_html($field['default']); ?> </option> <?php } foreach ($field['meta'] as $option) { ?> <option value="<?php echo esc_attr($option['value']); ?> "><?php echo esc_html($option['name']); ?> </option> <?php } ?> </select> <?php if (isset($field['description'])) { echo wp_kses_post($field['description']); } ?> <?php break; case 'font_select': $fonts = array_merge(themify_get_web_safe_font_list(), themify_get_google_web_fonts_list()); ?> <select id="<?php echo esc_attr($field['id']); ?> " name="<?php echo esc_attr($field['id']); ?> " class="tfb_lb_option <?php echo esc_attr($field['class']); ?> "> <?php if (isset($field['default'])) { ?> <option value="<?php echo esc_attr($field['default']); ?> "><?php echo esc_html($field['default']); ?> </option> <?php } foreach ($fonts as $option) { ?> <option value="<?php echo esc_attr($option['value']); ?> "><?php echo esc_html($option['name']); ?> </option> <?php } ?> </select> <?php if (isset($field['description'])) { echo wp_kses_post($field['description']); } ?> <?php break; case 'color': ?> <span class="builderColorSelect"><span></span></span> <input type="text" class="<?php echo esc_attr($field['class']); ?> colordisplay"/> <input id="<?php echo esc_attr($field['id']); ?> " name="<?php echo esc_attr($field['id']); ?> " value="" class="builderColorSelectInput tfb_lb_option" type="text" /> <?php break; case 'radio': foreach ($field['meta'] as $option) { ?> <input type="radio" id="<?php echo esc_attr($field['id'] . '_' . $option['value']); ?> " name="<?php echo esc_attr($field['id']); ?> " value="<?php echo esc_attr($option['value']); ?> " class="tfb_lb_option" <?php checked(isset($option['selected']) ? $option['selected'] : false, true); ?> > <label for="<?php echo esc_attr($field['id'] . '_' . $option['value']); ?> "><?php echo esc_html($option['name']); ?> </label> <?php } break; case 'textarea': if (!array_key_exists('rows', $field) || empty($field['rows'])) { $field['rows'] = '3'; } ?> <textarea id="<?php echo esc_attr($field['id']); ?> " name="<?php echo esc_attr($field['id']); ?> " class="<?php echo esc_attr($field['class']); ?> tfb_lb_option" rows="<?php echo esc_attr($field['rows']); ?> "></textarea> <?php if (isset($field['description'])) { ?> <small> <br> <small> <?php echo wp_kses_post($field['description']); ?> </small> </small> <?php } break; } }
/** * Get custom style * * @since 2.2.5 New parameter $format to return output enclosed in style tags or not. * * @param string $style_id * @param string $mod_name * @param array $settings * @param boolean $array * @param string $format Use 'tag' to return the CSS enclosed in <style> tags. This mode is used while user is logged in and Builder is active. Use 'css' to return only the CSS. This mode is used on stylesheet generation. * * @return string|array */ function get_custom_styling_legacy($style_id, $mod_name, $settings, $array = false, $format = 'tag') { global $themify; if (!isset($themify->builder_google_fonts)) { $themify->builder_google_fonts = ''; } $rules_arr = array('font_size' => array('prop' => 'font-size', 'key' => array('font_size', 'font_size_unit')), 'font_family' => array('prop' => 'font-family', 'key' => 'font_family'), 'line_height' => array('prop' => 'line-height', 'key' => array('line_height', 'line_height_unit')), 'text_align' => array('prop' => 'text-align', 'key' => 'text_align'), 'color' => array('prop' => 'color', 'key' => 'font_color'), 'link_color' => array('prop' => 'color', 'key' => 'link_color'), 'text_decoration' => array('prop' => 'text-decoration', 'key' => 'text_decoration'), 'background_color' => array('prop' => 'background-color', 'key' => 'background_color'), 'background_image' => array('prop' => 'background-image', 'key' => 'background_image'), 'background_repeat' => array('prop' => 'background-repeat', 'key' => 'background_repeat'), 'background_position' => array('prop' => 'background-position', 'key' => array('background_position_x', 'background_position_y')), 'padding' => array('prop' => 'padding', 'key' => array('padding_top', 'padding_right', 'padding_bottom', 'padding_left')), 'margin' => array('prop' => 'margin', 'key' => array('margin_top', 'margin_right', 'margin_bottom', 'margin_left')), 'border_top' => array('prop' => 'border-top', 'key' => array('border_top_color', 'border_top_width', 'border_top_style')), 'border_right' => array('prop' => 'border-right', 'key' => array('border_right_color', 'border_right_width', 'border_right_style')), 'border_bottom' => array('prop' => 'border-bottom', 'key' => array('border_bottom_color', 'border_bottom_width', 'border_bottom_style')), 'border_left' => array('prop' => 'border-left', 'key' => array('border_left_color', 'border_left_width', 'border_left_style'))); if ($mod_name != 'row') { $styles_selector = Themify_Builder_Model::$modules[$mod_name]->get_css_selectors(); } else { $styles_selector = array('.module_row' => array('background_image', 'background_color', 'font_family', 'font_size', 'line_height', 'text_align', 'color', 'padding', 'margin', 'border_top', 'border_right', 'border_bottom', 'border_left'), '.module_row a' => array('link_color', 'text_decoration'), '.module_row h1' => array('color'), '.module_row h2' => array('color'), '.module_row h3:not(.module-title)' => array('color'), '.module_row h4' => array('color'), '.module_row h5' => array('color'), '.module_row h6' => array('color')); } $rules = array(); $css = array(); $style = ''; foreach ($styles_selector as $selector => $properties) { $property_arr = array(); foreach ($properties as $property) { array_push($property_arr, $rules_arr[$property]); } $rules[$style_id . $selector] = $property_arr; } foreach ($rules as $selector => $property) { foreach ($property as $val) { $prop = $val['prop']; $key = $val['key']; if (is_array($key)) { if ($prop == 'font-size' && isset($settings[$key[0]]) && '' != $settings[$key[0]]) { $css[$selector][$prop] = $prop . ': ' . $settings[$key[0]] . $settings[$key[1]]; } else { if ($prop == 'line-height' && isset($settings[$key[0]]) && '' != $settings[$key[0]]) { $css[$selector][$prop] = $prop . ': ' . $settings[$key[0]] . $settings[$key[1]]; } else { if ($prop == 'background-position' && isset($settings[$key[0]]) && '' != $settings[$key[0]]) { $css[$selector][$prop] = $prop . ': ' . $settings[$key[0]] . ' ' . $settings[$key[1]]; } else { if ($prop == 'padding') { $padding['top'] = isset($settings[$key[0]]) && '' != $settings[$key[0]] ? $settings[$key[0]] : ''; $padding['right'] = isset($settings[$key[1]]) && '' != $settings[$key[1]] ? $settings[$key[1]] : ''; $padding['bottom'] = isset($settings[$key[2]]) && '' != $settings[$key[2]] ? $settings[$key[2]] : ''; $padding['left'] = isset($settings[$key[3]]) && '' != $settings[$key[3]] ? $settings[$key[3]] : ''; foreach ($padding as $k => $v) { if ('' == $v) { continue; } $unit = isset($settings["padding_{$k}_unit"]) ? $settings["padding_{$k}_unit"] : 'px'; $css[$selector]['padding-' . $k] = 'padding-' . $k . ' : ' . $v . $unit; } } else { if ($prop == 'margin') { $margin['top'] = isset($settings[$key[0]]) && '' != $settings[$key[0]] ? $settings[$key[0]] : ''; $margin['right'] = isset($settings[$key[1]]) && '' != $settings[$key[1]] ? $settings[$key[1]] : ''; $margin['bottom'] = isset($settings[$key[2]]) && '' != $settings[$key[2]] ? $settings[$key[2]] : ''; $margin['left'] = isset($settings[$key[3]]) && '' != $settings[$key[3]] ? $settings[$key[3]] : ''; foreach ($margin as $k => $v) { if ('' == $v) { continue; } $unit = isset($settings["margin_{$k}_unit"]) ? $settings["margin_{$k}_unit"] : 'px'; $css[$selector]['margin-' . $k] = 'margin-' . $k . ' : ' . $v . $unit; } } else { if (in_array($prop, array('border-top', 'border-right', 'border-bottom', 'border-left'))) { $border['color'] = isset($settings[$key[0]]) && '' != $settings[$key[0]] ? '#' . $settings[$key[0]] : ''; $border['width'] = isset($settings[$key[1]]) && '' != $settings[$key[1]] ? $settings[$key[1]] . 'px' : ''; $border['style'] = isset($settings[$key[2]]) && '' != $settings[$key[2]] ? $settings[$key[2]] : ''; $css[$selector][$prop] = $this->build_color_props(array('color_opacity' => $border['color'], 'property' => $prop, 'border_width' => $border['width'], 'border_style' => $border['style'])); if (empty($border['color']) && empty($border['width']) && empty($border['style'])) { unset($css[$selector][$prop]); } } } } } } } } elseif (isset($settings[$key]) && 'default' != $settings[$key] && '' != $settings[$key]) { if ($prop == 'color' || stripos($prop, 'color')) { $css[$selector][$prop] = $this->build_color_props(array('color_opacity' => $settings[$key], 'property' => $prop)); } elseif ($prop == 'background-image' && 'default' != $settings[$key]) { $css[$selector][$prop] = $prop . ': url(' . $settings[$key] . ')'; if (isset($settings['background_type']) && 'video' == $settings['background_type']) { $css[$selector][$prop] .= ";\n\tbackground-size: cover"; } } elseif ($prop == 'font-family') { $font = $settings[$key]; $css[$selector][$prop] = $prop . ': ' . $font; if (!in_array($font, themify_get_web_safe_font_list(true))) { $themify->builder_google_fonts .= str_replace(' ', '+', $font . '|'); } } else { $css[$selector][$prop] = $prop . ': ' . $settings[$key]; } } } if (!empty($css[$selector])) { $style .= "{$selector} {\n\t" . implode(";\n\t", $css[$selector]) . "\n}\n"; } } if (!$array) { if ('' != $style) { if ('tag' == $format) { return "\n<!-- {$style_id} Style -->\n<style>\n{$style}</style>\n<!-- End {$style_id} Style -->\n"; } else { return "/* {$style_id} Style */\n{$style}\n"; } } } else { if ($array) { return $css; } } }
/** * Displays the controls to setup the font. * * @param object $values */ function render_fonts($values, $args = array()) { $defaults = array('show_size' => true, 'show_family' => true, 'show_lineheight' => true, 'show_decoration' => true, 'show_transform' => true, 'show_align' => true); $args = wp_parse_args($args, $defaults); // Font family $font_family = ''; if (isset($values->family)) { $font_family = !empty($values->family->name) ? $values->family->name : ''; } // Font styles and decoration $font_weight = !empty($values->bold) ? $values->bold : ''; $font_italic = !empty($values->italic) ? $values->italic : ''; $font_underline = !empty($values->underline) ? $values->underline : ''; $font_linethrough = !empty($values->linethrough) ? $values->linethrough : ''; $font_normal = !empty($values->normal) ? $values->normal : ''; $font_nostyle = !empty($values->nostyle) ? $values->nostyle : ''; // Text transform $text_transform = !empty($values->texttransform) ? $values->texttransform : ''; // Text align $font_align = !empty($values->align) ? $values->align : ''; $font_noalign = !empty($values->noalign) ? $values->noalign : ''; // Font size $font_size_num = isset($values->sizenum) ? $values->sizenum : ''; $font_size_unit = isset($values->sizeunit) ? $values->sizeunit : 'px'; // Line height $font_line_num = isset($values->linenum) ? $values->linenum : ''; $font_line_unit = isset($values->lineunit) ? $values->lineunit : 'px'; $units = array('px', '%', 'em'); $value = $name = ''; ?> <!-- FONT SIZE --> <div class="themify-customizer-brick"> <?php if ($args['show_size']) { ?> <input type="text" class="font_size_num" value="<?php echo esc_attr(empty($font_size_num) ? '' : $font_size_num); ?> " /> <div class="custom-select"> <select class="font_size_unit"> <?php foreach ($units as $unit) { ?> <option value="<?php echo esc_attr($unit); ?> " <?php selected($unit, $font_size_unit); ?> ><?php echo esc_html($unit); ?> </option> <?php } ?> </select> </div> <?php } // show_size ?> <?php if ($args['show_family']) { ?> <!-- FONT FAMILY --> <div class="custom-select themify_combobox font-family-select"> <?php if (empty(self::$webfonts)) { ?> <?php global $themify_gfonts; $f = themify_get_web_safe_font_list(); unset($f[0], $f[1]); foreach ($f as $v) { self::$webfonts[$v['value']] = array('name' => $v['name'], 'value' => $v['value']); } if (!empty($themify_gfonts)) { foreach ($themify_gfonts as $v) { self::$googlefonts[$v['family']] = array('name' => $v['family'], 'subsets' => isset($v['subsets']) ? $v['subsets'] : ''); } } ?> <input id="themify_fonts_hidden" type="hidden" value="<?php esc_attr_e(wp_json_encode(array('google' => array_values(self::$googlefonts), 'fonts' => array_values(self::$webfonts)))); ?> " /> <?php } ?> <?php if ($font_family) { ?> <?php $value = isset(self::$webfonts[$font_family]) ? self::$webfonts[$font_family] : (isset(self::$googlefonts[$font_family]) ? self::$googlefonts[$font_family] : false); ?> <?php } ?> <select class="themify_font_family" id="<?php echo esc_attr($this->id . '_font_family'); ?> " data-selected="<?php echo $font_family ? esc_attr($font_family) : ''; ?> "> <optgroup label="<?php _e('Web Safe Fonts', 'themify'); ?> "> <?php if ($value && isset(self::$webfonts[$font_family])) { ?> <?php $value['fonttype'] = 'websafe'; ?> <option value="<?php esc_attr_e(wp_json_encode($value)); ?> "><?php echo $value['name']; ?> </option> <?php } ?> </optgroup> <optgroup label="<?php _e('Google Fonts', 'themify'); ?> "> <?php if ($value && isset(self::$googlefonts[$font_family])) { ?> <?php $value['fonttype'] = 'google'; ?> <option value="<?php esc_attr_e(wp_json_encode($value)); ?> "><?php echo $value['name']; ?> </option> <?php } ?> </optgroup> </select> </div> <?php if (isset($args['font_family_label']) && !empty($args['font_family_label'])) { ?> <label for="<?php echo esc_attr($this->id . '_font_family'); ?> " class="font-family-label"><?php echo esc_html($args['font_family_label']); ?> </label> <?php } ?> <?php } // show_family ?> </div> <?php if ($args['show_lineheight']) { ?> <div class="themify-customizer-brick"> <!-- LINE HEIGHT --> <input type="text" class="font_line_num" value="<?php echo esc_attr(empty($font_line_num) ? '' : $font_size_num); ?> " /> <div class="custom-select"> <select class="font_line_unit"> <?php foreach ($units as $unit) { ?> <option value="<?php echo esc_attr($unit); ?> " <?php selected($unit, $font_line_unit); ?> ><?php echo esc_html($unit); ?> </option> <?php } ?> </select> </div> <label><?php _e('Line Height', 'themify'); ?> </label> </div> <?php } // show_lineheight ?> <?php if ($args['show_decoration']) { ?> <!-- TEXT STYLE & DECORATION --> <div class="themify_font_style themify-customizer-brick"> <button type="button" class="button <?php echo esc_attr($this->style_is($font_italic, 'italic')); ?> " data-style="italic"><?php _e('i', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_normal, 'normal')); ?> " data-style="normal"><?php _e('N', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_weight, 'bold')); ?> " data-style="bold"><?php _e('B', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_underline, 'underline')); ?> " data-style="underline"><?php _e('U', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_linethrough, 'linethrough')); ?> " data-style="linethrough"><?php _e('S', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_nostyle, 'nostyle')); ?> " data-style="nostyle"><?php _e('×', 'themify'); ?> </button> </div> <?php } // show_decoration ?> <?php if ($args['show_transform']) { ?> <!-- TEXT TRANSFORM --> <div class="themify_text_transform themify-customizer-brick"> <button type="button" class="button <?php echo esc_attr($this->style_is($text_transform, 'uppercase')); ?> " data-texttransform="uppercase"><?php _e('AA', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($text_transform, 'lowercase')); ?> " data-texttransform="lowercase"><?php _e('ab', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($text_transform, 'capitalize')); ?> " data-texttransform="capitalize"><?php _e('Ab', 'themify'); ?> </button> <button type="button" class="button <?php echo esc_attr($this->style_is($text_transform, 'notexttransform')); ?> " data-texttransform="notexttransform"><?php _e('×', 'themify'); ?> </button> </div> <?php } // show_transform ?> <?php if ($args['show_align']) { ?> <!-- TEXT ALIGN --> <div class="themify_font_align themify-customizer-brick"> <button type="button" class="button <?php echo esc_attr($this->style_is($font_align, 'left')); ?> " data-align="left"><span class="ti-align-left"></span></button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_align, 'center')); ?> " data-align="center"><span class="ti-align-center"></span></button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_align, 'right')); ?> " data-align="right"><span class="ti-align-right"></span></button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_align, 'justify')); ?> " data-align="justify"><span class="ti-align-justify"></span></button> <button type="button" class="button <?php echo esc_attr($this->style_is($font_noalign, 'noalign')); ?> " data-align="noalign"><?php _e('×', 'themify'); ?> </button> </div> <?php } // show_align ?> <?php }
/** * Outputs custom post CSS at the end of a post * @since 1.0.0 */ function themify_theme_custom_post_css() { global $themify; $post_id = '.section-post.post-' . get_the_ID(); $css = array(); $style = ''; if (!isset($themify->google_fonts)) { $themify->google_fonts = ''; } $rules = array("{$post_id}, {$post_id} h1, {$post_id} h2, {$post_id} h3, {$post_id} h4, {$post_id} h5, {$post_id} h6" => array(array('prop' => 'font-size', 'key' => array('font_size', 'font_size_unit')), array('prop' => 'font-family', 'key' => 'font_family'), array('prop' => 'color', 'key' => 'font_color')), "{$post_id} .section-title" => array(array('prop' => 'font-size', 'key' => array('title_font_size', 'font_size_unit')), array('prop' => 'font-family', 'key' => 'title_font_family'), array('prop' => 'color', 'key' => 'title_font_color')), $post_id => array(array('prop' => 'background-color', 'key' => 'background_color'), array('prop' => 'background-image', 'key' => 'background_image'), array('prop' => 'background-repeat', 'key' => 'background_repeat'), array('prop' => 'background-position', 'key' => array('background_position_x', 'background_position_y'))), "{$post_id} a" => array(array('prop' => 'color', 'key' => 'link_color'))); foreach ($rules as $selector => $property) { foreach ($property as $val) { $prop = $val['prop']; $key = $val['key']; if (is_array($key)) { if ($prop == 'font-size' && themify_check($key[0])) { $css[$selector][$prop] = $prop . ': ' . themify_get($key[0]) . themify_get($key[1]); } if ($prop == 'background-position' && themify_check($key[0])) { $css[$selector][$prop] = $prop . ': ' . themify_get($key[0]) . ' ' . themify_get($key[1]); } } elseif (themify_check($key) && 'default' != themify_get($key)) { if ($prop == 'color' || stripos($prop, 'color')) { $css[$selector][$prop] = $prop . ': #' . themify_get($key); } elseif ($prop == 'background-image') { $css[$selector][$prop] = $prop . ': url(' . themify_get($key) . ')'; } elseif ($prop == 'font-family') { $font = themify_get($key); $css[$selector][$prop] = $prop . ': ' . $font; if (!in_array($font, themify_get_web_safe_font_list(true))) { $themify->google_fonts .= str_replace(' ', '+', $font . '|'); } } else { $css[$selector][$prop] = $prop . ': ' . themify_get($key); } } } if (!empty($css[$selector])) { $style .= "{$selector} {\n\t" . implode(";\n\t", $css[$selector]) . "\n}\n"; } } if ('' != $style) { echo "\n<!-- {$post_id} Style -->\n<style>\n{$style}</style>\n<!-- End {$post_id} Style -->\n"; } }
/** * Module Styling Fields * @param array $styling * @return string */ function themify_builder_styling_field($styling) { switch ($styling['type']) { case 'text': ?> <input id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " type="text" value="" class="<?php echo esc_attr($styling['class']); ?> tfb_lb_option"> <?php if (isset($styling['description'])) { echo '<small>' . wp_kses_post($styling['description']) . '</small>'; } ?> <?php break; case 'textarea': ?> <textarea id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " class="<?php echo esc_attr($styling['class']); ?> tfb_lb_option"><?php if (isset($styling['value'])) { echo esc_textarea($styling['value']); } ?> </textarea> <?php if (isset($styling['description'])) { echo '<small>' . wp_kses_post($styling['description']) . '</small>'; } ?> <?php break; case 'separator': echo isset($styling['meta']['html']) && '' != $styling['meta']['html'] ? $styling['meta']['html'] : '<hr class="meta_fields_separator" />'; break; case 'image': ?> <input id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " placeholder="<?php if (isset($styling['value'])) { echo esc_attr($styling['value']); } ?> " class="<?php echo esc_attr($styling['class']); ?> themify-builder-uploader-input tfb_lb_option" type="text" /><br /> <div class="small"> <?php if (is_multisite() && !is_upload_space_available()) { ?> <?php echo sprintf(__('Sorry, you have filled your %s MB storage quota so uploading has been disabled.', 'themify'), get_space_allowed()); ?> <?php } else { ?> <div class="themify-builder-plupload-upload-uic hide-if-no-js tf-upload-btn" id="<?php echo esc_attr($styling['id']); ?> themify-builder-plupload-upload-ui"> <input id="<?php echo esc_attr($styling['id']); ?> themify-builder-plupload-browse-button" type="button" value="<?php esc_attr_e(__('Upload', 'themify')); ?> " class="builder_button" /> <span class="ajaxnonceplu" id="ajaxnonceplu<?php echo wp_create_nonce($styling['id'] . 'themify-builder-plupload'); ?> "></span> </div> <?php _e('or', 'themify'); ?> <a href="#" class="themify-builder-media-uploader tf-upload-btn" data-uploader-title="<?php esc_attr_e('Upload an Image', 'themify'); ?> " data-uploader-button-text="<?php esc_attr_e('Insert file URL', 'themify'); ?> "><?php _e('Browse Library', 'themify'); ?> </a> <?php } ?> </div> <p class="thumb_preview"> <span class="img-placeholder"></span> <a href="#" class="themify_builder_icon small delete themify-builder-delete-thumb"></a> </p> <?php break; case 'video': ?> <input id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " placeholder="<?php if (isset($styling['value'])) { echo esc_attr($styling['value']); } ?> " class="<?php echo esc_attr($styling['class']); ?> themify-builder-uploader-input tfb_lb_option" type="text" /><br /> <div class="small"> <?php if (is_multisite() && !is_upload_space_available()) { ?> <?php echo sprintf(__('Sorry, you have filled your %s MB storage quota so uploading has been disabled.', 'themify'), get_space_allowed()); ?> <?php } else { ?> <div class="themify-builder-plupload-upload-uic hide-if-no-js tf-upload-btn" id="<?php echo esc_attr($styling['id']); ?> themify-builder-plupload-upload-ui" data-extensions="<?php echo esc_attr(implode(',', wp_get_video_extensions())); ?> "> <input id="<?php echo esc_attr($styling['id']); ?> themify-builder-plupload-browse-button" type="button" value="<?php esc_attr_e(__('Upload', 'themify')); ?> " class="builder_button" /> <span class="ajaxnonceplu" id="ajaxnonceplu<?php echo wp_create_nonce($styling['id'] . 'themify-builder-plupload'); ?> "></span> </div> <?php _e('or', 'themify'); ?> <a href="#" class="themify-builder-media-uploader tf-upload-btn" data-uploader-title="<?php _e('Upload a Video', 'themify'); ?> " data-uploader-button-text="<?php esc_attr_e('Insert file URL', 'themify'); ?> " data-library-type="video"><?php _e('Browse Library', 'themify'); ?> </a> <?php } ?> </div> <?php if (isset($styling['description'])) { echo '<small>' . wp_kses_post($styling['description']) . '</small>'; } ?> <?php break; case 'select': ?> <select id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " class="tfb_lb_option <?php echo isset($styling['class']) ? esc_attr($styling['class']) : ''; ?> "> <?php if (isset($styling['default'])) { ?> <option value="<?php echo esc_attr($styling['default']); ?> "><?php echo esc_html($styling['default']); ?> </option> <?php } foreach ($styling['meta'] as $option) { ?> <option value="<?php echo esc_attr($option['value']); ?> "><?php echo esc_html($option['name']); ?> </option> <?php } ?> </select> <?php if (isset($styling['description'])) { echo wp_kses_post($styling['description']); } ?> <?php break; case 'animation_select': ?> <?php $class = isset($styling['class']) ? $styling['class'] : ''; ?> <select id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " class="tfb_lb_option <?php echo esc_attr($class); ?> "> <option value=""></option> <?php $animation = Themify_Builder_model::get_preset_animation(); foreach ($animation as $group) { ?> <optgroup label="<?php echo esc_attr($group['group_label']); ?> "> <?php foreach ($group['options'] as $opt) { ?> <option value="<?php echo esc_attr($opt['value']); ?> "><?php echo esc_html($opt['name']); ?> </option> <?php } ?> </optgroup> <?php } ?> </select> <?php if (isset($styling['description'])) { echo wp_kses_post($styling['description']); } ?> <?php break; case 'font_select': $fonts = array_merge(themify_get_web_safe_font_list(), themify_get_google_web_fonts_list()); ?> <select id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " class="tfb_lb_option <?php echo esc_attr($styling['class']); ?> "> <?php if (isset($styling['default'])) { ?> <option value="<?php echo esc_attr($styling['default']); ?> "><?php echo esc_html($styling['default']); ?> </option> <?php } foreach ($fonts as $option) { ?> <option value="<?php echo esc_attr($option['value']); ?> "><?php echo esc_html($option['name']); ?> </option> <?php } ?> </select> <?php if (isset($styling['description'])) { echo wp_kses_post($styling['description']); } ?> <?php break; case 'color': ?> <span class="builderColorSelect"><span></span></span> <input type="text" class="<?php echo esc_attr($styling['class']); ?> colordisplay"/> <input id="<?php echo esc_attr($styling['id']); ?> " name="<?php echo esc_attr($styling['id']); ?> " value="" class="builderColorSelectInput tfb_lb_option" type="hidden" /> <?php break; case 'checkbox': if (isset($styling['before'])) { echo wp_kses_post($styling['before']); } ?> <div id="<?php echo esc_attr($styling['id']); ?> " class="tfb_lb_option themify-checkbox"> <?php foreach ($styling['options'] as $opt) { ?> <?php $checkbox_checked = ''; if (isset($styling['default']) && is_array($styling['default'])) { $checkbox_checked = in_array($opt['name'], $styling['default']) ? 'checked="checked"' : ''; } elseif (isset($styling['default'])) { $checkbox_checked = checked($styling['default'], $opt['name'], false); } ?> <input id="<?php echo esc_attr($styling['id'] . '_' . $opt['name']); ?> " name="<?php echo esc_attr($styling['id']); ?> " type="checkbox" class="tfb_lb_option tf-checkbox" value="<?php echo esc_attr($opt['name']); ?> " <?php echo $checkbox_checked; ?> /> <label for="<?php echo esc_attr($styling['id'] . '_' . $opt['name']); ?> " class="pad-right"><?php echo wp_kses_post($opt['value']); ?> </label> <?php if (isset($opt['help'])) { ?> <small><?php echo wp_kses_post($opt['help']); ?> </small> <?php } ?> <?php if (!isset($styling['new_line']) || $styling['new_line'] == true) { ?> <br /> <?php } ?> <?php } ?> </div> <?php if (isset($styling['after'])) { echo wp_kses_post($styling['after']); } break; case 'radio': $option_js = isset($styling['option_js']) && $styling['option_js'] == true ? 'tf-option-checkbox-js' : ''; $option_js_wrap = isset($styling['option_js']) && $styling['option_js'] == true ? 'tf-option-checkbox-enable' : ''; ?> <div id="<?php echo esc_attr($styling['id']); ?> " class="tfb_lb_option tf-radio-input-container <?php echo esc_attr($option_js_wrap); ?> "> <?php foreach ($styling['meta'] as $option) { $checked = isset($option['selected']) && $option['selected'] == true ? 'checked="checked"' : ''; $data_el = isset($styling['option_js']) && $styling['option_js'] == true ? 'data-selected="tf-group-element-' . $option['value'] . '"' : ''; ?> <input type="radio" id="<?php echo esc_attr($styling['id'] . '_' . $option['value']); ?> " name="<?php echo esc_attr($styling['id']); ?> " value="<?php echo esc_attr($option['value']); ?> " class="tfb_lb_option <?php echo esc_attr($option_js); ?> " <?php echo $checked . ' ' . $data_el; ?> > <label for="<?php echo esc_attr($styling['id'] . '_' . $option['value']); ?> "><?php echo esc_html($option['name']); ?> </label> <?php } ?> <?php if (isset($styling['description'])) { echo '<br/><small>' . wp_kses_post($styling['description']) . '</small>'; } ?> </div> <?php break; } }
/** * Theme Appearance Tab for Themify Custom Panel * * @since 1.0.0 * * @param array $args * * @return array */ function themify_theme_page_theme_design_meta_box($args = array()) { return array(array('name' => 'body_background_color', 'title' => __('Body Background', 'themify'), 'description' => '', 'type' => 'color', 'meta' => array('default' => null)), array('name' => 'body_background_image', 'title' => '', 'type' => 'image', 'description' => '', 'meta' => array(), 'before' => '', 'after' => ''), array('name' => 'body_background_repeat', 'title' => '', 'description' => __('Background Repeat', 'themify'), 'type' => 'dropdown', 'meta' => array(array('value' => 'fullcover', 'name' => __('Fullcover', 'themify')), array('value' => 'repeat', 'name' => __('Repeat', 'themify')), array('value' => 'no-repeat', 'name' => __('No Repeat', 'themify')), array('value' => 'repeat-x', 'name' => __('Repeat horizontally', 'themify')), array('value' => 'repeat-y', 'name' => __('Repeat vertically', 'themify')))), array('name' => 'color_scheme_mode', 'title' => __('Accent Color', 'themify'), 'description' => '', 'type' => 'radio', 'show_title' => true, 'meta' => array(array('value' => 'color-presets', 'name' => __('Presets', 'themify'), 'selected' => true), array('value' => 'color-custom', 'name' => __('Custom', 'themify'))), 'enable_toggle' => true), array('name' => 'color_design', 'title' => '', 'description' => '', 'type' => 'layout', 'show_title' => true, 'meta' => $args['color_design_options'], 'toggle' => 'color-presets-toggle'), array('name' => 'scheme_color', 'title' => '', 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'after' => __('Accent Font Color', 'themify'), 'toggle' => 'color-custom-toggle'), array('name' => 'scheme_link', 'title' => '', 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'after' => __('Accent Link Color', 'themify'), 'toggle' => 'color-custom-toggle'), array('name' => 'scheme_background', 'title' => '', 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'after' => __('Accent Background Color', 'themify'), 'toggle' => 'color-custom-toggle'), array('name' => 'typography_mode', 'title' => __('Typography', 'themify'), 'description' => '', 'type' => 'radio', 'show_title' => true, 'meta' => array(array('value' => 'typography-presets', 'name' => __('Presets', 'themify'), 'selected' => true), array('value' => 'typography-custom', 'name' => __('Custom', 'themify'))), 'enable_toggle' => true), array('name' => 'font_design', 'title' => '', 'description' => '', 'type' => 'layout', 'show_title' => true, 'meta' => $args['font_design_options'], 'toggle' => 'typography-presets-toggle'), array('name' => 'body_font', 'title' => '', 'description' => '', 'type' => 'dropdown', 'meta' => array_merge(themify_get_web_safe_font_list(), themify_get_google_web_fonts_list()), 'after' => ' ' . __('Body Font', 'themify'), 'toggle' => 'typography-custom-toggle'), array('name' => 'body_text_color', 'title' => '', 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'after' => __('Body Font Color', 'themify'), 'toggle' => 'typography-custom-toggle'), array('name' => 'body_link_color', 'title' => '', 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'after' => __('Body Link Color', 'themify'), 'toggle' => 'typography-custom-toggle'), array('name' => 'heading_font', 'title' => '', 'description' => '', 'type' => 'dropdown', 'meta' => array_merge(themify_get_web_safe_font_list(), themify_get_google_web_fonts_list()), 'after' => ' ' . __('Heading (h1 to h6)', 'themify'), 'toggle' => 'typography-custom-toggle'), array('name' => 'heading_color', 'title' => '', 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'after' => __('Heading Font Color', 'themify'), 'toggle' => 'typography-custom-toggle'), array('name' => 'header_design', 'title' => __('Header Design', 'themify'), 'description' => '', 'type' => 'layout', 'show_title' => true, 'meta' => $args['header_design_options'], 'hide' => 'none header-leftpane header-minbar boxed-content'), array('name' => 'fixed_header', 'title' => __('Sticky Header', 'themify'), 'description' => '', 'type' => 'radio', 'meta' => themify_ternary_options(), 'class' => 'hide-if none header-leftpane header-minbar boxed-content'), array('name' => 'full_height_header', 'title' => __('Full Height Header', 'themify'), 'description' => __('Full height will display the container in 100% viewport height', 'themify'), 'type' => 'radio', 'meta' => themify_ternary_options(), 'class' => 'hide-if none header-horizontal header-leftpane header-minbar boxed-content'), array('name' => '_multi_header_elements', 'title' => __('Header Elements', 'themify'), 'description' => '', 'type' => 'multi', 'class' => 'hide-if none', 'meta' => array('fields' => array(array('name' => 'exclude_site_logo', 'description' => '', 'title' => __('Show Site Logo', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_site_tagline', 'description' => '', 'title' => __('Show Site Tagline', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_search_form', 'description' => '', 'title' => __('Show Search Form', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_rss', 'description' => '', 'title' => __('Show RSS Link', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_header_widgets', 'description' => '', 'title' => __('Show Header Widgets', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_social_widget', 'description' => '', 'title' => __('Show Social Widget', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_menu_navigation', 'description' => '', 'title' => __('Show Menu Navigation', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>')), 'description' => '', 'before' => '', 'after' => '<div class="clear"></div>', 'separator' => '')), array('name' => 'header_wrap', 'title' => __('Header Background', 'themify'), 'description' => '', 'type' => 'radio', 'show_title' => true, 'meta' => array(array('value' => 'solid', 'name' => __('Solid Background', 'themify'), 'selected' => true), array('value' => 'transparent', 'name' => __('Transparent Background', 'themify')), array('value' => 'slider', 'name' => __('Slider', 'themify')), array('value' => 'video', 'name' => __('Video', 'themify')), array('value' => 'colors', 'name' => __('Animating Colors', 'themify'))), 'enable_toggle' => true, 'class' => 'hide-if none clear'), array('name' => '_animated_colors', 'title' => __('Animating Colors', 'themify'), 'description' => sprintf(__('Animating Colors can be configured at <a href="%s">Themify > Settings > Theme Settings</a>', 'themify'), esc_url(add_query_arg('page', 'themify', admin_url('admin.php')))), 'type' => 'post_id_info', 'toggle' => 'colors-toggle'), array('name' => 'background_gallery', 'title' => __('Header Slider', 'themify'), 'description' => '', 'type' => 'gallery_shortcode', 'toggle' => 'slider-toggle'), array('type' => 'multi', 'name' => '_video_select', 'title' => __('Video', 'themify'), 'meta' => array('fields' => array(array('name' => 'video_file', 'title' => __('Video File', 'themify'), 'description' => '', 'type' => 'video', 'meta' => array())), 'description' => __('Video format: mp4. Note: video background does not play on mobile, background image will be used as fallback.', 'themify'), 'before' => '', 'after' => '', 'separator' => ''), 'toggle' => 'video-toggle'), array('name' => 'background_color', 'title' => '', 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'toggle' => array('solid-toggle', 'slider-toggle', 'video-toggle'), 'class' => 'hide-if none'), array('name' => 'background_image', 'title' => '', 'type' => 'image', 'description' => '', 'meta' => array(), 'before' => '', 'after' => '', 'toggle' => array('solid-toggle', 'video-toggle'), 'class' => 'hide-if none'), array('name' => 'background_repeat', 'title' => '', 'description' => __('Background Repeat', 'themify'), 'type' => 'dropdown', 'meta' => array(array('value' => 'fullcover', 'name' => __('Fullcover', 'themify')), array('value' => 'repeat', 'name' => __('Repeat', 'themify')), array('value' => 'no-repeat', 'name' => __('No Repeat', 'themify')), array('value' => 'repeat-x', 'name' => __('Repeat horizontally', 'themify')), array('value' => 'repeat-y', 'name' => __('Repeat vertically', 'themify'))), 'toggle' => array('solid-toggle', 'video-toggle'), 'class' => 'hide-if none'), array('name' => 'headerwrap_text_color', 'title' => __('Header Text Color', 'themify'), 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'class' => 'hide-if none'), array('name' => 'headerwrap_link_color', 'title' => __('Header Link Color', 'themify'), 'description' => '', 'type' => 'color', 'meta' => array('default' => null), 'class' => 'hide-if none'), array('name' => 'footer_design', 'title' => __('Footer Design', 'themify'), 'description' => '', 'type' => 'layout', 'show_title' => true, 'meta' => $args['footer_design_options'], 'hide' => 'none'), array('name' => '_multi_footer_elements', 'title' => __('Footer Elements', 'themify'), 'description' => '', 'type' => 'multi', 'class' => 'hide-if none', 'meta' => array('fields' => array(array('name' => 'exclude_footer_site_logo', 'description' => '', 'title' => __('Show Site Logo', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_footer_widgets', 'description' => '', 'title' => __('Show Footer Widgets', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_footer_menu_navigation', 'description' => '', 'title' => __('Show Menu Navigation', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_footer_texts', 'description' => '', 'title' => __('Show Footer Text', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>'), array('name' => 'exclude_footer_back', 'description' => '', 'title' => __('Show Back to Top Arrow', 'themify'), 'type' => 'dropdownbutton', 'states' => themify_ternary_states(array('icon_no' => THEMIFY_URI . '/img/ddbtn-check.png', 'icon_yes' => THEMIFY_URI . '/img/ddbtn-cross.png')), 'class' => 'hide-if none', 'after' => '<div class="clear"></div>')), 'description' => '', 'before' => '', 'after' => '<div class="clear"></div>', 'separator' => ''))); }
/** * Outputs custom post CSS at the end of a post * * @since 1.0.0 */ function themify_theme_custom_post_css() { global $themify; if (in_array(get_post_type(), array('post', 'page', 'portfolio'))) { $post_id = get_the_ID(); if (is_page()) { $entry_id = '.page-id-' . $post_id; $archive_entry_id = '.page-' . $post_id; } else { $entry_id = '.postid-' . $post_id; $archive_entry_id = '.post-' . $post_id; } $headerwrap = $entry_id . ' #headerwrap'; $site_logo = $entry_id . ' #site-logo'; $site_description = $entry_id . ' #site-description'; $main_nav = $entry_id . ' #main-nav'; $header_widget = $entry_id . ' .header-widget'; $social_widget = $entry_id . ' .social-widget'; $header_search = $entry_id . ' #searchform-wrap'; $css = array(); $style = ''; $rules = array(); $header_type = themify_get('header_wrap'); if ('transparent' != $header_type) { $rules = array("{$entry_id} #site-logo span:after, {$entry_id} #headerwrap #searchform, {$entry_id} #main-nav .current_page_item a, {$entry_id} #main-nav .current-menu-item a" => array(array('prop' => 'border-color', 'key' => 'headerwrap_text_color'))); if ('solid' === $header_type) { $rules[$headerwrap] = array(array('prop' => 'background-color', 'key' => 'background_color'), array('prop' => 'background-image', 'key' => 'background_image'), array('prop' => 'background-repeat', 'key' => 'background_repeat', 'dependson' => array('prop' => 'background-image', 'key' => 'background_image'))); } } if (is_singular()) { $rules = array_merge($rules, array('.skin-styles' => array(array('prop' => 'background-color', 'key' => 'body_background_color'), array('prop' => 'background-image', 'key' => 'body_background_image'), array('prop' => 'background-repeat', 'key' => 'body_background_repeat', 'dependson' => array('prop' => 'background-image', 'key' => 'body_background_image')), array('prop' => 'font-family', 'key' => 'body_font'), array('prop' => 'color', 'key' => 'body_text_color')), '.skin-styles .post-meta, .skin-styles #site-description, .skin-styles .post-date .year, .skin-styles .post-date .month, .skin-styles .post-date .day, .skin-styles .loops-wrapper .entry-content' => array(array('prop' => 'font-family', 'key' => 'body_font')))); // No space between .skin-styles and $main_nav because the latter has the body classes prepended. $rules[".skin-styles a, .skin-styles .post-nav .arrow"] = array(array('prop' => 'color', 'key' => 'body_link_color')); $rules['.skin-styles h1, .skin-styles h2, .skin-styles h3, .skin-styles h4, .skin-styles h5, .skin-styles h6'] = array(array('prop' => 'color', 'key' => 'heading_color'), array('prop' => 'font-family', 'key' => 'heading_font')); // Accent Background Color $rules['.skin-styles #headerwrap,.skin-styles #footerwrap,.skin-styles input[type=reset],.skin-styles input[type=submit],.skin-styles button,.skin-styles #respond #cancel-comment-reply-link,.skin-styles .commentlist .comment-reply-link,.skin-styles.footer-horizontal-left .back-top .arrow-up a,.skin-styles.footer-horizontal-right .back-top .arrow-up a,.skin-styles.footer-left-col .back-top .arrow-up a,.skin-styles.footer-right-col .back-top .arrow-up a,.skin-styles.woocommerce #content input.button,.skin-styles.woocommerce #respond input#submit,.skin-styles.woocommerce a.button,.skin-styles.woocommerce button.button,.skin-styles.woocommerce input.button,.skin-styles.woocommerce-page #content input.button,.skin-styles.woocommerce-page #respond input#submit,.skin-styles.woocommerce-page a.button,.skin-styles.woocommerce-page button.button,.skin-styles.woocommerce-page input.button,.skin-styles.woocommerce #content input.button.alt,.skin-styles.woocommerce #respond input#submit.alt,.skin-styles.woocommerce a.button.alt,.skin-styles.woocommerce button.button.alt,.skin-styles.woocommerce input.button.alt,.skin-styles.woocommerce-page #content input.button.alt,.skin-styles.woocommerce-page #respond input#submit.alt,.skin-styles.woocommerce-page a.button.alt,.skin-styles.woocommerce-page button.button.alt,.skin-styles.woocommerce-page input.button.alt,.skin-styles.woocommerce ul.products li.product .add_to_cart_button,.skin-styles.woocommerce-page ul.products li.product .add_to_cart_button,.skin-styles.woocommerce ul.products li.product .button[data-product_id],.skin-styles.woocommerce-page ul.products li.product .button[data-product_id],.skin-styles.woocommerce span.onsale,.skin-styles.woocommerce-page span.onsale,.skin-styles.woocommerce ul.products li.product .onsale,.skin-styles.woocommerce-page ul.products li.product .onsale,.skin-styles.woocommerce-checkout #payment div.payment_box,.skin-styles.woocommerce #content nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce #content nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce #content nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce-page #content nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce-page #content nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce-page #content nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce-page nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce-page nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce-page nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce #content table.cart a.remove:hover,.skin-styles.woocommerce table.cart a.remove:hover,.skin-styles.woocommerce-page #content table.cart a.remove:hover,.skin-styles.woocommerce-page table.cart a.remove:hover'] = array(array('prop' => 'background-color', 'key' => 'scheme_background')); // Accent Font Color $rules['.skin-styles #headerwrap,.skin-styles #footerwrap,.footer-widgets .widgettitle,.skin-styles #site-description,.skin-styles input[type=reset],.skin-styles input[type=submit],.skin-styles button,.skin-styles #respond #cancel-comment-reply-link,.skin-styles .commentlist .comment-reply-link,.skin-styles .post-title a,.skin-styles #main-nav > li > a,.skin-styles #main-nav > .current_page_item > a,.skin-styles #main-nav > .current-menu-item > a,.skin-styles #main-nav > li > a:hover,.skin-styles.footer-horizontal-left .back-top .arrow-up a,.skin-styles.footer-horizontal-right .back-top .arrow-up a,.skin-styles.footer-left-col .back-top .arrow-up a,.skin-styles.footer-right-col .back-top .arrow-up a,.skin-styles.woocommerce #content input.button,.skin-styles.woocommerce #respond input#submit,.skin-styles.woocommerce a.button,.skin-styles.woocommerce button.button,.skin-styles.woocommerce input.button,.skin-styles.woocommerce-page #content input.button,.skin-styles.woocommerce-page #respond input#submit,.skin-styles.woocommerce-page a.button,.skin-styles.woocommerce-page button.button,.skin-styles.woocommerce-page input.button,.skin-styles.woocommerce #content input.button.alt,.skin-styles.woocommerce #respond input#submit.alt,.skin-styles.woocommerce a.button.alt,.skin-styles.woocommerce button.button.alt,.skin-styles.woocommerce input.button.alt,.skin-styles.woocommerce-page #content input.button.alt,.skin-styles.woocommerce-page #respond input#submit.alt,.skin-styles.woocommerce-page a.button.alt,.skin-styles.woocommerce-page button.button.alt,.skin-styles.woocommerce-page input.button.alt,.skin-styles.woocommerce ul.products li.product .add_to_cart_button,.skin-styles.woocommerce-page ul.products li.product .add_to_cart_button,.skin-styles.woocommerce ul.products li.product .button[data-product_id],.skin-styles.woocommerce-page ul.products li.product .button[data-product_id],.skin-styles.woocommerce span.onsale,.skin-styles.woocommerce-page span.onsale,.skin-styles.woocommerce ul.products li.product .onsale,.skin-styles.woocommerce-page ul.products li.product .onsale,.skin-styles.woocommerce-checkout #payment div.payment_box,.skin-styles.woocommerce #content nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce #content nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce #content nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce-page #content nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce-page #content nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce-page #content nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce-page nav.woocommerce-pagination ul li a:focus,.skin-styles.woocommerce-page nav.woocommerce-pagination ul li a:hover,.skin-styles.woocommerce-page nav.woocommerce-pagination ul li span.current,.skin-styles.woocommerce #content table.cart a.remove:hover,.skin-styles.woocommerce table.cart a.remove:hover,.skin-styles.woocommerce-page #content table.cart a.remove:hover,.skin-styles.woocommerce-page table.cart a.remove:hover'] = array(array('prop' => 'color', 'key' => 'scheme_color')); // Accent Link Color $rules['.skin-styles #headerwrap a, .skin-styles #footerwrap a, .skin-styles .sidemenu a, .skin-styles .post-nav .arrow, .skin-styles .widget .social-links a, .skin-styles .widget .social-links a:hover, .skin-styles .footer-nav li a'] = array(array('prop' => 'color', 'key' => 'scheme_link')); $rules['.skin-styles.woocommerce .woocommerce-error,.skin-styles.woocommerce .woocommerce-info,.skin-styles.woocommerce .woocommerce-message,.skin-styles.woocommerce-page .woocommerce-error,.skin-styles.woocommerce-page .woocommerce-info,.skin-styles.woocommerce-page .woocommerce-message'] = array(array('prop' => 'border-top-color', 'key' => 'scheme_background')); $rules['.skin-styles.woocommerce-checkout #payment div.payment_box:after'] = array(array('prop' => 'border-bottom-color', 'key' => 'scheme_background')); $rules['.skin-styles .post-title a:hover'] = array(array('prop' => 'color', 'key' => 'scheme_background')); } $rules["{$headerwrap}, {$site_logo}, {$site_description}"] = array(array('prop' => 'color', 'key' => 'headerwrap_text_color')); $rules["{$site_logo} a, {$site_description} a, {$header_widget} a, {$social_widget} a, {$social_widget} .rss a, {$main_nav} > li > a"] = array(array('prop' => 'color', 'key' => 'headerwrap_link_color')); foreach ($rules as $selector => $property) { foreach ($property as $val) { $prop = $val['prop']; $key = $val['key']; if (is_array($key)) { if ($prop == 'font-size' && themify_check($key[0])) { $css[$selector][$prop] = $prop . ': ' . themify_get($key[0]) . themify_get($key[1]); } } elseif (themify_check($key) && 'default' != themify_get($key)) { if ($prop == 'color' || stripos($prop, 'color')) { $css[$selector][$prop] = $prop . ': #' . themify_get($key); } elseif ($prop == 'background-image' && 'default' != themify_get($key)) { $css[$selector][$prop] = $prop . ': url(' . themify_get($key) . ')'; } elseif ($prop == 'background-repeat' && 'fullcover' == themify_get($key)) { if (isset($val['dependson'])) { if ($val['dependson']['prop'] == 'background-image' && (themify_check($val['dependson']['key']) && 'default' != themify_get($val['dependson']['key']))) { $css[$selector]['background-size'] = 'background-size: cover; background-attachment:fixed;'; } } else { $css[$selector]['background-size'] = 'background-size: cover; background-attachment:fixed;'; } } elseif ($prop == 'font-family') { $font = themify_get($key); $css[$selector][$prop] = $prop . ': ' . $font; if (!in_array($font, themify_get_web_safe_font_list(true))) { $themify->google_fonts .= str_replace(' ', '+', $font . '|'); } } else { $css[$selector][$prop] = $prop . ': ' . themify_get($key); } } } if (!empty($css[$selector])) { $style .= "{$selector} {\n\t" . implode(";\n\t", $css[$selector]) . "\n}\n"; } } if ('' != $style) { echo "\n<!-- Entry Style -->\n<style>\n{$style}</style>\n<!-- End Entry Style -->\n"; } } }
/** * Section Meta Box Options * @param array $args * @return array * @since 1.0.7 */ function themify_theme_section_meta_box($args = array()) { extract($args); return array(array('name' => 'separator_section_title_font', 'title' => '', 'description' => '', 'type' => 'separator', 'meta' => array('html' => '<h4>' . __('Section Title Font', 'themify') . '</h4><hr class="meta_fields_separator"/>')), array('type' => 'multi', 'name' => '_font_title', 'title' => __('Font', 'themify'), 'meta' => array('fields' => array(array('name' => 'title_font_size', 'label' => '', 'description' => '', 'type' => 'textbox', 'meta' => array('size' => 'small'), 'before' => '', 'after' => ''), array('name' => 'title_font_size_unit', 'label' => '', 'type' => 'dropdown', 'meta' => array(array('value' => 'px', 'name' => __('px', 'themify'), 'selected' => true), array('value' => 'em', 'name' => __('em', 'themify'))), 'before' => '', 'after' => ''), array('name' => 'title_font_family', 'label' => '', 'type' => 'dropdown', 'meta' => array_merge(themify_get_web_safe_font_list(), themify_get_google_web_fonts_list()), 'before' => '', 'after' => '')), 'description' => '', 'before' => '', 'after' => '', 'separator' => '')), array('name' => 'title_font_color', 'title' => __('Font Color', 'themify'), 'description' => '', 'type' => 'color', 'meta' => array('default' => null)), array('name' => 'separator_font', 'title' => '', 'description' => '', 'type' => 'separator', 'meta' => array('html' => '<h4>' . __('Section Font', 'themify') . '</h4><hr class="meta_fields_separator"/>')), array('type' => 'multi', 'name' => '_font', 'title' => __('Font', 'themify'), 'meta' => array('fields' => array(array('name' => 'font_size', 'label' => '', 'description' => '', 'type' => 'textbox', 'meta' => array('size' => 'small'), 'before' => '', 'after' => ''), array('name' => 'font_size_unit', 'label' => '', 'type' => 'dropdown', 'meta' => array(array('value' => 'px', 'name' => __('px', 'themify'), 'selected' => true), array('value' => 'em', 'name' => __('em', 'themify'))), 'before' => '', 'after' => ''), array('name' => 'font_family', 'label' => '', 'type' => 'dropdown', 'meta' => array_merge(themify_get_web_safe_font_list(), themify_get_google_web_fonts_list()), 'before' => '', 'after' => '')), 'description' => '', 'before' => '', 'after' => '', 'separator' => '')), array('name' => 'font_color', 'title' => __('Font Color', 'themify'), 'description' => '', 'type' => 'color', 'meta' => array('default' => null)), array('name' => 'link_color', 'title' => __('Link Color', 'themify'), 'description' => '', 'type' => 'color', 'meta' => array('default' => null)), array('name' => 'separator', 'title' => '', 'description' => '', 'type' => 'separator', 'meta' => array('html' => '<h4>' . __('Section Background', 'themify') . '</h4><hr class="meta_fields_separator"/>')), array('name' => 'background_color', 'title' => __('Background Color', 'themify'), 'description' => '', 'type' => 'color', 'meta' => array('default' => null)), array('name' => 'background_image', 'title' => '', 'type' => 'image', 'description' => '', 'meta' => array(), 'before' => '', 'after' => ''), array('name' => 'background_repeat', 'title' => __('Background Repeat', 'themify'), 'description' => '', 'type' => 'dropdown', 'meta' => array(array('value' => 'default', 'name' => '', 'selected' => true), array('value' => 'repeat', 'name' => __('Repeat', 'themify')), array('value' => 'repeat-x', 'name' => __('Repeat horizontally', 'themify')), array('value' => 'repeat-y', 'name' => __('Repeat vertically', 'themify')), array('value' => 'no-repeat', 'name' => __('Do not repeat', 'themify')))), array('type' => 'multi', 'name' => '_multi_bg_position', 'title' => __('Background Position', 'themify'), 'meta' => array('fields' => array(array('name' => 'background_position_x', 'label' => '', 'description' => '', 'type' => 'dropdown', 'meta' => array(array('value' => '', 'name' => '', 'selected' => true), array('value' => 'left', 'name' => __('Left', 'themify')), array('value' => 'center', 'name' => __('Center', 'themify')), array('value' => 'right', 'name' => __('Right', 'themify'))), 'before' => '', 'after' => ''), array('name' => 'background_position_y', 'label' => '', 'description' => '', 'type' => 'dropdown', 'meta' => array(array('value' => '', 'name' => '', 'selected' => true), array('value' => 'top', 'name' => __('Top', 'themify')), array('value' => 'center', 'name' => __('Center', 'themify')), array('value' => 'bottom', 'name' => __('Bottom', 'themify'))), 'before' => '', 'after' => '')), 'description' => '', 'before' => '', 'after' => '', 'separator' => ''))); }
$web_safe_font_names = array('Arial, Helvetica, sans-serif', 'Verdana, Geneva, sans-serif', 'Georgia, \'Times New Roman\', Times, serif', '\'Times New Roman\', Times, serif', 'Tahoma, Geneva, sans-serif', '\'Trebuchet MS\', Arial, Helvetica, sans-serif', 'Palatino, \'Palatino Linotype\', \'Book Antiqua\', serif', '\'Lucida Sans Unicode\', \'Lucida Grande\', sans-serif'); if (!$only_names) { $web_safe_fonts = array(array('value' => 'default', 'name' => '', 'selected' => true), array('value' => '', 'name' => '--- ' . __('Web Safe Fonts', 'themify') . ' ---')); foreach ($web_safe_font_names as $font) { $web_safe_fonts[] = array('value' => $font, 'name' => str_replace('\'', '"', $font)); } } else { $web_safe_fonts = $web_safe_font_names; } return apply_filters('themify_get_web_safe_font_list', $web_safe_fonts); } } // Return Google Web Fonts list $google_fonts_list = themify_get_google_web_fonts_list(); // Return Web Safe Fonts list $fonts_list = themify_get_web_safe_font_list(); /////////////////////////////////////// // Setup Write Panel Options /////////////////////////////////////// /** Definition for tri-state hide meta buttons * @var array */ $states = array(array('name' => __('Hide', 'themify'), 'value' => 'yes', 'icon' => THEMIFY_URI . '/img/ddbtn-check.png', 'title' => __('Hide this meta', 'themify')), array('name' => __('Do not hide', 'themify'), 'value' => 'no', 'icon' => THEMIFY_URI . '/img/ddbtn-cross.png', 'title' => __('Show this meta', 'themify')), array('name' => __('Theme default', 'themify'), 'value' => '', 'icon' => THEMIFY_URI . '/img/ddbtn-blank.png', 'title' => __('Use theme settings', 'themify'), 'default' => true)); // Common Fields /////////////////////////////////////// $post_image = array('name' => 'post_image', 'title' => __('Featured Image', 'themify'), 'description' => '', 'type' => 'image', 'meta' => array()); $featured_image_size = array('name' => 'feature_size', 'title' => __('Image Size', 'themify'), 'description' => __('Image sizes can be set at <a href="options-media.php">Media Settings</a> and <a href="admin.php?page=themify_regenerate-thumbnails">Regenerated</a>', 'themify'), 'type' => 'featimgdropdown'); $external_link = array('name' => 'external_link', 'title' => __('External Link', 'themify'), 'description' => __('Link Featured Image and Post Title to external URL', 'themify'), 'type' => 'textbox', 'meta' => array()); $post_image_dimensions = array(array('name' => 'image_width', 'label' => __('width', 'themify'), 'description' => '', 'type' => 'textbox', 'meta' => array('size' => 'small'), 'before' => '', 'after' => ''), array('name' => 'image_height', 'label' => __('height', 'themify'), 'type' => 'textbox', 'meta' => array('size' => 'small'), 'before' => '', 'after' => '')); $nav_menus = array(array('name' => '', 'value' => '', 'selected' => true)); foreach (get_terms('nav_menu') as $menu) { $nav_menus[] = array('name' => $menu->name, 'value' => $menu->slug); }
/** * Displays the controls to setup the font. * * @param object $values */ function render_fonts($values) { // Font family $font_family = ''; if (isset($values->family)) { $font_family = !empty($values->family->name) ? $values->family->name : ''; $font_variant = !empty($values->family->variant) ? $values->family->variant : ''; } // Font styles and decoration $font_weight = !empty($values->bold) ? $values->bold : ''; $font_italic = !empty($values->italic) ? $values->italic : ''; $font_underline = !empty($values->underline) ? $values->underline : ''; $font_linethrough = !empty($values->linethrough) ? $values->linethrough : ''; $font_nostyle = !empty($values->nostyle) ? $values->nostyle : ''; // Text transform $text_transform = !empty($values->texttransform) ? $values->texttransform : ''; $text_notransform = !empty($values->notexttransform) ? $values->notexttransform : ''; // Text align $font_align = !empty($values->align) ? $values->align : ''; $font_noalign = !empty($values->noalign) ? $values->noalign : ''; // Font size $font_size_num = isset($values->sizenum) ? $values->sizenum : ''; $font_size_unit = isset($values->sizeunit) ? $values->sizeunit : 'px'; // Line height $font_line_num = isset($values->linenum) ? $values->linenum : ''; $font_line_unit = isset($values->lineunit) ? $values->lineunit : 'px'; $units = array('px', '%', 'em'); ?> <!-- FONT SIZE --> <div class="themify-customizer-brick"> <input type="text" class="font_size_num" value="<?php echo empty($font_size_num) ? '' : $font_size_num; ?> " /> <div class="custom-select"> <select class="font_size_unit"> <?php foreach ($units as $unit) { ?> <option value="<?php echo $unit; ?> " <?php selected($unit, $font_size_unit); ?> ><?php echo $unit; ?> </option> <?php } ?> </select> </div> <!-- FONT FAMILY --> <div class="custom-select font-family-select"> <select class="themify_font_family"> <option value=""></option> <optgroup label="<?php _e('Web Safe Fonts', 'themify'); ?> "> <?php $fonts = themify_get_web_safe_font_list(); unset($fonts[0]); unset($fonts[1]); foreach ($fonts as $font) { $value = "'" . json_encode(array('name' => esc_attr($font['value']), 'variant' => 'normal,bold,italic,bold italic', 'fonttype' => 'websafe')) . "'"; if ($font_family == $font['family']) { $font_variants = array('normal', 'bold', 'italic', 'bold italic'); } echo '<option value=' . $value . ' ' . selected($font_family, $font['value'], false) . '>' . $font['name'] . '</option>'; } ?> </optgroup> <optgroup label="<?php _e('Google Fonts', 'themify'); ?> "> <?php if (!isset($GLOBALS['themify_customizer_gfonts']) || '' == $GLOBALS['themify_customizer_gfonts']) { $fonts = themify_get_google_font_lists(); foreach ($fonts as $font) { $value = "'" . json_encode(array('name' => isset($font['family']) ? esc_attr($font['family']) : '', 'variant' => isset($font['variant']) ? $font['variant'] : '', 'subsets' => isset($font['subsets']) ? $font['subsets'] : '', 'fonttype' => 'google')) . "'"; $GLOBALS['themify_customizer_gfonts'] .= '<option class="google_font" value=' . $value . ' ' . selected($font_family, $font['family'], false) . '>' . $font['family'] . '</option>'; } } echo $GLOBALS['themify_customizer_gfonts']; ?> </optgroup> </select> </div> </div> <div class="themify-customizer-brick"> <!-- LINE HEIGHT --> <input type="text" class="font_line_num" value="<?php echo empty($font_line_num) ? '' : $font_size_num; ?> " /> <div class="custom-select"> <select class="font_line_unit"> <?php foreach ($units as $unit) { ?> <option value="<?php echo $unit; ?> " <?php selected($unit, $font_line_unit); ?> ><?php echo $unit; ?> </option> <?php } ?> </select> </div> <label><?php _e('Line Height', 'themify'); ?> </label> </div> <div> <!-- FONT VARIANT --> <select class="themify_font_variant" style="display:none"> <option value=""></option> <?php foreach ($font_variants as $variant) { echo '<option value=' . $variant . ' ' . selected($variant, $font_variant, false) . '>' . $variant . '</option>'; } ?> </select> </div> <!-- TEXT STYLE & DECORATION --> <div class="themify_font_style themify-customizer-brick"> <button type="button" class="button <?php echo $this->style_is($font_italic, 'italic'); ?> " data-style="italic"><?php _e('i', 'themify'); ?> </button> <button type="button" class="button <?php echo $this->style_is($font_weight, 'bold'); ?> " data-style="bold"><?php _e('B', 'themify'); ?> </button> <button type="button" class="button <?php echo $this->style_is($font_underline, 'underline'); ?> " data-style="underline"><?php _e('U', 'themify'); ?> </button> <button type="button" class="button <?php echo $this->style_is($font_linethrough, 'linethrough'); ?> " data-style="linethrough"><?php _e('S', 'themify'); ?> </button> <button type="button" class="button <?php echo $this->style_is($font_nostyle, 'nostyle'); ?> " data-style="nostyle"><?php _e('×', 'themify'); ?> </button> </div> <!-- TEXT TRANSFORM --> <div class="themify_text_transform themify-customizer-brick"> <button type="button" class="button <?php echo $this->style_is($text_transform, 'uppercase'); ?> " data-texttransform="uppercase"><?php _e('AA', 'themify'); ?> </button> <button type="button" class="button <?php echo $this->style_is($text_transform, 'lowercase'); ?> " data-texttransform="lowercase"><?php _e('ab', 'themify'); ?> </button> <button type="button" class="button <?php echo $this->style_is($text_transform, 'capitalize'); ?> " data-texttransform="capitalize"><?php _e('Ab', 'themify'); ?> </button> <button type="button" class="button <?php echo $this->style_is($text_notransform, 'notexttransform'); ?> " data-texttransform="notexttransform"><?php _e('×', 'themify'); ?> </button> </div> <!-- TEXT ALIGN --> <div class="themify_font_align themify-customizer-brick"> <button type="button" class="button <?php echo $this->style_is($font_align, 'left'); ?> " data-align="left"><span class="ti-align-left"></span></button> <button type="button" class="button <?php echo $this->style_is($font_align, 'center'); ?> " data-align="center"><span class="ti-align-center"></span></button> <button type="button" class="button <?php echo $this->style_is($font_align, 'right'); ?> " data-align="right"><span class="ti-align-right"></span></button> <button type="button" class="button <?php echo $this->style_is($font_align, 'justify'); ?> " data-align="justify"><span class="ti-align-justify"></span></button> <button type="button" class="button <?php echo $this->style_is($font_noalign, 'noalign'); ?> " data-align="noalign"><?php _e('×', 'themify'); ?> </button> </div> <?php }