気になったことはなんでも調べてメモするブログ
  1. WordPress
  2. 95 view

【TCD-ZERO】記事のタイトルをh1見出しにする

SEOについて調べていた時、「h1見出しは記事のタイトルであるべき!」という情報をよく目にしました。
そこで、愛用しているテーマ「ZERO」をカスタマイズすることにしました。

テーマファイルを編集すると、テーマが更新された際の対応がややこしくなるので基本的にはやらない方がいいです。
gitなどを利用して差分を管理できる状態でチャレンジするとよいでしょう。

「ZERO」は記事タイトルがh1ではない

「ZERO」はTCDが開発・配布しているWordPressテーマです。

私がテーマ選びをしていた数年前は、「TCDのテーマは記事のタイトルがh1じゃないからイマイチ」と評されていることが多かったように思います(最近は調べていないので現在の評価はわかりません)
確かに、SEOに必須と言われている要素を備えていないテーマは選択肢にはなりません。

しかし私は「ZERO」が気に入っていたので、ちょいとカスタマイズして使うことにしました。

h1見出しの使い所を変更する方法

下記の位置を変更すれば、記事のタイトルをh1見出しにできます。
(テーマファイルのバージョンによって行数が多少異なるかもしれません。ご注意ください)

(1) header.phpを編集

サイトのキャッチフレーズを囲むタグをh1からdivに変更しちゃいます。

<div id="container">

 <div id="header_top">
  <div id="header_top_inner">
   <?php if($options['show_tagline'] == 1){ ?><div id="site_desc" style="font-size:<?php echo esc_html($options['tagline_font_size']); ?>px;"><?php echo esc_html(get_bloginfo('description')); ?></div><?php }; ?>

(2) single.phpを編集

記事のタイトルをh2からh1に変更しちゃいます。

   <article id="article">

    <?php if ( $options['show_category'] || $options['show_view'] ){ ?>
    <ol class="clearfix item_cat_id_<?php echo show_category_id(); ?>" id="post_meta_top">
     <?php if ( $options['show_category'] ){ ?><li class="category"><?php echo show_parent_category(); ?></li><?php }; ?>
     <?php if ( $options['show_view'] ){ ?><li class="view"><?php the_post_views(); ?> view</li><?php }; ?>
    </ol>
    <?php }; ?>

    <h1 id="post_title" class="rich_font"><?php the_title(); ?></h1>

    <?php if($page == '1') { ?>

(3) functions/logo.phpを編集

記事ページ以外ではサイト名がh1になるように変更しちゃいます。

<div id="logo_image">
  <?php if( is_singular() ) : ?><div class="logo"><?php else: ?><h1 class="logo"><?php endif; ?>
  <a href="<?php echo esc_url($url); ?>/" title="<?php echo esc_attr($title); ?>">
   <?php if(!empty($logo_image)) { ?>
   <img class="pc_logo_image" src="<?php echo esc_attr($logo_image[0]); ?>?<?php echo esc_attr(time()); ?>" alt="<?php echo esc_attr($title); ?>" title="<?php echo esc_attr($title); ?>" width="<?php echo esc_attr($pc_image_width); ?>" height="<?php echo esc_attr($pc_image_height); ?>" />
   <?php }; ?>
   <?php if(!empty($logo_image_mobile)) { ?>
   <img class="mobile_logo_image" src="<?php echo esc_attr($logo_image_mobile[0]); ?>?<?php echo esc_attr(time()); ?>" alt="<?php echo esc_attr($title); ?>" title="<?php echo esc_attr($title); ?>" width="<?php echo esc_attr($mobile_image_width); ?>" height="<?php echo esc_attr($mobile_image_height); ?>" />
   <?php } elseif(!empty($logo_image)) { // モバイル専用の画像が無い場合はPC用の画像を表示 ?>
   <img class="mobile_logo_image" src="<?php echo esc_attr($logo_image[0]); ?>?<?php echo esc_attr(time()); ?>" alt="<?php echo esc_attr($title); ?>" title="<?php echo esc_attr($title); ?>" width="<?php echo esc_attr($pc_image_width); ?>" height="<?php echo esc_attr($pc_image_height); ?>" />
   <?php }; ?>
  </a>
  <?php if( is_singular() ) : ?></div><?php else: ?></h1><?php endif; ?>
</div>
<?php } else { ?>
<div id="logo_text">
  <?php if( is_singular() ) : ?><div class="logo"><?php else: ?><h1 class="logo"><?php endif; ?>
   <a href="<?php echo esc_url($url); ?>/"><?php echo esc_html($title); ?></a>
  <?php if( is_singular() ) : ?></div><?php else: ?></h1><?php endif; ?>
</div>

以上で、記事のタイトルがh1見出しで表示されるようになるはずです。




WordPressの最近記事

  1. 【TCD-ZERO】記事のタイトルをh1見出しにする

  2. 【TCD-ZERO】記事抜粋した末尾に「…」が表示されないようにする

  3. 【TCD-ZERO】記事一覧で (さらに&hellip;) と表示されてしまう問題を解決す…

  4. All In One WP Securityの初期設定で気を付けるポイント

  5. WordPressテーマを自作しよう(8)トップページと記事ページで別のものを表示する

関連記事

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

PAGE TOP