# ブログ記事メタ

### ブログ投稿メタ要素について

概要: [Shopifyブログ投稿メタ](https://help.pagefly.io/manual/shopify-elements-blog-post-meta/) 要素は、ブログ投稿に関する主要な情報をGoogleに表示し、カスタマイズするのに役立ちます。PageFly管理画面では、内容はデフォルトで著者名と公開日を表示するように設定されています。ただし、このセクションの内容を柔軟に変更できます（最大160文字）。

ブログ投稿が作成された時間を変更することはできません。しかし、著者を変更したい場合は、Shopifyで行うことができます。

### ブログ投稿メタ要素へのアクセス方法

以下の手順に従って、**ブログ投稿メタ**要素に簡単にアクセスできます。

* ステップ1: 要素カタログの2番目のアイコンをクリックし、Shopifyタブを選択します。
* ステップ2: ブログ投稿ドロップダウンメニューの下にある**ブログ投稿メタ**要素をクリックします。
* ステップ3: 要素をページエディターにドラッグアンドドロップして使用を開始します。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-77143d99cd522f82b7d201252c4a9c9c273ea7f7%2FAD_4nXel7cxjBFBRgBpSzNu_Ji56iGG_iEBqmdTaQPu21y24LDKduTi8LJ757jpCsO88CsnqdgwVwiqabAlp2iTO9S0dwAKXjp3K0Mw09VWxH-6YDorGZmc8PqUy9QIN5yUxl6x8n-eAD_pP2eJ-CGIs?alt=media)

### ブログ投稿メタ要素の設定方法

この記事では、ブログ投稿要素の「一般」タブと「スタイル設定」タブのパラメーターについて説明します。

#### ブログ投稿ソース

**ブログ投稿メタ**には、この要素に設定できる2つの異なるソースがあります: 自動およびカスタムブログ投稿。

自動: ブログ投稿メタのデータは、ブログ投稿ページから自動的に取得されます。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-ac9721f598eaba01fcfd0dec56f7465301516de1%2FAD_4nXdZ24gk5EWD9aCP40saHP2ix8D_DKgBdqPYI29QWrv6VKdww3OjxwZ2vcSjCpJ_kwOLYjSF7JIecJGC-l8bAVRk3wZSyDfBwzlbWEko20pibVBhQw1fisxXUron2g4-wVX_0UXjJFz1OqZo1YjvOgkeyeX-qeJzVmVXgJmfN_tN8cA.png?alt=media)

カスタムブログ投稿: ブログ投稿メタのデータは、ブログ投稿モーダルで選択できるブログ投稿ページから自動的に取得されます。

#### 一般設定

* メタテキスト
* 日付形式
* 時刻表示
*

```
*   時刻形式 - タイムゾーン表示
```

```
![](../../../images/AD_4nXeH7n3yoqDjSGUqur_41zlBQxKAdF13HpnQwshev91y-3YrEPPqM_-NotbuUXvuQ2Gp-lGVV8sY3nV58kUdtnj5kV9YcUzZF0tFUg67j9BD089oR7IqM2nwW5_6xe4kCC5GEiHoveFcBpJlBiHwwkeyeX-qeJzVmVXgJmfN_tN8cA.png)
```

ATTRIBUTES、VISIBILITY、ANIMATIONパラメーターに関する詳細情報は、[こちら](https://help.pagefly.io/manual/elements-general-settings/http://here)で入手できます。

#### スタイル設定

**Gen 2 エディター**

{% hint style="warning" %}
**重要**: Gen 2 レイアウトは、従量課金制（[スロットプラン](https://help.pagefly.io/manual/pricing-plans/)）のお客様のみが利用できます。
{% endhint %}

フレックスセクションで**ブログ投稿メタ**要素を使用する場合、スタイル設定タブで次の3つのオプションを使用して幅と高さを制御できます。

* コンテナーに合わせる (Fill Container): **ブログ投稿メタ**は親コンテナーのスペース全体を埋めるように展開されます。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-0f995ff55fa4a27fbd78585760b0d8bba08411de%2FAD_4nXdipkYRdCh0RZ3VcuxjMrnkxy8lXwW9GpwJ3CYWuX9H2k7uHu3pSwL66YvtUAv58-qE8T09mdMrCuwGz_ckTdkk_mtxjD_UrswSDs1-l66Uzv1yubgpQFsLknrsiIZI6rTJF_fC0ZZncyA_cLfupQkeyeX-qeJzVmVXgJmfN_tN8cA.jpeg?alt=media)

* コンテンツに合わせる (Hug Content): **ブログ投稿メタ**は、その内部のコンテンツに合わせてサイズが変更されます。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-1d2b8b99f9f4baaeab1cd3d2156e4d2ac952bc3f%2FAD_4nXeV0NKfkoqElFts-2ESVdIaPEypPaUQsLs3sgUxUtqM4IKhpfwkESSsl_LbtXpKzTeC9LrAH4Y2ZZqmKl2gGcD5mYS1wPEX-X9MjqtKG8GjtpEav9tz_AYmWVSciRtOIBz2OTweo0LmQH24MDMm8QkeyeX-qeJzVmVXgJmfN_tN8cA.jpeg?alt=media)

* 固定幅 / 固定高さ (Fixed Width / Fixed Height): **ブログ投稿メタ**の特定の幅および/または高さを設定します。このオプションの下で正確な寸法を定義できます。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-19d2263aca3af96b8d7d56616cc5e873c2653ffc%2FAD_4nXezNfnNqf-faIR1GN9R085g0cCs7CsjNb1CE9Eugrn53UAJfmzrXWuYlT-rWEgsncxotg85spdGLLdCRkpA8bBHCBqEGH5nup8OGiicO1Jf_vGLo2IKaG7fq6pbPnQaCG7Ooyr2RGUJvdTqqFnGkeyeX-qeJzVmVXgJmfN_tN8cA.jpeg?alt=media)

「その他の設定」をクリックすると、**ブログ投稿メタ**の最小幅と最大幅、および高さを設定できます。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-168854cd6e396ff66a9df67fbe2d88351c8649f7%2FAD_4nXdekOuXsO1aKoqXMpe2y89mBSnMpph_4QRPZX7EqaUCkwPbh-7DqWRsWpk4yzjdzfgVSrQjW7XEEeKW1j1MJw6wkCmLKKW0DMxzMlz0PWSOzWfJ2YGyeY584O_25vUIFTg6M-wDXPPIe0sjZIEgkQkeyeX-qeJzVmVXgJmfN_tN8cA.jpeg?alt=media)

**レガシーエディター**

スタイル設定タブでは、**ブログ投稿メタ**要素の外観をブランドの美学に合わせるための幅広いオプションを提供します。この機能を使用すると、タイポグラフィ、配色、寸法、間隔など、さまざまな視覚要素を細かく調整できます。これらの調整は、ブログ投稿情報の洗練された人目を引く外観を作成するのに役立ちます。

要素のスタイル設定に関するさらに包括的なガイドについては、[PageFly要素スタイル設定](https://help.pagefly.io/manual/elements-style-settings/)の記事を参照してください。

![](https://2271939490-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT9kr2rEW4UEj3nmGvBuq%2Fuploads%2Fgit-blob-c457a73a7541a5dde4c3b5e7d8ce4fac1f3d05df%2FAD_4nXcdVD1vdnzLTNZfPErWv3MxV8foaK8xkVFAG2w3EM0D95oVT1VG2I0oNJG4f-zx7tXe_hlh-2EQE2aWKDXuYKDzu7VbJS1l6qmhwFEXltE-GVz4YAMc48BrztbYjp2Jf7K1NcZmcM3_PrQZcFBHdQkeyeX-qeJzVmVXgJmfN_tN8cA.png?alt=media)

### ヒントとベストプラクティス

* メタディスクリプションの推奨される長さは、約155〜160文字で、これは簡潔で整った2つの文に相当します。この制限を超えると、Googleが指定された文字数を超えた余分なテキストを切り捨てることがあります。
* メタタイトルはシンプルで分かりやすくする必要があります。ストアが何を提供しているかを素早く伝え、顧客が一目で提供内容を理解できるようにする必要があります。

### よくある質問

**Googleにおけるメタデータとは何ですか？**

メタタグには、ブログ投稿、ドキュメント、またはウェブページに関する情報が含まれています。メタタグは通常、ウェブページ全体の概要やトピックを示すためにタイトルタグと組み合わせて使用されます。

**メタタグには何を含めるべきですか？**

主要なキーワード、単語（60文字以下）、および数字です。

**ブログ投稿メタは重要ですか？**

はい、SEO目的で非常に重要です。この短い段落は検索エンジンの言語に変換され、検索者にそのブログ投稿をクリックすべき理由を伝えます。

### 追加リソース

* [ブログ投稿詳細要素の使用方法](https://help.pagefly.io/manual/shopify-elements-blog-post-details/)
* [Shopifyブログ投稿画像の使用方法](https://help.pagefly.io/manual/shopify-elements-blog-post-image/)
