Or, embed this snippet using GenerateWP WordPress Plugin.

Download

Clone

Upscribe Font Selection

class upscribe_font_select {

	public function __construct() {

		if ( is_admin() ) {
			add_action( 'load-post.php',     array( $this, 'init_metabox' ) );
			add_action( 'load-post-new.php', array( $this, 'init_metabox' ) );
		}

	}

	public function init_metabox() {

		add_action( 'add_meta_boxes',        array( $this, 'add_metabox' )         );
		add_action( 'save_post',             array( $this, 'save_metabox' ), 10, 2 );

	}

	public function add_metabox() {

		add_meta_box(
			'fontselect',
			__( 'Font Select', 'text_domain' ),
			array( $this, 'render_metabox' ),
			'upscribe-content',
			'advanced',
			'default'
		);

	}

	public function render_metabox( $post ) {

		// Retrieve an existing value from the database.
		$upscribe_font_select = get_post_meta( $post->ID, 'upscribe_font_select', true );
		$upscribe_font_size = get_post_meta( $post->ID, 'upscribe_font_size', true );

		// Set default values.
		if( empty( $upscribe_font_select ) ) $upscribe_font_select = '';
		if( empty( $upscribe_font_size ) ) $upscribe_font_size = '';

		// Form fields.
		echo '<table class="form-table">';

		echo '	<tr>';
		echo '		<th><label for="upscribe_font_select" class="upscribe_font_select_label">' . __( 'Choose a font', 'text_domain' ) . '</label></th>';
		echo '		<td>';
		echo '			<select id="upscribe_font_select" name="upscribe_font_select" class="upscribe_font_select_field">';
		echo '			<option value="upscribe_font_Roboto" ' . selected( $upscribe_font_select, 'upscribe_font_Roboto', false ) . '> ' . __( 'Roboto', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Open Sans" ' . selected( $upscribe_font_select, 'upscribe_font_Open Sans', false ) . '> ' . __( 'Open Sans', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Lato" ' . selected( $upscribe_font_select, 'upscribe_font_Lato', false ) . '> ' . __( 'Lato', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Noto Serif" ' . selected( $upscribe_font_select, 'upscribe_font_Noto Serif', false ) . '> ' . __( 'Noto Serif', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Ubuntu" ' . selected( $upscribe_font_select, 'upscribe_font_Ubuntu', false ) . '> ' . __( 'Ubuntu', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Fjalla One" ' . selected( $upscribe_font_select, 'upscribe_font_Fjalla One', false ) . '> ' . __( 'Fjalla One', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Domine" ' . selected( $upscribe_font_select, 'upscribe_font_Domine', false ) . '> ' . __( 'Domine', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Raleway" ' . selected( $upscribe_font_select, 'upscribe_font_Raleway', false ) . '> ' . __( 'Raleway', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Arvo" ' . selected( $upscribe_font_select, 'upscribe_font_Arvo', false ) . '> ' . __( 'Arvo', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_Oswald" ' . selected( $upscribe_font_select, 'upscribe_font_Oswald', false ) . '> ' . __( 'Oswald', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_" ' . selected( $upscribe_font_select, 'upscribe_font_', false ) . '> ' . __( '', 'text_domain' ) . '</option>';
		echo '			</select>';
		echo '			<p class="description">' . __( 'Select font', 'text_domain' ) . '</p>';
		echo '		</td>';
		echo '	</tr>';

		echo '	<tr>';
		echo '		<th><label for="upscribe_font_size" class="upscribe_font_size_label">' . __( 'Font Size', 'text_domain' ) . '</label></th>';
		echo '		<td>';
		echo '			<select id="upscribe_font_size" name="upscribe_font_size" class="upscribe_font_size_field">';
		echo '			<option value="upscribe_font_20px" ' . selected( $upscribe_font_size, 'upscribe_font_20px', false ) . '> ' . __( 'Extra Small', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_30px" ' . selected( $upscribe_font_size, 'upscribe_font_30px', false ) . '> ' . __( 'Small', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_40px" ' . selected( $upscribe_font_size, 'upscribe_font_40px', false ) . '> ' . __( 'Regular', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_50px" ' . selected( $upscribe_font_size, 'upscribe_font_50px', false ) . '> ' . __( 'Large', 'text_domain' ) . '</option>';
		echo '			<option value="upscribe_font_60px" ' . selected( $upscribe_font_size, 'upscribe_font_60px', false ) . '> ' . __( 'Extra Large', 'text_domain' ) . '</option>';
		echo '			</select>';
		echo '			<p class="description">' . __( 'Choose Font Size', 'text_domain' ) . '</p>';
		echo '		</td>';
		echo '	</tr>';

		echo '</table>';

	}

	public function save_metabox( $post_id, $post ) {

		// Sanitize user input.
		$upscribe_font_new_select = isset( $_POST[ 'upscribe_font_select' ] ) ? $_POST[ 'upscribe_font_select' ] : '';
		$upscribe_font_new_size = isset( $_POST[ 'upscribe_font_size' ] ) ? $_POST[ 'upscribe_font_size' ] : '';

		// Update the meta field in the database.
		update_post_meta( $post_id, 'upscribe_font_select', $upscribe_font_new_select );
		update_post_meta( $post_id, 'upscribe_font_size', $upscribe_font_new_size );

	}

}

new upscribe_font_select;