Twitter

WP(WordPress)

【WordPress】プラグイン「JM Twitter Cards」でTwitterカードのメタタグ設定

「JM Twitter Cards」でTwitterカード用メタタグを設定

今回は「JM Twitter Cards」というプラグインのご紹介です。

 

ツイッターのタイムライン上に写真説明文付きで投稿記事が流れているのをよく見掛ける思います。
こういうのです↓
Twitter Cardsの表示サンプル

これはTwitterカードと呼ばれるもので、

このTwitterカードを表示するためには専用のメタタグを設定する必要があります。

JM Twitter Cards」はTwitterカードのメタタグを設定してくれるプラグインで、私自身もこちらのブログで使用させて貰っています。

Twitterカードは自分で設定することも可能ですが、プラグインを使用すればサクッと設定できるので、こちらのプラグインでの設定をおすすめしています。

こちらのプラグインは、専用の設定画面も用意されており、諸々の設定を行うこともできます。
と言っても、それほど難しい設定ではないので、まずは、設定画面の説明から行います。

 

設定画面の説明

プラグインをインストール後に有効化すると、

管理画面左カラムに「JM Twitter Cards」というメニューが追加されます。

そちらからプラグインの設定画面へ移動することができます。

で、設定画面は、「Options」タブと「Post types」タブの2画面に分かれているので、

それぞれについて簡単に説明します。

 

「Options」タブ

JM Twitter Cards Optionsタブ

■Creator (twitter username)

Twitterのユーザー名を入力します。

■Site (twitter username)

サイトの投稿者名を入力します。

■Card type

Twitterカードの種類(twitter:card)を選択します。
デフォルトは「Summary」が設定されていますが、「Summary below Large Image」「Application」も選択できます。
私は大き目の画像が好きなので、「Summary below Large Image」を選択します。
※「twitter:card」タグには、「summary_large_image」が設定されます。
シェアされると、タイムラインにはこんな感じで大きな画像が表示されます。

JM Twitter Cards「summary large image」

■抜粋

「抜粋」を説明文(twitter:description)に利用するかどうかの設定になります。

■Open Graph

恐らくTwitterカードタグではなくOPGタグを設定してくれるのだと思いますが、
あまりよく分からない項目です。

■Image Fallback

シェアされた時に使用されるデフォルトの画像を登録します。

■Image alt

画像alt(image:alt)の設定を行います。

■Define specific size for twitter:image display

Twitterで表示される画像のサイズを選択します。

■Home meta desc

トップページに設定される説明文を入力します。

■Custom field title

自分で用意したカスタムフィールドの項目をタイトル(twitter:title)に設定できます。
※自分で投稿画面に記事毎のタイトル説明文設定項目を用意できるイメージです。
例えば、
「t_title」という名称でテキストボックス形式のカスタムフィールドを作成

上記カスタムフィールドに投稿画面からタイトルを入力

「Custom field title」に「t_title」を入力

<meta name="twitter:title" content="タイトルが入ります">

■Custom field desc

自分で用意したカスタムフィールドの項目を説明文(twitter:description)に設定できます。
※自分で投稿画面に記事毎の説明文設定項目を用意できるイメージです。
例えば、
「t_desc」という名称でテキストボックス形式のカスタムフィールドを作成

上記カスタムフィールドに投稿画面からタイトルを入力

「Custom field desc」に「t_desc」を入力

<meta name="twitter:description" content="説明文が入ります">

 

「Post types」タブ

JM Twitter Cards Post typesタブ
「JM Twitter Cards」の設定項目を追加する投稿タイプを選択します。

 

投稿画面での設定

記事の投稿画面でも設定できる項目があります。
あと、シェアされた際の表示プレビューの確認もできます。
JM Twitter Cards 投稿画面
「Card type」では、動画で使用する「player(プレイヤー)」の設定も行えます。

弊社では、以下の方に向けて、WordPressの短期学習プログラムを
格安(15,000円~)で提供しております。

  • 個人でWordPressを使ったサイト(個人ブログやアフィリエイトサイトなど)構築をお考えの方
  • WordPressを使って副業で稼ぎたい方
  • フリーランスでWordPressを使ったお仕事をお考えの方
  • 自社でホームページの構築・運用をお考えの方
  • 企業のWEB担当者の方

内容

基本的には、初心者の方を対象にした学習プログラムです。

※ WordPress制作の上級者の方の場合、弊社の学習プログラムはあまり役に立たないと考えています。

  • ・ WordPressのインストールからセッティングの方法
  • ・ WordPressのテーマ選びについて
  • ・ WordPressのプラグイン選びと設定方法について
  • ・ サーバの準備方法
  • ・ ドメインの取得・管理の方法
  • ・ FTPの設定方法
  • など

ご用意頂くもの

  • ・ ノートPC
    ※ 弊社はWindowsを業務で利用しておりますので、できればWindowsのPCをおすすめしています。
  • WordPressでサイトの制作を考えているが、何から始めればいいのか分からない。
  • ドメインやサーバはどうやって準備すればいいの?
  • そもそもホームページの公開には何が必要なの?

などなど、

どのような内容でも構いませんので、お気軽にお問い合わせ下さい。

お客様の目的をお聞きした上で、最適の学習プランを提案致します。

ご興味のある方は、以下の内容を記載の上、一度お問い合わせ下さい。
こちらより、折り返しメールを致します。

  • ① お名前
  • ② 折り返し先のメールアドレス
  • ③ 希望の学習内容

関連記事

  1. WordPress(ワードプレス)

    WP(WordPress)

    「Edit Author Slug」にはいつもお世話になっております!!

    最近、ブログ投稿を少しさぼっていたので、いつもお世話になってい…

  2. WordPress(ワードプレス)

    WP(WordPress)

    WPでページ上部に変なスペースが!!

    WordPressから吐き出しているページをよくよくチェックしてみると…

  3. WP(WordPress)

    多言語対応を可能にしてくれるプラグイン

    ホームページ制作を生業としていると、サイトを多言語化させたいという…

  4. WordPress(ワードプレス)

    WP(WordPress)

    WordPressにDB Cache Reloaded Fixをインストールしてみた

    「DB Cache Reloaded Fix」というプラグインを見つけ…

  5. WordPress(ワードプレス)

    WP(WordPress)

    WP プラグイン「Delete Custom Fields」で不要なカスタムフィールドを削除

    開発当初の設計ミスであったり、後になっての大幅な仕様変更など、…

  6. WordPress(ワードプレス)

    WP(WordPress)

    add_image_size()と「WP Image Size Selection」はセットで

    add_image_size()で画像サイズを追加した場合、地味に…

最近の記事

  1. MySQL(マイエスキューエル)
  2. MySQL(マイエスキューエル)
  3. WordPress(WP)
  4. SEO(エスイーオー)
  5. ホームページを活用
  6. SEO(エスイーオー)
  7. SNS(ソーシャルメディア)
  8. ホームページ制作ツール
  9. WordPress(ワードプレス)
  10. SNS(ソーシャルメディア)
PAGE TOP