プログラムでWordPressにスキーママークアップを追加する方法

公開: 2022-04-21

プログラムでWordPressにスキーママークアップを追加しますか？もしそうなら、あなたはあなたのワードプレスのウェブサイトのために様々な方法で多くのコードスニペットを使うことができます。

ただし、それらを追加する方法を説明する前に、スキーママークアップの意味を簡単に見てみましょう。

スキーママークアップとは何ですか？

スキーママークアップは、schema.orgによって提供される標準化されたデータ構造です。基本的に、現在のページに関する情報を検索エンジンに提供します。そのため、クローラーボットはコンテンツの内容を理解し、検索結果にリッチスニペットを作成できます。

スキーマに含まれるデータは、["telephone"："152234029"]のようなキーと値のペアで表示されます。また、複数のレベルの継承を持つこともできます。これらは、Webサイトのクリック率（CTR）を上げるために非常に重要であり、SEOのベストプラクティスの1つと見なされています。

スキーマで使用できるキープロパティには多くの種類があります。それらは、開いた階層と閉じた階層に基づいて、データやデータ型とは異なります。 shcema.org Webサイトにアクセスして、現在使用可能なすべてのタイプを確認してください。

プログラムでWordPressにスキーママークアップを追加する方法は？

以前の投稿で、プラグインを使用してWordPressにスキーマを追加する方法について説明しました。同様に、ダッシュボードとテーマを介してWordPressにスキーママークアップを追加するいくつかの方法についてもすでに説明しました。

しかし今、私たちはプログラムで同じ結果を達成する方法を学ぶつもりです。このようにすることで、プラグインが提供する余分なコードをすべてWebサイトにロードする必要がなくなります。そして、あなたはあなたのウェブサイトが必要とするコードだけを追加するでしょう。

コンテンツにスキーマを含めるには、WebサイトのHTML出力にスキーマタグを追加する必要があります。 WebサイトのHTMLはいくつかの方法で編集できます。最良の方法は、子テーマのテーマテンプレートファイルを上書きすることです。

プログラムでスキーママークアップを含めるには、子テーマが必要です。したがって、まだインストールしていない場合は、先に進んで子テーマを作成してインストールしてください。子テーマプラグインの1つを使用して作成することもできます。

プログラムでWordPressにスキーママークアップを追加するには、主に2つの方法があります。

頭にJSON-LDファイルを追加する
HTML出力にマイクロデータマークアップを追加する

どちらも有効な方法であり、ニーズに合った方法を自由に使用できます。

1.JSON-LDファイルを追加します

JSON-LDファイルは、JSONに基づく特定の種類の形式であり、リンクトデータのエンコードに使用されます。 JSONファイルで発生するのと同様に、キーと値のペアのリストが含まれています。

 {{
    「電話」：「152234029」、
    "名前"： "名前"、
    "住所"： "Johann Street N 433"、
    "url"： "https://QuadLayers.com"、
    "priceRange"： "19-90"、
    "legalName"： "QuadLayers"、
    "@context"： "http://schema.org"、
    "@type"： "LocalBusiness"
}

ご覧のとおり、構文もJSONファイルと非常によく似ています。

ニーズにより適したファイルを取得するために使用できるJSON-LDジェネレーターがいくつかあります。

したがって、次のステップは、このコードをWebサイトのHTML <head>セクションに印刷することです。

これを実現するには、子テーマのfunctions.phpファイルで次の関数を使用できます。

注：続行する前に、必ずWebサイトもバックアップしてください。私たちはあなたのウェブサイトのコアファイルを変更します、そしてそれへの望まない変更はそれにさらなる問題をもたらすかもしれません。

 add_action（'wp_head'、'QuadLayers_add_schema'）;
function QuadLayers_add_schema（）{
エコー'<scripttype = "application / ld + json">
{{
「電話」：「152234029」、
"名前"： "名前"、
"住所"： "Johann Street N 433"、
"url"： "https://QuadLayers.com"、
"priceRange"： "19-90"、
"legalName"： "QuadLayers"、
"@context"： "http://schema.org"、
"@type"： "LocalBusiness"
}';
}

JSON-LDファイルが<script>タグにどのように含まれているかを確認できます。 ファイルを更新することを忘れないでください。

スキーマがどのように機能するかを理解するために、前のサンプルコードはJSONをWebサイトのすべてのページに追加することに注意してください。したがって、検索エンジンまたは他の種類のボットがそれを読み取ると、スクリプトが存在するすべてのページの有効なスキーマとして設定されます。この場合、それはWebサイト全体です。

PHP関数に条件付きロジックを適用することで、JSONコードを特定のページに適用できます。ただし、スキーママークアップをコンテンツの内部HTMLに含めることもできるため、非常に具体的なコンテンツに複雑なマークアップを含めることができます。

2.マイクロデータマークアップをHTMLに追加します

現代のトレンドに従って、前の方法が推奨される方法です。ただし、マイクロデータマークアップを使用すると、スキーママークアップをテンプレートファイルに直接埋め込むことができます。

子テーマのfunctions.phpファイルにスクリプトを貼り付けることもできます。各コンテンツに適切なスキーマを適用するには、大きくて複雑なコードが必要になります。

したがって、HTML内にマイクロデータマークアップを追加するには、WordPressWebサイトのテンプレートファイルを上書きする必要があります。

2.1。 WP投稿にスキーママークアップを追加する

この例では、子テーマはTwenty Twenty-Oneテーマを継承しているため、上書きする必要のあるファイルはcontent-single.phpです。これは、HTML出力にスキーマを直接追加できるファイルです。

このファイルは、一部のテーマで別の名前またはフォルダーで見つかる場合があります。

子テーマ（テンプレートパーツとコンテンツ）に必要なフォルダーと、コンテンツフォルダー内に新しいcontent-single.phpファイルを作成します。

 子供のテーマ
/__template-パーツ
__/__コンテンツ
__ / __ / __ content-single.php

親テーマcontent-single.phpファイルのすべてのコードをコピーして貼り付けます。

投稿テンプレートファイルを上書きする

編集するコードは次のとおりです。

 <記事<？php post_class（）; ？>>

次のスニペットのように、スキーマスコープとタイプを追加します。

 <article itemscope itemtype = "http://schema.org/Article" <？php post_class（）; ？>>

これは、 <article> HTMLタグ内のコンテンツが記事タイプであることを検索エンジンに通知しています。
タイプとスコープを宣言した後、いくつかの標準プロパティを使用できます。たとえば、投稿のタイトルをアイテムの名前として宣言します。

ソースコード：

 <？php the_title（'<h1 class = "entry-title">'、'</ h1>'）; ？>

名前プロパティを追加します：

 <？php the_title（'<h1 itemprop = "name" class = "entry-title">'、'</ h1>'）; ？>

また、 articleBodyキープロパティを使用して、投稿のコンテンツをマークすることもできます。

ソースコード：

 <div class = "entry-content">
<？php 

コンテンツ（）;

articleBodyプロパティの追加：

 <div itemprop =” articleBody” class = "entry-content">
<？php
コンテンツ（）;

2.2。 WooCommerce製品へのスキーママークアップの追加

同様の方法で、WooCommerce製品のテンプレートファイルを上書きして、スキーマを含めることができます。

上書きする必要のあるファイルは、 content-single-product.phpファイルです。このファイルは、子テーマのWooCommerceフォルダーにある必要があります。見つけにくい場合は、WooCommerceも正しく設定されていることを確認してください。

 子供のテーマ
__ / woocommerce
__ / __content-single-product.php

上記と同じプロセスを実行して、代わりに新しいファイルを作成します。

メインのdivラッパーでスコープとスキーマタイプを定義します。

 <div itemscope itemtype = "http://schema.org/Product" <？php wc_product_class（''、$ product）; ？>>

このファイルで「description」プロパティを使用することもできます。

 <div itemprop = "description" class = "summary entry-summary">

ただし、製品にマークアップを追加するには、別のファイルを上書きする必要があります。

たとえば、製品の価格をスキーマに追加するには、子テーマファイルに新しいパスを作成します。

woocommerce/templates/single-product/price.php

 子供のテーマ
__ / woocommerce
__ /__/単一製品
__ / __ / __ / price.php

woocommerceテンプレートファイルを上書きする

その場所にprice.phpファイルをコピーした後、次のように編集します。

ソースコード：

 <p class = "<？php echo esc_attr（apply_filters（'woocommerce_product_price_class'、'price'））;？>"> <？php echo $ product-> get_price_html（）; ？> </ p>

マークアップの追加：

 <p itemscope itemtype = "https://schema.org/Offer" itemprop = "price" class = "<？php echo esc_attr（apply_filters（'woocommerce_product_price_class'、'price'））;？>"> <？php echo $ product-> get_price_html（）; ？> </ p>

価格を定義するために「オファー」タイプの新しいアイテムを作成したことに注意してください。元のHTML構造に従って、さまざまなアイテムタイプを相互にネストする方法を理解するための手がかりになります。

より多くのマークアップを含めるために上書きできる他のファイルがいくつかあります。

title.php
stock.php
review.php
rating.php
product-image.php

結論

これで、プログラムでWordPressにスキーママークアップを追加する方法に関するチュートリアルは終了です。そのためには、スキーマがどのように機能するかについての基本的な理解と、プログラミングの知識が必要です。

また、すべてのプロパティとタイプが、schema.orgWebサイトで定義されているものと一致する必要があることを理解することも非常に重要です。これには、複数レベルの継承を持つプロパティも含まれます。

要約すると、2つの主要な方法を使用してWebサイトにスキーマを追加できます。

頭にJSON-LDファイルを追加する
HTML出力にマイクロデータマークアップを追加する

JSON-LDファイルの追加は非常に簡単なアプローチであり、ほとんどのユーザーが検討しています。あなたがしなければならないのはあなたのウェブサイトの<head>セクションにJSON-LDコードを印刷することです。

ただし、マイクロデータマークアップアプローチを使用してスキーママークアップをテンプレートファイルに直接埋め込むことも非常に役立ちます。テンプレートファイルを上書きすると、必要なリソースがある場合に、さらに柔軟にWebサイトをカスタマイズするのに役立ちます。投稿やWooCommerce製品など、Webサイトの特定の要素にスキーママークアップを追加することもできます。

では、これらのコードスニペットを使用して、Webサイトにスキーママークアップを追加できますか？このチュートリアルが役に立ったかどうかをコメントでお知らせください。

その間、ここにあなたが興味を持ち、あなたのWordPressウェブサイトを改善するのを助けるかもしれない私たちの投稿のいくつかがあります：

カスタムWordPressプラグインを作成する方法
テレグラムをWordPressに追加する（フルガイド）
WordPressでHTMLを編集する方法