カテゴリー:WordPress※この記事は7分ほどで読めます。DESIGNのサブロー(@saburo_design)です。ワードプレスで記事を作成した時に拡散させるための手段としてツイッターを使用することが多いです。ブログを運営したばかりの時はサイトへのアクセスも少なく、せっかく書いた記事を誰にも見てもらえないことなどしばしば・・・。ツイッターのつぶやきを不特定多数の人に見てもらうなら、少しでもインパクトのあるつぶやきにしたいですよね?それならTwitterCardは是非設定しておくべきです。ワードプレスならTwitterCard専用のプラグインもありますが今回はプラグインなしでの設定方法となります。Validatorに申請する【おまけ】TwitterCardの表示形式TwitterCardとは?ツイッターカードはサイトのURL付きで何かしらつぶやいた時に、サイトの画像・タイトル・概要が自動的に表示されるシステムです。下記の画像のような感じです。?文字だけのつぶやきより多少はインパクトが出ますよね?たったこれだけのことですが、毎日世界中の人達がつぶやくツイートという名の砂漠の砂の中から、自分のツイートをクリックしてもらおうと思ったら、こういうものは使わない手はないですよね?自分のサイトを持っているあなたの特権みたいなシステムです。それに設定も簡単ですので少なくともやっておいて損はありません。Validatorに申請するだけです。申請といっても自分のサイトのURLを貼っつけてボタンを押すだけです。TwitterCard専用のタグを記述するTwitterCard専用のタグの基本はこうです。/>サイトのheadタグの中に記述されたTwitterCard専用タグを基本としてつぶやきにTwitterCardを表示させることができます。細かいことは置いといて先に完成形を見せます。?>">いきなりごちゃっとしてしまいましたがこれをヘッダーのテンプレートの中に記述しておけば、あなたのサイトのどのURLをつぶやいてもTwitterCardが表示されます。ツイッターアカウントの部分(このサイトの場合@saburo_design)とアイチャッチ画像が設定されていない場合代わりに表示するデフォルト画像のURLの部分は各自設定してください。ちなみに表示される画像は、ワードプレスでアイキャッチ画像として設定された画像が使われます。Validator』に申請します。URL】をクリックすると・・・。画像がちゃんと表示されたらTwitterCardの設定完了です!※画像が上手く表示されない人は少し時間を置いてもう一度やってみてください。申請に時間が掛かる場合もあるそうです。今回は一番オーソドックスなTwitterCardの表示形式を行いましたが、TwitterCard専用のタグの記述の仕方で表示方法を変えたりできます。このサイトではカスタムフィールドを使って、記事ごとにTwitterCardの表示のされ方を変えたりしています。/>↑この部分を変えるとTwitterCardの表示の仕方が変わります。TwitterCardの画像の表示形式一覧summaryデフォルトのカードで、タイトル、説明、サムネイル、Twitterアカウントの属性が含まれています。summary_large_imageSummaryカードに似ていますが、画像が目立つように使用されています。photo写真のみを含めたカードです。gallery4つの写真を集めて強調したカードです。appモバイルアプリの詳細を含めて直接ダウンロードできるようにしたカードです。product製品情報のために最適化したカードです。投稿タグTwitterCardカスタマイズプロフィールサブロー(@saburo_design)Web関係のお仕事をやってます。美味しいものを食べに行ったり技術録を書いたり。最近ブログ用のデジカメを買って浮かれています。ツイッターとかインスタグラムもやってますのでフォローもお気軽にどうぞ。DESIGNサブローデザインは大阪で働くWebデザイナーが書く雑記ブログです。WordPressの技術録やプラグインの紹介から趣味の事まで色々書いてます。technology.。