Twenty Sixteen child theme with enhanced customizer options

I started with Twenty Sixteen and embarked on my latest child theme project. Along the way discovered a lot of great things that can be done with a child theme given a bit of research and some creative effort.

Site branding (Titles and tagline)

I can never make up my mind about how I want my site branding to appear. I like the Twenty Sixteen default, with the site title and tagline to the left and the menu to the right, but I also like everything centered. Astrid, one of the themes that I liked from the WordPress theme repository, has a customizer the allows for switching between inline and centered menu styles as well as a choice between a sticky and a static menu. I don’t care for sticky menus because I think they take up too much view-able area, but I like the ability to switch between inline and centered styles, so I incorporated that into my customizer. Astrid also gave me the idea of keeping all of my customizer code in a separate file, which ended up making my life a lot easier when I stumbled upon Kirki. Now I have one file that’s used when Kirki is active and the other is used when it’s not.

	//___Branding and Menu Style___//
	$wp_customize->add_setting( 'menu_style', array(
		'default'           => 'inline',
		'sanitize_callback' => 'va_sanitize_menu_style',
		'transport'         => 'refresh'
	) );
	$wp_customize->add_control( 'menu_style', array(
		'type'      => 'radio',
		'priority'  => 20,
		'label'     => __('Site Branding and Menu Alignment', 'vanangeles'),
		'section'   => 'title_tagline',
		'choices'   => array(
                	'inline'     => __('Inline', 'vanangeles'),
                	'centered'   => __('Centered', 'vanangeles'),
	)  );

All this does is set up the branding style control in the customizer; to get the control to actually make the change requires some additional code, which will be discussed later (see Hiding the Twenty Sixteen border).

Note that I didn’t have to set up a panel or section because I’m placing the control in the title_tagline section, which already exists. If it didn’t, or if I wanted to place the control in its own custom panel I’d have to set up a panel, a section within the panel, a setting within the section, and finally the control within the setting before it would be visible in the customizer.

Site Branding section of the theme customizer
Site branding options in the theme customizer

There’s a lot going on with just this section. In addition to the choice between “inline” and centered style for the branding and menu, the user can choose to display a logo, set the site title and tagline, show or hide the site title and tagline, and choose a site icon or favicon. Here are the variations for the branding:

  • Default: Site title and tagline only
  • Logo only
  • Logo with site title and tagline
  • No logo, no site title and no tagline (for absolutely no functional purpose whatsoever)

In any case, even if the last option is chosen the site title and description are still visible to search engines – the effect of each of the four options on SEO is virtually identical thanks to Twenty Sixteen’s design.

Author: Galen

Combining a lifelong passion for photography with an ever growing fascination with the properties of light, Galen specializes in portrait, fashion, and fine art photography with the goal of producing dynamic, quality images through focused effort and attention to detail.

Leave a Reply

Your email address will not be published. Required fields are marked *