WordPressテーマフレームワーク「Beans」で投稿の更新日を表示させる方法

Beansは構造化データマークアップ(schema.org)されたWordpressテーマフレームワークの一つです。

構造化データマークアップされていることでGoogle検索結果での表示が最適化(リッチスニペット)され、サイトへの流入の促進、SEO対策にも期待できます。

ただ必ずしもリッチスニペットとして表示されるとは限らないようで、条件も年々厳しくなっているようです。


https://www.suzukikenichi.com/blog/three-criteria-for-rich-snippets/

ちなみにこのサイトで正しく実装されているかどうかチェック出来ます!

構造化データテストツール
https://search.google.com/structured-data/testing-tool

構造化データマークアップの必須・推奨プロパティが決められており、

  • author(必須)
  • headline(必須)
  • imegsのheight、width(必須)
  • publisher(必須)
  • mainEntityOfPage、@id(推奨)
  • dateModified(推奨)

が必須、推奨項目となっています。

BeansはデフォルトではdateModified(更新日)が設置されていなかったのでその実装方法を紹介します。

編集するファイルは全部で2つ

テーマフォルダの中の下記のディレクトリに移動します。

tm-beans/lib/templates/fragments

その中で編集するファイルは以下の2つです。

  1. post-shortcodes.php
  2. post.php

post-shortcodes.php

以下のコードをpost-shortcodes.phpの一番下にペースト

beans_add_smart_action( 'beans_post_meta_dateModified', 'beans_post_meta_dateModified_shortcode' );

/**
 * Echo post meta date shortcode.
 *
 * @since 1.0.0
 */
function beans_post_meta_dateModified_shortcode() {

    echo beans_output( 'beans_post_meta_dateModified_prefix', __( '<i class="uk-icon-refresh"></i>' . ' ', 'tm-beans' ) );

    echo beans_open_markup( 'beans_post_meta_dateModified', 'time', array(
        'datetime' => get_the_modified_date( 'c' ),
        'itemprop' => 'dateModified',
    ) );

    the_modified_date('Y/m/d', '<div class="the-modified-date">', '</div>'); // またはY/n/j

    echo beans_close_markup( 'beans_post_meta_dateModified', 'time' );

}

post.php

98行目あたりにあるfunction beans_post_meta()の中の

$meta_items = apply_filters( 'beans_post_meta_items', array(
  'date'     => 10,
  'author'   => 20,
  'comments' => 30,
) );

の部分に以下を追加します。

$meta_items = apply_filters( 'beans_post_meta_items', array(
  'date'     => 10, // 作成日
  'author'   => 20, // 投稿者
  'comments' => 30, // コメント
  'dateModified' => 40, // 更新日
) );

順番を変えたい時はお好みで!