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. あなたのサイト名を入力してください (例えば. DIY メディアホーム) およびアドレス (例えば. https://diymediahome.org)
7. [保存]をクリックします

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

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

1. インストール ヨースト この PLU-GIN または あなたのテーマのfunctions.phpのファイルに次のコードを追加します
   
   function update_contactmethods( $contactmethods ) { // Add Google Profiles $contactmethods['googleplus'] = 'Google+'; // Add Twitter $contactmethods['twitter'] = __( 'Twitter username (without @)', 'wordpress-seo' ); return $contactmethods; } add_filter( 'user_contactmethods', 'update_contactmethods', 10, 1);

   1 2 3 4 5 6 7 8 9

   func­tion update_contactmethods( $con­tact­meth­ods ) { // Add Google Profiles $con­tact­meth­ods[‘googleplus’] = ‘Google+’; // Add Twitter $con­tact­meth­ods[‘twit­ter’] = __( ‘Twit­ter user­name (without @)’, ‘word­press-seo’ );   return $con­tact­meth­ods; } add_filter( ‘user_contactmethods’, ‘update_contactmethods’, 10, 1);

2. WordPressの管理画面で、あなたの著者プロフィールに行く (hov­er over ユーザー 左側のメニューで, 、をクリックして下さい あなたのプロファイル)
3. で Google+の フィールドには、Googleのプロファイルへのリンクを追加 (例えば. https://plus.google.com/104657888470728381512 /)
4. もしどちらかを確認してください, or your oth­er site authors do the same thing, 自分のGoogleプロフィールへの各リンク
5. 今, あなたはヨーストPLU-GINを使用している場合, に行く この メニューを選択 タイトルやメタ情報, C言語でなめる ホームホーム ページの上部にあるとのメニュー 高光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, およびデフォルトを使用します (あなた) 存在しない場合.
   
   Add this to header.php imme­di­ately above </head>

   XHTML

   <link rel="author" href="<?php $gplus = 'https://plus.google.com/115369062315673853712/posts'; if ( is_singular() ) {global $post; $gplus = get_the_author_meta( 'googleplus', $post->post_author );} echo $gplus; ?>"/>

   1	<link rel=“author” href=”<?php $gplus   = ‘https://plus.google.com/115369062315673853712/posts’; if ( is_singular() ) {glob­al $post; $gplus = get_the_author_meta( ‘googleplus’, $post->post_author );} echo $gplus; ?>”/>

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)
   
   &lt;?php if(get_the_date()==get_the_modified_date()): ?&gt; //we're going to use the original code just with the updated class added //put your theme's original code here //remove any class="" //add itemprop="datePublished dateCreated dateModified" to the HTML tag surrounding the get_the_date() function &lt;?php else: ?&gt; //we're going to use slightly code just with the updated date added //copy your theme's original code to here and then modify it as below //remove any class="" //add itemprop="datePublished dateCreated" to the HTML tag surrounding the get_the_date() function //add in a new html tag into the line where you want it to appear as below //Updated &lt;?php echo get_the_modified_date() ?&gt; &lt;?php endif; ?&gt;

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

   <?php if(get_the_date()==get_the_modified_date()): ?>   //we’re going to use the ori­gin­al code just with the updated class added //put your theme’s ori­gin­al code here //remove any class=”” //add itemprop=“datePublished date­Cre­ated date­Mod­i­fied” to the HTML tag sur­round­ing the get_the_date() function   <?php else: ?>   //we’re going to use slightly code just with the updated date added //copy your theme’s ori­gin­al code to here and then modi­fy it as below //remove any class=”” //add itemprop=“datePublished date­Cre­ated” to the HTML tag sur­round­ing the get_the_date() function //add in a new html tag into the line where you want it to appear as below //Updated <?php echo 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内) コー​​ルバック関数の名前を探すこと, =記号や矢印の後にその一部である, 例えば. 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に次のコードを追加する必要があります
   
   function diymh_comment($comment, $args, $depth) { $GLOBALS['comment'] = $comment; ?&gt; &lt;li &lt;?php comment_class(); ?&gt; id="li-comment-&lt;?php comment_ID() ?&gt;"&gt; &lt;div id="comment-&lt;?php comment_ID(); ?&gt;"&gt; &lt;div class="comment-author novcard"&gt; &lt;?php echo get_avatar($comment,$size='48',$default='&lt;path_to_url&gt;' ); ?&gt; &lt;?php printf(__('&lt;cite class="fn"&gt;%s&lt;/cite&gt; &lt;span class="says"&gt;says:&lt;/span&gt;'), get_comment_author_link()) ?&gt; &lt;/div&gt; &lt;?php if ($comment-&gt;comment_approved == '0') : ?&gt; &lt;em&gt;&lt;?php _e('Your comment is awaiting moderation.') ?&gt;&lt;/em&gt; &lt;br /&gt; &lt;?php endif; ?&gt; &lt;div class="comment-meta commentmetadata"&gt;&lt;a href="&lt;?php echo htmlspecialchars( get_comment_link( $comment-&gt;comment_ID ) ) ?&gt;"&gt;&lt;?php printf(__('%1$s at %2$s'), get_comment_date(), get_comment_time()) ?&gt;&lt;/a&gt;&lt;?php edit_comment_link(__('(Edit)'),' ','') ?&gt;&lt;/div&gt; &lt;?php comment_text() ?&gt; &lt;div class="reply"&gt; &lt;?php comment_reply_link(array_merge( $args, array('depth' =&gt; $depth, 'max_depth' =&gt; $args['max_depth']))) ?&gt; &lt;/div&gt; &lt;/div&gt; &lt;?php }

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24

   func­tion diymh_comment($com­ment, $args, $depth) { $GLOBALS[‘com­ment’] = $com­ment; ?> <li <?php comment_class(); ?> id=“li-comment-<?php comment_ID() ?>”>   <div id=“comment-<?php comment_ID(); ?>”> <div class=“com­ment-author nov­card”> <?php echo get_avatar($com­ment,$size=‘48’,$default=’<path_to_url>’ ); ?>   <?php printf(__(‘<cite class=“fn”>%s</cite> <span class=“says”>says:</span>’), get_comment_author_link()) ?> </div> <?php if ($com­ment->comment_approved == ‘0’) : ?> <em><?php _e(‘Your com­ment is await­ing mod­er­a­tion.’) ?></em> <br /> <?php endif; ?>   <div class=“com­ment-meta com­ment­metadata”><a href=”<?php echo htmlspe­cial­chars( get_comment_link( $comment->comment_ID ) ) ?>”><?php printf(__(‘%1$s at %2$s’), get_comment_date(),  get_comment_time()) ?></a><?php edit_comment_link(__(‘(Edit)’),’  ‘,”) ?></div>   <?php comment_text() ?>   <div class=“reply”> <?php comment_reply_link(array_merge( $args, array(‘depth’ => $depth, ‘max_depth’ => $args[‘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に追加きちんと機能のカップルと、これらの要素を置き換えることができます
   
   PHP

   function diymh_replace_hentry($classes){ if(($key = array_search('hentry', $classes)) !== false) $classes[$key]='nohentry'; return $classes; } add_filter('post_class','diymh_replace_hentry'); function diymh_microdata_title($title) { return '<span itemprop="name">'.$title.'</span>'; } add_filter('the_title', 'diymh_microdata_title', 10, 2);

   1 2 3 4 5 6 7 8 9 10

   func­tion diymh_replace_hentry($classes){ if(($key = array_search(‘hentry’, $classes)) !== false) $classes[$key]=‘nohentry’; return $classes; } add_filter(‘post_class’,‘diymh_replace_hentry’);   func­tion diymh_microdata_title($title) {     return ‘<span itemprop=“name”>’.$title.’</span>’; } add_filter(‘the_title’, ‘diymh_microdata_title’, 10, 2);

Adding the information type (例えば. 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, とヨーストをインストール この, 以上提供するコードを追加します.

下記のコメントで私達にあなたの考えを送ってください! あなたが購読したい場合は、右上のメニューで購読リンクをご利用ください. また、下記の社会的なリンクを使用してお友達とこれを共有することができます. 乾杯.