Twenty Fourteen - Child08

サイドバーに表示されるウィジェットのタイトルタグで<h2>タグを<div>タグに変更する方法

Twenty Fourteen - Child08

Pocket

ウィジェットのタイトルタグは<h2>タグである必要がない

Twenty Fourteenのウィジェットのタイトルタグは<h2>タグで出力されます。SEO的にみても<h2>タグだと都合が悪いと思われるので<p>タグに変更します。

ウィジェットのタイトルタグは functions.php で指定されています

wp-content > theme > twentyfourteen > functions.php の170行目以降でウィジェットの設定が記載されています。

/**
 * Register three Twenty Fourteen widget areas.
 *
 * @since Twenty Fourteen 1.0
 *
 * @return void
 */
function twentyfourteen_widgets_init() {
	require get_template_directory() . '/inc/widgets.php';
	register_widget( 'Twenty_Fourteen_Ephemera_Widget' );

	register_sidebar( array(
		'name'          => __( 'Primary Sidebar', 'twentyfourteen' ),
		'id'            => 'sidebar-1',
		'description'   => __( 'Main sidebar that appears on the left.', 'twentyfourteen' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<h1 class="widget-title">',
		'after_title'   => '</h1>',
	) );
	register_sidebar( array(
		'name'          => __( 'Content Sidebar', 'twentyfourteen' ),
		'id'            => 'sidebar-2',
		'description'   => __( 'Additional sidebar that appears on the right.', 'twentyfourteen' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<h1 class="widget-title">',
		'after_title'   => '</h1>',
	) );
	register_sidebar( array(
		'name'          => __( 'Footer Widget Area', 'twentyfourteen' ),
		'id'            => 'sidebar-3',
		'description'   => __( 'Appears in the footer section of the site.', 'twentyfourteen' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<h1 class="widget-title">',
		'after_title'   => '</h1>',
	) );
}
add_action( 'widgets_init', 'twentyfourteen_widgets_init' );

子テーマの functions.php を編集する

wp-content > theme > 子テーマのフォルダ > functions.php に下記コードを追記します。

<?php
if ( ! function_exists( 'child_theme_setup' ) ):
function child_theme_setup() {
    remove_action( 'widgets_init', 'twentyfourteen_widgets_init' );
    add_action( 'widgets_init', 'twentyfourteen_widgets_init_child' );
}
endif;

add_action( 'after_setup_theme', 'child_theme_setup' );

function twentyfourteen_widgets_init_child() {
	require get_template_directory() . '/inc/widgets.php';
	register_widget( 'Twenty_Fourteen_Ephemera_Widget' );

	register_sidebar( array(
		'name'          => __( 'Primary Sidebar', 'twentyfourteen' ),
		'id'            => 'sidebar-1',
		'description'   => __( 'Main sidebar that appears on the left.', 'twentyfourteen' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<p class="widget-title">',
		'after_title'   => '</p>',
	) );
	register_sidebar( array(
		'name'          => __( 'Content Sidebar', 'twentyfourteen' ),
		'id'            => 'sidebar-2',
		'description'   => __( 'Additional sidebar that appears on the right.', 'twentyfourteen' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<p class="widget-title">',
		'after_title'   => '</p>',
	) );
	register_sidebar( array(
		'name'          => __( 'Footer Widget Area', 'twentyfourteen' ),
		'id'            => 'sidebar-3',
		'description'   => __( 'Appears in the footer section of the site.', 'twentyfourteen' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget'  => '</aside>',
		'before_title'  => '<p class="widget-title">',
		'after_title'   => '</p>',
	) );
}

functions.phpは他のテンプレートファイルと異なり子テーマのファイルが親テーマのファイルを上書きしてくれません。親テーマのfunctions.phpの定義を読み込んだ後に子テーマの定義を追加して読み込んでいきます。そのため上記のコードは、Twenty Fourteenのfunctions.phpに記載されているtwentyfourteen_widgets_initという定義を削除して、新しい定義を読み込ませます。

以上の設定によりサイドバーのウィジェットのタイトルは<p>タグに変更になりました。