Hook for default_font_weight

[Kevin Provance]

@steve231293 suggested this in #1227 @steve231293

Not impossible. Might take me a day or so. I'll post back when I have something.

[Kevin Provance]

Instead of a hook, I added an argument for the typography field, weights. It takes a key pair. Consider the example below.

array(
	'id'                => 'opt-typography-body',
	'type'              => 'typography',
	'title'             => esc_html__( 'Body Font', 'your-textdomain-here' ),
	'subtitle'          => esc_html__( 'Specify the body font properties.', 'your-textdomain-here' ),
	'google'            => true,
	'font_family_clear' => false,
	'default'           => array(
		'color'       => '#dd9933',
		'font-size'   => '30px',
		'font-family' => 'Arial, Helvetica, sans-serif',
		'font-weight' => 'Normal',
	),
	'output'            => array( 'p' ),
	'weights' => array(
		'400'       => 'Normal 400',
		'800'       => 'Bold 800',
		'400italic' => 'Normal 400 Italic',
		'800italic' => 'Bold 800 Italic',
	),
),

[Steve Nguyen]

Hello @kprovance,
Yes thank for your work.

I recommended you a better way to implement this:

$opt_name = 'sample_options';

add_filter( "redux/{$opt_name}/field/typography/custom_fonts", 'child_theme_add_custom_fonts_for_redux');

function child_theme_add_custom_fonts_for_redux($fonts) {
	$custom_fonts = array(
		'Custom Fonts' => [
			// Check if value is string fallback to 400, 400italic, 700, 700italic or fallback to weights args as you said.
			'Butler'          => 'Butler, sans-serif',

			// New custom font with as array with defined variants.
			'CerebriSans'     => array(
				'stack' => 'CerebriSans, sans-serif',
				'variants' => array(
					'400',
					'800',
					'400italic',
					'800italic',
				)
			),
			'ClashGrotesk'    => array(
				'stack' => 'ClashGrotesk, sans-serif',
				'variants' => array(
					'400',
					'500',
					'600',
					'700',
					'400italic',
					'500italic',
					'600italic',
					'700italic',
				)
			),
		],
	);

	return array_merge( $fonts, $custom_fonts );
}

Then you can pass them to javascript and to show properly weights for selected custom font.

[Kevin Provance]

Here's the problem. that filter you're using was designed for our custom fonts extension (which will eventually be part of Redux). It taps into the core typography field with the current key pair format that Redux uses. The changes you want would require a substantial rewrite of the field. Factor in ensuring backward compatibility, so no one's site breaks, the time to laboriously test such a thing, and the fact that my time for Redux maintenance is limited, it's not an investment I can make at this time.

That said, you could easily take the existing code and add what you want for this functionality into an extension, would you'd load via your theme. You'd have to call the field something other than typography. For more information and a boilerplate to create an extension, see this article: https://devs.redux.io/guides/basics/using-extensions.html#creating-a-custom-extension

Good luck.

[Steve Nguyen]

Thank you for your information.