Beginnings of the theme options panel.

admin/css/admin-style.css

@@ -2,6 +2,11 @@
 /* OptionsFramework Admin Styles */
 /*-------------------------------------------------------------------------------------------*/
 
+/* 320press branding */
+#options_ico{
+	background: url('../images/320press-Logo-BW.png') no-repeat left top transparent;
+}
+
 .updated {
 	max-width:764px;
 	margin-bottom:0px !important;

admin/options-framework.php

@@ -211,7 +211,9 @@ function optionsframework_page() {
 	?>
 
 	<div class="wrap">
-    <?php screen_icon( 'themes' ); ?>
+	<div class="icon32" id="options_ico"><br /></div>
+    <?php //screen_icon( 'themes' ); 
+    ?>
     <h2 class="nav-tab-wrapper">
         <?php echo $return[1]; ?>
     </h2>

admin/options-interface.php

@@ -218,6 +218,37 @@ function optionsframework_fields() {
 
 		break;
 
+		// WPBS Typography - removed font size from std typography set of fields
+				case 'wpbs_typography':	
+
+					$wpbs_typography_stored = $val;
+
+					// Font Face
+					$output .= '<select class="of-typography of-typography-face" name="' . esc_attr( $option_name . '[' . $value['id'] . '][face]' ) . '" id="' . esc_attr( $value['id'] . '_face' ) . '">';
+
+					$faces = of_recognized_font_faces();
+					foreach ( $faces as $key => $face ) {
+						$output .= '<option value="' . esc_attr( $key ) . '" ' . selected( $wpbs_typography_stored['face'], $key, false ) . '>' . esc_html( $face ) . '</option>';
+					}			
+
+					$output .= '</select>';	
+
+					// Font Weight
+					$output .= '<select class="of-typography of-typography-style" name="'.$option_name.'['.$value['id'].'][style]" id="'. $value['id'].'_style">';
+
+					/* Font Style */
+					$styles = of_recognized_font_styles();
+					foreach ( $styles as $key => $style ) {
+						$output .= '<option value="' . esc_attr( $key ) . '" ' . selected( $wpbs_typography_stored['style'], $key, false ) . '>'. $style .'</option>';
+					}
+					$output .= '</select>';
+
+					// Font Color		
+					$output .= '<div id="' . esc_attr( $value['id'] ) . '_color_picker" class="colorSelector"><div style="' . esc_attr( 'background-color:' . $wpbs_typography_stored['color'] ) . '"></div></div>';
+					$output .= '<input class="of-color of-typography of-typography-color" name="' . esc_attr( $option_name . '[' . $value['id'] . '][color]' ) . '" id="' . esc_attr( $value['id'] . '_color' ) . '" type="text" value="' . esc_attr( $wpbs_typography_stored['color'] ) . '" />';
+
+				break;
+
 		// Background
 		case 'background':
 

admin/options-sanitize.php

@@ -175,6 +175,21 @@ function of_sanitize_typography( $input ) {
 }
 add_filter( 'of_sanitize_typography', 'of_sanitize_typography' );
 
+function of_sanitize_wpbs_typography( $input ) {
+	$output = wp_parse_args( $input, array(
+		'face'  => '',
+		'style' => '',
+		'color' => ''
+	) );
+
+	$output['face']  = apply_filters( 'of_font_face', $output['face'] );
+	$output['style'] = apply_filters( 'of_font_style', $output['style'] );
+	$output['color'] = apply_filters( 'of_color', $output['color'] );
+
+	return $output;
+}
+add_filter( 'of_sanitize_wpbs_typography', 'of_sanitize_wpbs_typography' );
+
 
 function of_sanitize_font_size( $value ) {
 	$recognized = of_recognized_font_sizes();
@@ -302,6 +317,7 @@ function of_recognized_font_sizes() {
  */
 function of_recognized_font_faces() {
 	$default = array(
+		'"Helvetica Neue",Helvetica,Arial,sans-serif'   => 'Default',
 		'arial'     => 'Arial',
 		'verdana'   => 'Verdana, Geneva',
 		'trebuchet' => 'Trebuchet',

header.php

@@ -41,6 +41,35 @@
 		<link rel="stylesheet" href="<?php echo get_template_directory_uri(); ?>/bootstrap.min.css">
 		<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>">
 
+		<!-- bring in theme options styles -->
+		<?php 
+		$heading_typography = of_get_option('heading_typography');
+		if ($heading_typography) {
+			$theme_options_styles = 'h1, h2, h3, h4, h5, h6{ 
+									font-family: ' . $heading_typography['face'] . '; 
+									font-weight: ' . $heading_typography['style'] . '; 
+									color: ' . $heading_typography['color'] . '; 
+									}';
+		}
+
+		$main_body_typography = of_get_option('main_body_typography');
+		if ($main_body_typography) {
+			$theme_options_styles .= 'body{ 
+									font-family: ' . $main_body_typography['face'] . '; 
+									font-weight: ' . $main_body_typography['style'] . '; 
+									color: ' . $main_body_typography['color'] . '; 
+									}';
+		}
+		?>
+
+		<?php
+
+		if($theme_options_styles){
+			echo '<style>' . $theme_options_styles . '</style>';
+		}
+
+		?>
+
 	</head>
 
 	<body <?php body_class(); ?>>

options.php

@@ -62,8 +62,20 @@ function optionsframework_options() {
 
 	$options = array();
 
-	$options[] = array( "name" => "Basic Settings",
+	$options[] = array( "name" => "Typography",
 						"type" => "heading");
+
+	$options[] = array( "name" => "Headings",
+						"desc" => "Used in H1, H2, H3, H4, H5 & H6 tags.",
+						"id" => "heading_typography",
+						"std" => array('face' => '"Helvetica Neue",Helvetica,Arial,sans-serif','style' => 'bold italic','color' => '#123456'),
+						"type" => "wpbs_typography");
+
+	$options[] = array( "name" => "Main Body Text",
+						"desc" => "Used in P tags.",
+						"id" => "main_body_typography",
+						"std" => array('face' => '"Helvetica Neue",Helvetica,Arial,sans-serif','style' => 'bold italic','color' => '#123456'),
+						"type" => "wpbs_typography");
 
 	$options[] = array( "name" => "Input Text Mini",
 						"desc" => "A mini text input field.",
@@ -128,7 +140,7 @@ function optionsframework_options() {
 						"std" => "1",
 						"type" => "checkbox");
 
-	$options[] = array( "name" => "Advanced Settings",
+	$options[] = array( "name" => "Top Nav",
 						"type" => "heading");
 
 	$options[] = array( "name" => "Check to Show a Hidden Text Input",