function ot_type_googlefont($args = array()) { /* turns arguments array into variables */ extract($args); /* format setting outer wrapper */ echo '<div class="format-setting type-typography">'; /* description */ echo $field_desc ? '<div class="description"><p>' . htmlspecialchars_decode($field_desc) . '</p></div>' : ''; /* format setting inner wrapper */ echo '<div class="format-setting-inner">'; /* allow fields to be filtered */ $ot_recognized_typography_fields = apply_filters('ot_recognized_typography_fields', array('font-color', 'font-family', 'font-id', 'font-style', 'font-variant', 'font-weight', 'font-subset', 'letter-spacing', 'text-decoration', 'text-transform'), $field_id); /* build font family */ if (in_array('font-family', $ot_recognized_typography_fields)) { $font_family = isset($field_value['font-family']) ? $field_value['font-family'] : ''; echo '<select name="' . esc_attr($field_name) . '[font-family]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-font-family" class="option-tree-ui-select hb-google-font-select' . esc_attr($field_class) . '">'; echo '<option value="">font-family</option>'; $current_font = NULL; foreach (hb_recognized_google_fonts($field_id) as $id => $font) { $key = preg_replace('/\\s+/', '', strtolower($font['family'])); $variants = implode(",", $font['variants']); $subsets = implode(",", $font['subsets']); if ($font_family == esc_attr($key)) { $current_font = $font['family']; } echo '<option data-fontid="' . $id . '" data-subsets="' . $subsets . '" data-variants="' . $variants . '" data-font="' . esc_attr($font['family']) . '" data-family="' . esc_attr($font['family']) . '" value="' . esc_attr($key) . '" ' . selected($font_family, $key, false) . '>' . esc_attr($font['family']) . '</option>'; } echo '</select>'; } /* hidden font id */ if (in_array('font-id', $ot_recognized_typography_fields)) { $font_id = isset($field_value['font-id']) ? esc_attr($field_value['font-id']) : ''; echo '<input type="hidden" name="' . esc_attr($field_name) . '[font-id]" id="' . esc_attr($field_id) . '-fontid" value="' . esc_attr($font_id) . '" autocomplete="off" />'; } /* build font subsets */ if (in_array('font-subset', $ot_recognized_typography_fields)) { $font_subset = isset($field_value['font-subset']) ? esc_attr($field_value['font-subset']) : ''; echo '<select name="' . esc_attr($field_name) . '[font-subset]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-font-subset" class="option-tree-ui-select hb-google-font-subset ' . esc_attr($field_class) . '">'; echo '<option value="">font-subset</option>'; foreach (ot_recognized_google_subsets($field_id) as $key => $value) { echo '<option value="' . esc_attr($key) . '" ' . selected($font_subset, $key, false) . '>' . esc_attr($value) . '</option>'; } echo '</select>'; } /* build font size */ if (in_array('font-size', $ot_recognized_typography_fields)) { $font_size = isset($field_value['font-size']) ? esc_attr($field_value['font-size']) : ''; echo '<select name="' . esc_attr($field_name) . '[font-size]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-font-size" class="option-tree-ui-select hb-google-font-size ' . esc_attr($field_class) . '">'; echo '<option value="">font-size</option>'; $current_font_size = '16px'; foreach (ot_recognized_font_sizes($field_id) as $option) { if ($font_size == $option) { $current_font_size = esc_attr($option); } echo '<option value="' . esc_attr($option) . '" ' . selected($font_size, $option, false) . '>' . esc_attr($option) . '</option>'; } echo '</select>'; } /* build font weight */ $current_weight = NULL; if (in_array('font-weight', $ot_recognized_typography_fields)) { $font_weight = isset($field_value['font-weight']) ? esc_attr($field_value['font-weight']) : ''; echo '<select name="' . esc_attr($field_name) . '[font-weight]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-font-weight" class="option-tree-ui-select hb-google-font-weight ' . esc_attr($field_class) . '">'; echo '<option value="">font-weight</option>'; foreach (ot_recognized_google_font_weights($field_id) as $key => $value) { if ($font_weight == $key) { $current_weight = esc_attr($key); } echo '<option value="' . esc_attr($key) . '" ' . selected($font_weight, $key, false) . '>' . esc_attr($value) . '</option>'; } echo '</select>'; } /* build line height */ if (in_array('line-height', $ot_recognized_typography_fields)) { $line_height = isset($field_value['line-height']) ? esc_attr($field_value['line-height']) : ''; echo '<select name="' . esc_attr($field_name) . '[line-height]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-line-height" class="option-tree-ui-select hb-google-line-height ' . esc_attr($field_class) . '">'; echo '<option value="">line-height</option>'; foreach (ot_recognized_line_heights($field_id) as $option) { echo '<option value="' . esc_attr($option) . '" ' . selected($line_height, $option, false) . '>' . esc_attr($option) . '</option>'; } echo '</select>'; } /* build font style */ $current_style = NULL; if (in_array('font-style', $ot_recognized_typography_fields)) { $font_style = isset($field_value['font-style']) ? esc_attr($field_value['font-style']) : ''; echo '<select name="' . esc_attr($field_name) . '[font-style]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-font-style" class="option-tree-ui-select hb-google-font-style ' . esc_attr($field_class) . '">'; echo '<option value="">font-style</option>'; foreach (ot_recognized_google_font_styles($field_id) as $key => $value) { if ($font_style == $key) { $current_style = esc_attr($key); } echo '<option value="' . esc_attr($key) . '" ' . selected($font_style, $key, false) . '>' . esc_attr($value) . '</option>'; } echo '</select>'; } /* build text transform */ if (in_array('text-transform', $ot_recognized_typography_fields)) { $text_transform = isset($field_value['text-transform']) ? esc_attr($field_value['text-transform']) : ''; echo '<select name="' . esc_attr($field_name) . '[text-transform]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-text-transform" class="option-tree-ui-select hb-google-text-transform ' . esc_attr($field_class) . '">'; echo '<option value="">text-transform</option>'; foreach (ot_recognized_text_transformations($field_id) as $key => $value) { echo '<option value="' . esc_attr($key) . '" ' . selected($text_transform, $key, false) . '>' . esc_attr($value) . '</option>'; } echo '</select>'; } /* build text decoration */ if (in_array('text-decoration', $ot_recognized_typography_fields)) { $text_decoration = isset($field_value['text-decoration']) ? esc_attr($field_value['text-decoration']) : ''; echo '<select name="' . esc_attr($field_name) . '[text-decoration]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-text-decoration" class="option-tree-ui-select hb-google-text-decoration ' . esc_attr($field_class) . '">'; echo '<option value="">text-decoration</option>'; foreach (ot_recognized_text_decorations($field_id) as $key => $value) { echo '<option value="' . esc_attr($key) . '" ' . selected($text_decoration, $key, false) . '>' . esc_attr($value) . '</option>'; } echo '</select>'; } /* build letter spacing */ if (in_array('letter-spacing', $ot_recognized_typography_fields)) { $letter_spacing = isset($field_value['letter-spacing']) ? esc_attr($field_value['letter-spacing']) : ''; echo '<select name="' . esc_attr($field_name) . '[letter-spacing]" data-group="' . esc_attr($field_id) . '" id="' . esc_attr($field_id) . '-letter-spacing" class="option-tree-ui-select hb-google-letter-spacing ' . esc_attr($field_class) . '">'; echo '<option value="">letter-spacing</option>'; foreach (ot_recognized_letter_spacing($field_id) as $key => $value) { echo '<option value="' . esc_attr($key) . '" ' . selected($letter_spacing, $key, false) . '>' . esc_attr($value) . '</option>'; } echo '</select>'; } /* build preview window */ if (!empty($current_font)) { echo '<link id="hb-google-style-link-' . esc_attr($field_id) . '" rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=' . $current_font . ':' . $current_weight . $current_style . '">'; } else { echo '<link id="hb-google-style-link-' . esc_attr($field_id) . '" rel="stylesheet" type="text/css" href="">'; } $font_preview_style = NULL; if (!empty($field_value['font-family'])) { // $font_preview_style = '#hb-google-preview-' . esc_attr( $field_id ) . ' { font-size: '.$current_font_size.'; font-family: "'.$field_value['font-family'].'" !important; }'; $font_preview_style = '#hb-google-preview-' . esc_attr($field_id) . ' { font-family: "' . $field_value['font-family'] . '" !important; }'; } echo '<style id="hb-google-style-' . esc_attr($field_id) . '" type="text/css">' . $font_preview_style . '</style>'; echo '<div id="hb-google-preview-' . esc_attr($field_id) . '" class="hb-google-font-preview clearfix">'; $lorem = 'Grumpy wizards make toxic brew for the evil Queen and Jack.'; _e(apply_filters('hb_font_preview_text', $lorem, $field_id), HB_DOMAIN_TXT); echo '</div>'; echo '</div>'; echo '</div>'; }
/** * Enqueue scripts and styles. * * @since Swiss Design Group 1.0 */ function SDG_scripts() { global $detect; $tablet = $detect->isTablet(); $mobile = $detect->isMobile(); $chrome = preg_match("/chrome/", strtolower($_SERVER['HTTP_USER_AGENT'])); $minify = '.min'; // Add custom fonts switch (ot_get_option('site_fonts_type')) { case 'typekit': add_action('wp_head', 'SDG_print_typekit', 99); break; case 'google-fonts': /* available google fonts */ $google_fonts = hb_recognized_google_fonts(); /* custom array of all affected option tree options */ $option_keys = array('body' => ot_get_option('body_typo'), 'alt' => ot_get_option('headlines_typo')); $option_keys['body']['font-weight'] = '400'; if ('italic' == $option_keys['alt']['font-weight']) { $option_keys['alt']['font-weight'] = '400italic'; } if ('regular' == $option_keys['alt']['font-weight']) { $option_keys['alt']['font-weight'] = '400'; } $fonts = array('body' => array('id' => '', 'family' => '', 'font-family' => '', 'weight' => array('300', '300italic', '400italic', '700', '700italic')), 'alt' => array('id' => '', 'family' => '', 'font-family' => '', 'weight' => array())); /* create query string */ foreach ($option_keys as $key => $option) { if (isset($option['font-id']) && !empty($google_fonts[$option['font-id']])) { /* replace whitespace with + */ $family = preg_replace("/\\s+/", '+', $google_fonts[$option['font-id']]['family']); $fonts[$key]['id'] = $option['font-id']; $fonts[$key]['family'] = $family; $fonts[$key]['font-family'] = $google_fonts[$option['font-id']]['family']; $fonts[$key]['weight'][] = $option['font-weight']; $fonts[$key]['weight'] = array_unique($fonts[$key]['weight']); $fonts[$key]['weight'] = implode(',', $fonts[$key]['weight']); } } if (empty($fonts['body']['font-family'])) { $fonts['body']['family'] = 'Inconsolata'; $fonts['body']['font-family'] = 'Inconsolata'; $fonts['body']['weight'] = '400,700'; } if (empty($fonts['alt']['font-family'])) { $fonts['alt']['family'] = 'Montserrat'; $fonts['alt']['font-family'] = 'Montserrat'; $fonts['alt']['weight'] = '700'; } $alt_fint_style = 'normal'; $alt_font_weight = !empty($option_keys['alt']['font-weight']) ? $option_keys['alt']['font-weight'] : '700'; if (strpos($alt_font_weight, 'italic')) { $alt_font_weight = str_replace('italic', '', $alt_font_weight); $alt_fint_style = 'italic'; } $css = ""; $css .= "h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{"; $css .= "font-family:'" . $fonts['alt']['font-family'] . "',sans-serif;"; $css .= "font-weight:" . $alt_font_weight . ";"; $css .= "font-style:" . $alt_fint_style . ";"; if (!empty($option_keys['alt']['text-transform'])) { $css .= "text-transform:" . $option_keys['alt']['text-transform'] . ";"; } if (!empty($option_keys['alt']['text-decoration'])) { $css .= "text-decoration:" . $option_keys['alt']['text-decoration'] . ";"; } if (!empty($option_keys['alt']['letter-spacing'])) { $css .= "letter-spacing:" . $option_keys['alt']['letter-spacing'] . ";"; } $css .= "}"; $css .= "body{font-family: '" . $fonts['body']['font-family'] . "',sans-serif}"; $font_url = SDG_get_google_font_url($fonts); wp_enqueue_style('SDG-google-fonts', $font_url, array('SDG-style'), null); wp_add_inline_style('SDG-google-fonts', $css); break; default: $fonts = array('alt' => array('family' => 'Montserrat', 'weight' => '700'), 'body' => array('family' => 'Inconsolata', 'weight' => '400,700')); $css = "h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{font-family:'" . $fonts['alt']['family'] . "',sans-serif;}"; $css .= "body{font-family: '" . $fonts['body']['family'] . "',sans-serif}"; $font_url = SDG_get_google_font_url($fonts); wp_enqueue_style('SDG-google-fonts', $font_url, array('SDG-style'), null); wp_add_inline_style('SDG-google-fonts', $css); break; } // Load our main stylesheet. wp_enqueue_style('SDG-style', get_stylesheet_uri(), array()); // Load the Internet Explorer specific stylesheet. wp_enqueue_style('SDG-ie', get_template_directory_uri() . '/css/ie.css', array('SDG-style'), '20141010'); wp_style_add_data('SDG-ie', 'conditional', 'lt IE 9'); // Load the Internet Explorer 7 specific stylesheet. wp_enqueue_style('SDG-ie7', get_template_directory_uri() . '/css/ie7.css', array('SDG-style'), '20141010'); wp_style_add_data('SDG-ie7', 'conditional', 'lt IE 8'); if (!wp_script_is('jquery-cookie')) { wp_enqueue_script('jquery-cookie', get_template_directory_uri() . '/js/jquery.cookie.min.js', array(), '1.4.1', true); } if (is_singular() && wp_attachment_is_image()) { wp_enqueue_script('SDG-keyboard-image-navigation', get_template_directory_uri() . '/js/keyboard-image-navigation.js', array('jquery'), '20141010'); } wp_enqueue_script('SDG-script', get_template_directory_uri() . '/js/functions.js', array('jquery'), '1.0', true); wp_localize_script('SDG-script', 'detect', array('ajaxurl' => esc_url(admin_url('admin-ajax.php')), 'nonce' => wp_create_nonce('hb-ajax'), 'mobile' => $detect->isMobile(), 'tablet' => $detect->isTablet(), 'chrome' => $chrome, 'body_classes' => esc_js(join(' ', get_body_class())), 'all' => __('All', HB_DOMAIN_TXT))); if ($chrome && !$mobile && !$tablet) { wp_enqueue_script('smooth-scroll', HB_THEME_URL . '/js/SmoothScroll.min.js', array('jquery'), '1.2.1', true); } }