2ミクロデータのためのリッチスニペットテストツールを固定

以上 2 years ago I pub­lished an art­icle on how to fix prob­lems with Word­Press themes which did­n’t pass the Google Rich Snip­pets Test­ing Tool. それ以来、多くが変更されました - ワードプレスとほとんどのテーマは、より良いサポートがある, HTML5とCSS3が到着しました, とGoogle, Yahoo and Bing got togeth­er and decided to focus on Microdata, schema.org経由. 一度マイクロフォーマットは、ページをマークアップするための最も簡単な方法のように見えた, およびテストツールは、これらのための最も包括的なサポートを持っていた. ミクロデータに移動し、WordPressへの変更は、新しい記事を必要と: これがそうだ!

代わりに、私はすべての情報を提供しようとすることを決定したさまざまなテーマごとに個別の記事の多くを持っていることの 1 ガイド. This makes it easi­er to keep up to date, だけが存在することを意味し 1 すべての要求と議論の中心点. It also makes more sense as sev­er­al of the steps are the same regard­less of what theme you are using. I’m not going to cov­er all the option­al extras in this art­icle, ただ基本的なツールを使用してサイトを検証するために取得する. あなたが見つける必要があることを管理したら、余分なマークアップを追加することは比較的容易である. そう始めることができます...

Add a link from your google profile to your site

あなたは上の表示されます 私のGoogle のプロファイル 私は公衆のリンクを持っている https://diymediahome.org - あなたがあなた自身のサイトのための同じをする必要があります. 理想的にはこれと同じ方法で、あなたのサイトにリンクされているGoogleプロフィールを持っている、あなたの著者のすべてが必要になります.

1. にログインしてください Googleのプロファイル
2. あなたが表示されるまでスクロール リンク どこかにページの右下に向けてのセクション
3. をクリックします 編集 リンク
4. 下 con­trib­ut­or to セクションをクリック お客トムリンクを追加
5. テキストの右側のボックスを確認してください con­trib­ut­or to に設定されています 公共
6. あなたのサイト名を入力してください (e.g. DIY メディアホーム) およびアドレス (e.g. https://diymediahome.org)
7. [保存]をクリックします

あなたのサイトからGoogleプロフィールへのリンクを追加

今、私たちは、Googleプロフィールにあなたの著者ページからリンクを追加する必要があります. あり 2 これを行うにはALTERN-AT-IVEの方法, 私は非常にヨーストを使用して推奨つくろう この プラグイン.

1. インストール ヨースト この PLU-GIN または あなたのテーマのfunctions.phpのファイルに次のコードを追加します

   機能update_contactmethods( $contactmethods ) {
   // Add Google Profiles
   $contactmethods['googleplus'] = 'Google の';
   // Add Twitter
   $contactmethods[「ツイッター」] = _( 「Twitterのユーザー名 (@なしで)', 「Wordpressの -  SEO」 );
   
   返す$ contactmethods;
   }
   ADD_FILTER( 'user_contactmethods', 'update_contactmethods', 10, 1);

2. WordPressの管理画面で、あなたの著者プロフィールに行く (hov­er over ユーザー 左側のメニューで, 、をクリックして下さい あなたのプロファイル)
3. で Google+の フィールドには、Googleのプロファイルへのリンクを追加 (e.g. https://plus.google.com/104657888470728381512 /)
4. もしどちらかを確認してください, or your oth­er site authors do the same thing, 自分のGoogleプロフィールへの各リンク
5. 今, あなたはヨーストPLU-GINを使用している場合, に行く この メニューを選択 タイトルやメタ情報, C言語でなめる Home ページの上部にあるとのメニュー 高光INGのオーサリング プルダウンボックスでは、ホームページの作成者として使用したいユーザーを選択
6. あなたが手動header.phpのために、次のコードを追加する必要がありますヨーストプラグインを使用していない約執拗なら (仮定して、1つを持っている). Don’t for­get to change my google pro­file url to yours. This code will use the post author’s google pro­file url if there is a val­id one, およびデフォルトを使用します (あなた) 存在しない場合.

   <リンクREL ="著者" HREF ="<?PHPの$のジープラス= 'HTTPS://plus.google.com/115369062315673853712/posts '; もし ( is_singular() ) {グローバル$ポスト; $ジープラス= get_the_author_meta( 'googleplus', $ポスト>post_author );} エコーの$ジープラス; ?>"/>

Fix errors of a missing “updated” field

ほとんどのWordpressのテーマは、ポストは、ポスト情報エリアに掲載された際の情報が含まれ, それが最後に更新されたときには非常に少数にも含まれ. これは残念です, because updated is required where­as pub­lished actu­ally isn’t! それを追加することも簡単です, そして再び, がある 2 方法, the prop­er way and the quick hack way. I recom­mend the prop­er way of course, しかし、必要に応じて迅速なハックに頼ることができます. また、同時にマイクロフォーマットからミクロに変更しようとしている.

適切な方法

We’re going to add some addi­tion­al inform­a­tion to post head­ers, 検索エンジンのための、私たちのVIS-IT的論理和をとり、両方. 我々はポストのためにこれを行う必要があります, ページ, アーカイブとホームページ.

1. 私たちは、公開されたリンクを生成するコードを含むファイルを見つける必要がある. これはほぼ確実にWordPressの機能を使用します get_the_date(). あなたのテーマファイルを検索することができます, or refer to theme spe­cif­ic details below where I have provided details for lots of themes
2. 私たちは、出版され、更新された日付が同じであるかどうかを確認しようとしている. その場合、我々は単に余分に追加されます dateUp時代遅れ itempropしかし、彼らが異なっている場合、我々は、出力の訪問者にいくつかの余分なテキストをう
3. 私たちは、FOL低INGを追加しようとしている (and modi­fy it as it explains)

   <?PHPの場合(get_the_date()== get_the_modified_date()): ?>
   
   //我々は、更新されたクラスが追加されただけで、元のコードを使用するつもりだ
   / /ここにあなたのテーマの元のコードを入れて
   / / =任意のクラスを削除する""
   //itemprop =を追加"datePublished dateCreated DateModified（更新日付）" to the HTMLの tag surrounding the get_the_date() 機能
   
   <?他のPHP: ?>
   
   //私達はちょうど更新された追加された日付と少しのコードを使用するつもりだ
   / /ここにしてから、以下のようにそれを変更するには、あなたのテーマの元のコードをコピーして
   / / =任意のクラスを削除する""
   //itemprop =を追加"datePublished dateCreated" to the HTMLの tag surrounding the get_the_date() 機能
   / /あなたはそれが以下のように表示したいラインに新しいHTMLタグに追加
   / /更新 <?PHPエコーget_the_modified_date() ?>
   
   <?PHP endifの; ?>

4. You’ll either have to fig­ure out the ori­gin­al theme’s code and edit it, or refer to the details for spe­cif­ic themes below.
5. 複数のファイルのためにこの編集を繰り返す必要があります

クイックハック

我々は、更新された日付などの発行日をカンニングして供給するつもりだ, ポストは、実際には、より最近に更新されている場合でも、. 投稿が更新されているならば、我々は実際に間違った情報を提供することでしょう, それはまだヴァル-ID-食べます. それは実際に可能であれば適切にそれを行うことをお勧めします, あなたがそれを行う上で執拗ならが、この方法では、読み. 上記のように、我々はポストのためにこれを行う必要があります, ページ, アーカイブとホームページ.

1. 私たちは、公開されたリンクを生成するコードを含むファイルを見つける必要があり、上記のように. これはほぼ確実にWordPressの機能を使用します get_the_date(). あなたのテーマファイルを検索することができます, または私はテーマの多くの詳細を提供してきた以下の表を参照してください。
2. 見つける HTMLの 日付をシュール丸めエレメントメント (しばしば、それが持っているでしょう class="published").
3. クラスを削除し、代わりに以下を追加して、要素を編集 itemprop="datePublished dateCreated dateUpdated"
4. 上記のように, あなたは複数のファイルで、この編集を繰り返す必要があります

Replacing the built-in microformats (because mixing rich snippet formats breaks things)

デフォルトのワードプレスで、まだコメントをマイクロフォーマットのマークアップを使用しています, 悲しいことに、レシピのようなもののミクロデータのマークアップを破るように思われる. この問題を解決する最良の方法は、マイクロフォーマットのマークアップを削除し、ミクロデータマークアップと交換することです. Unfor-TU-nately, これには約いじっのビットを必要とするので、このマークアップを生成するWordPressのコア機能は、便利な場所にフィルタやフックを持っていない.

Replacing vcard in the comments section

1. 私たちがやろうとしていることは、コメントの出力を変更するには、コメントのコールバックを使用している. Many themes already use a call­back which we can modi­fy, とそうでないもののために私たちはWordPressのデフォルトに基づいて1を追加します
2. あなたのテーマを既にコメントのコールバックを持っているかどうかを確認します - 関数のあなたのテーマファイルを検索 wp_list_comments. それは、コードが含まれている場合 callback= また 'callback' => それはあなたが見つけることができる必要があり、コールバックを使用しています (確率巧みのfunctions.php内) コー​​ルバック関数の名前を探すこと, =記号や矢印の後にその一部である, e.g. wp_list_comments( array( 'callback' => 'twentyten_comment' ) ); また wp_list_comments('type=comment&callback=bones_comments');. If it does­n’t then we will need to add one by adding callback=diymh_comment また array( 'callback' => 'diymh_comment' ) ラインへ.
3. あなたはコメントのコールバックを追加するために必要な場合、あなたはのfunctions.phpに次のコードを追加する必要があります

   機能diymh_comment($コメント, $引数, $深さ) {
   $GLOBALS['コメント'] = $コメント; ?>
   <その <?PHPのcomment_class(); ?> ID ="リチウム方法<?PHP COMMENT_ID() ?>">
     <DIVのID ="コメント - <?PHP COMMENT_ID(); ?>">
   <DIVクラス="コメント·著者novcard">
   <?PHPエコーget_avatar($コメント,$サイズ= '48 ',$デフォルト= '<path_to_url>' ); ?>
   
   <?PHPのprintf(_('<=クラスを引用"FN">%S</引用する> <スパンクラス="言う">言う:</スパン>'), get_comment_author_link()) ?>
   </DIV>
   <?PHPの場合 ($コメント - >comment_approved == '0 ') : ?>
   <で><?PHPの_e('あなたのコメントは管理者の承認待ちです。 ") ?></で>
   <BR />
   <?PHP endifの; ?>
   
   <DIVクラス="どのようにメタcommentmetadata"><HREF ="<?PHPのエコーデータを元に戻し( get_comment_link( $コメント - >COMMENT_ID ) ) ?>"><?PHPのprintf(_('％2 $ sの％1 $ S'), get_comment_date(),  get_comment_time()) ?></a><?PHPのedit_comment_link(_('(編集)'),'','') ?></DIV>
   
   <?PHPのCOMMENT_TEXT() ?>
   
   <DIVクラス="返信">
   <?PHPのcomment_reply_link(array_merge( $引数, 配列(「深さ」=> $深さ, 'max_depthの' => $引数['max_depthの']))) ?>
   </DIV>
     </DIV>
   <?PHP
   }

4. あなたは、このコードが持っていることがわかります class="novcard" instead of the ori­gin­al class="vcard".
5. あなたのテーマは、独自のコールバックを持っていなかった場合は、コールバック関数を見つけ、任意のインスタンスを置換する必要があります class="vcard" ととも​​に class="novcard"

Replacing hfeed in the header

1. 次, 我々はまた、任意のインスタンスを削除する必要があります class="hfeed", これ有珠同盟国header.phpの中で発見された. すべての発生·rencesを交換してください hfeed ととも​​に nohfeed

Replacing hentry and title rich snippets

1. 私たちは、のfunctions.phpに追加きちんと機能のカップルと、これらの要素を置き換えることができます

   機能diymh_replace_hentry($クラス){
   もし(($キー= array_search('hentry', $クラス)) !== falseを) $クラス[$キー]= 'nohentry';
   返す$クラス;
   }
   ADD_FILTER('post_class','diymh_replace_hentry');
   
   機能diymh_microdata_title($タイトル) {
       RETURN '<スパンitemprop ="名前">'$のタイトル。'</スパン>';
   }
   ADD_FILTER(「the_title ', 'diymh_microdata_title', 10, 2);

Adding the information type (e.g. Article, レシピ, その他) to the article header

1. 最初の, decide what type of work you are pub­lish­ing — most likely an art­icle. Have a look at the list at schema.org
2. 見つける HTMLの タグこれCON-TAINS機能のTiON post_class()
3. コー​​ドを追加します。 itemscope itemtype="https://schema.org/Article" (あなたが仕事の様々なタイプを選んだ場合は、記事を交換してください)

最後に, to avoid breaking any styles

1. あなたのテーマのstyle.cssにを編集する必要があり、すべてのインスタンスのを置き換えるために、検索/置換操作を行います .vcard ととも​​に .novcard とのすべてのインスタンスを置き換える .hfeed ととも​​に .nohfeed 私たちの変更は、いずれかの混乱をしないように CSS コメントのSTYL-ING

Fixing any other errors

Any oth­er changes neces­sary will be detailed on a per theme basis below. あなたが修正することができないテーマがある場合はコメントを投稿してください. その自由なテーマなら、私はテーマ名を教えてください, and if it is a premi­um theme please let me know so I can provide you with an e‑mail address to send a zipped copy to.

Theme specific details

Before just car­ry­ing out these edits don’t for­get to carry out the steps to link your google pro­file and your site to each oth­er, とヨーストをインストール この, 以上提供するコードを追加します.

機能twentyten_posted_on() {
のprintf( _( '<スパンクラス="%1$S">掲示された</スパン> %2$S <スパンクラス="メタ9月">by</スパン> %3$S ', 「twentyten ' ),
「メタプレップメタ分取作者,
はsprintf( '<HREF ="%1$S" タイトル="%2$S" REL ="ブックマーク"><スパンクラス="エントリーの日付">%3$S</スパン></a>',
get_permalink(),
esc_attr( get_the_time() ),
get_the_date()
),
はsprintf( '<スパンクラス="著者のvCard"><クラス="URLのFNのN" HREF ="%1$S" タイトル="%2$S">%3$S</a></スパン>',
get_author_posts_url( get_the_author_meta( 「ID」 ) ),
esc_attr( はsprintf( _( '％sの投稿をすべて表示'、, 「twentyten ' ), get_the_author() ) ),
get_the_author()
)
);
}

機能twentyten_posted_on() {
もし(get_the_date()== get_the_modified_date()){
のprintf( _( '<スパンクラス="%1$S">掲示された</スパン> %2$S <スパンクラス="メタ9月">by</スパン> %3$S ', 「twentyten ' ),
「メタプレップメタ分取作者,
はsprintf( '<HREF ="%1$S" タイトル="%2$S" REL ="ブックマーク"><スパンitemprop ="datePublished dateCreated DateModified（更新日付）">%3$S</スパン></a>',
get_permalink(),
esc_attr( get_the_time() ),
get_the_date()
),
はsprintf( '<スパンクラス="著者のvCard"><itemprop ="著者" HREF ="%1$S" タイトル="%2$S">%3$S</a></スパン>',
get_author_posts_url( get_the_author_meta( 「ID」 ) ),
esc_attr( はsprintf( _( '％sの投稿をすべて表示'、, 「twentyten ' ), get_the_author() ) ),
get_the_author()
)
);
}
ほかに{
のprintf( _( '<スパンクラス="%1$S">掲示された</スパン> %2$S <スパンクラス="メタ9月">by</スパン> %3$S.  Updated <スパンitemprop ="DateModified（更新日付）">%4$S</スパン>.', 「twentyten ' ),
「メタプレップメタ分取作者,
はsprintf( '<HREF ="%1$S" タイトル="%2$S" REL ="ブックマーク"><スパンitemprop ="datePublished dateCreated">%3$S</スパン></a>',
get_permalink(),
esc_attr( get_the_time() ),
get_the_date()
),
はsprintf( '<スパンクラス="著者のvCard"><itemprop ="著者" HREF ="%1$S" タイトル="%2$S">%3$S</a></スパン>',
get_author_posts_url( get_the_author_meta( 「ID」 ) ),
esc_attr( はsprintf( _( '％sの投稿をすべて表示'、, 「twentyten ' ), get_the_author() ) ),
get_the_author()
),
get_the_modified_date()
);
}
}

<DIVクラス="コメント - 著者のvCard">

<DIVクラス="コメント·著者novcard">

<DIVのID ="ラッパー" クラス="hfeed">

<DIVのID ="ラッパー" クラス="nohfeed">

<DIVのID ="ポスト<?PHP the_ID(); ?>" <?PHPのpost_class(); ?>>

<DIVのID ="ポスト<?PHP the_ID(); ?>" <?PHPのpost_class(); ?> itemscopeはアイテムタイプ="https://schema.org /記事">

<article <?PHPのpost_class('記事フル'); ?>>

<article <?PHPのpost_class('記事フル'); ?> itemscopeはアイテムタイプ="https://schema.org /記事">