- SWELLでTwitterカードを表示する方法を教えて!
上記のような疑問をお持ちの方の悩みを解決できる記事を書きました。
WordPress有料テーマSWELLを導入し、ブログ運営をしていく際に、ブログとSNSを同時に運用し、クリック率と拡散率を高めるためにTwitterカードの利用をお勧めします。
今回の記事では、SWELLでTwitterカードを表示する方法をわかりやすく解説しているので、最後まで目を通してくださいね。
Twitterカードとは?
SWELLのTwitterカードとは、WordPressの有料テーマ「SWELL」を使って作成したサイトの各ページにTwitterカードを表示する機能のことを指します。
Twitterカードとは、Twitter上でリンクがシェアされた時に、リンク先のウェブページのタイトル、概要、サムネイル画像等の情報をまとめて表示する仕組みです。
WordPressテーマSWELLについて新しく記事を書きました!https://t.co/SbkyDnhaiD
— カイハツ@ブログの学びを発信 (@masamasablog1) October 24, 2023
Twitterカードを表示することで、リンクのクリック率や拡散率が上がるため、SWELLテーマでウェブサイトを作成する際にはTwitterカードの実装をオススメします。
Twitterカードを埋め込むメリット
ブログにTwitterカードを埋め込むメリットは以下の点があげられます。
- Twitterでリンクをシェアした時にリッチな情報を表示できる
- 記事のタイトルや概要、サムネイル画像が表示される
- クリック率や拡散率が上がる
- Twitterユーザーにコンテンツをアピールできる
- Twitterとの連携でSEO効果が期待できる
- SEO以外の集客を期待できる
ユーザーエンゲージメントを高めたいブログでは、ぜひTwitterカードを設定しておくことをオススメします。
少しの労力で大きな効果が期待できる便利な機能です。
SWELLでTwitterカード表示を設定する方法
ここからは、実際にSWELLでTwitterカードを表示する設定方法を解説していきます。
まずは、SWELLでTwitterカードを表示する際に、SWELL開発者が作った【SEO SIMPLE PACK】というプラグインをインストールしてから設定していきます。
SIMPLE SEO PACKプラグインで設定する
SWELLテーマを使っている場合、SEO SIMPLE PACKというプラグインを利用するとTwitterカードを簡単に設定できます。
設定方法は以下の通り。
1. SWELLテーマのダッシュボード【プラグイン・新規追加】から【SEO SIMPLE PACK】プラグインをインストール
2. 【プラグイン】の設定ページで【有効化】する
3. 【SEO SIMPLE PACK・OGP設定】で【基本設定・Twitter】を設定していく
4. 各項目にサイトのTwitterアカウントやデフォルト画像などを入力
5. 【設定を保存する】で完了
以下で画像付きの解説をしていきます。
Twitterカードには2種類あります。
1. Summary : タイトル、説明文、サムネイル画像が含まれる基本的な形式です。
2. Summary with Large Image : Summary Cardに大きな画像が追加されたバージョンです。
著者の場合、大きなTwitterカード表示が好きなので、【Summary with Large Image】を選択しています。
SEO SIMPLE PACKを使うとカード情報を自動で生成してくれるので、SWELLでのTwitterカード設定が簡単になります。投稿のカスタマイズも可能です。
プラグインとテーマの機能を併用することで、より効率的なTwitterカードの実装ができると思います。
カスタムHTMLを使ってTwitterを埋め込む方法
SWELLでのTwitterカードを表示する方法を解説します。
カスタムHTMLを使って埋め込む方法。
- TwitterのURLを取得
- ブログの埋め込みにコードを貼り付ける
TwitterのURLを取得
まずは、TwitterのURLを取得します。
日本語バージョン【</> ツイートを埋め込む】
TwitterのURLをコピーできました。
ブログの埋め込みにコードを貼り付ける
次に、ブロックエディターにURLを貼り付けましょう。
表示内容を確認したい場合、【プレビュー】をクリックしましょう。
上記が、カスタムHTMLを使ってTwitterを埋め込む方法です。
1分でできるので、実際にやってみましょう。
まとめ
今回の記事では、Twitterカードを埋め込む方法を解説しました。
まとめです。
SWELLでTwitterカード表示を設定する方法
- 【SEO SIMPLE PACK】プラグインをインストールする
- ダッシュボードの【OGP設定・Twitter】より、設定を行う
Twitterカードには、2種類あります。
1. Summary : タイトル、説明文、サムネイル画像が含まれる基本的な形式。
2. Summary with Large Image : Summary Cardに大きな画像が追加されたバージョン。
HTMLコードを埋め込んで、Twitterカードを表示させる方法も解説しました。
- TwitterのURLを取得
- ブログの埋め込みにコードを貼り付ける
ユーザーエンゲージメントを高めたいブログでは、ぜひTwitterカードを設定しておくことをオススメします。
少しの労力で大きな効果が期待できる便利な機能です。
SWELL購入方法を知りたい方は、以下の記事を参考にしてください。