Twitterの埋め込み【実は超簡単】微調整のコツや導入する理由
Business, プログラミング, マーケティング, SNS, ブログ
こんにちは、投資家・トレーダー・フリーランスエンジニアの祐です。
WEBサイトでよく見かけるTwitterの埋め込みタイムライン。(このサイトのフッター部分にも設置しています。)
個人のサイトでもぜひ埋め込みたいところです。一見むずかしそうに思いますが、実はめちゃくちゃ簡単にできます。というかTwitter側が簡単にしてくれてます。
コード1つ埋め込むだけなので、ガチガチにプログラミングがわからなくても大丈夫です。マーケティングの一環としてもTwitterの運用は欠かせません。Twitterの埋め込みタイムラインをサックリ導入してしまいましょう。
Twitterタイムラインの埋め込み方法。
画像を使って順をおって解説していきます。
まずはhttps://publish.twitter.com/のサイトに移動します。
埋め込みたいTwitterタイムラインのURLを入力。
左側の「Embedded Timeline」を選択。
これだけでも埋め込み用のコードは出てきます。ですがTwitterタイムラインの画面サイズを設定してあげないと、思わぬ大きさで表示されてしまいます。(試しに自分のサイトに埋め込んでみるとわかります。)
「set customization options」をクリック。
まずは高さ(height)と幅(width)の設定です。ここでheightを設定してあげないと、だら~っと表示されてしまいます。自分のサイトに合わせてチョコチョコ調整しながら設定してみてください。
テーマカラーを選択。
LichtとDarkの2つから、自身のサイトの雰囲気に合わせて選択してください。
Darkはこんな感じです。だいぶ雰囲気が変わってカッコイイですね。
言語を選択。
AutoかJapaneseかと思います。ご自身のサイトを英語対応させていないのであればJapaneseで問題ないかと思います。
「Opt-out of tailoring Twitter」ってなに
他の人の解説ページを観ていると、ここの解釈が間違っている人が多いです。「?」をクリックすると、説明のページが出てきます。
英語のページではありますが、要するに「Twitterは情報(閲覧データ)を収集してるよ!」と書かれています。この項目にチェックを入れなければ情報は収集され、チェックを入れておくと収集を止めることができます。
カスタマイズを完了。
埋め込み用のコードをコピーする。
コードをコピーして埋め込みます。直接コードに埋め込むか、WordPressの人は 外観 → テーマエディッター と進んで埋め込んでください。
Twitterの埋め込みタイムラインを導入すべき理由。
Twitterの利用はマーケティングを行っていくうえで利用していったほうがいいでしょう。
潜在的なニーズを引き出す。
TwitterなどのSNSにおいて、フォローを獲得しておくことはもちろん重要。ですが本当に重要なのは、リプライやシェアをしてもらうことによる二次拡散です。潜在的なニーズを引き出してユーザーを増やしていくためにも、Twitterの運用やTwitterとの連動をしておきましょう。
運用する意識が高まる。
自分のサイトにTwitterのタイムラインが載っているということは、もしTwitterの更新をサボってしまっていた場合に「このサイトもちゃんと運用されてるのかなぁ?」とユーザーの不安が高まってしまいます。逆に、しっかり更新しているものが埋め込まれていれば、きちんとサイトや会社が運営されているという信頼度が高まります。
SNSをあまりやらない人からすると、更新はなかなかめんどうにも感じてしまいます。(僕もその一人です。)
ですがユーザーから信頼を得る一つの要素でもあるので、きちんと運用していきたいものです。【マーケティング初心者向け】僕らはSNSでものを買う【書評】で紹介している本が初心者向けでとても勉強になります。よかったら参考にしてください。
【マーケティング初心者向け】僕らはSNSでものを買う【書評】
「SNSを使って自分の商品を販売していきたい。」「SNSを活用してもCV率がイマイチ伸びない。」←SNSの活用~CV達成までの正しい流れを理解できていないのかもしれません。まずは「僕らはSNSでものを買う」を読んで、基礎や本質を知っておきましょう。
Instagramの埋め込みはできる?
物販をやっている人などは気になるところだと思います。Instagramの埋め込みも可能ではあります。ですが実際にサイトに埋め込んでいる人や、埋め込み方法を載せている人は少ないです。
というのも、埋め込み自体はできるのですが、Twitterと違う点としてInstagramの埋め込みには時間も手間もかなりかかってしまうことがあげられます。僕も一度導入を検討して調べましたが、そこまで手間をかけるほどではないなぁ、と思いTwitterにしています。
WordPressでサイトを運営している人であれば、Instagramの埋め込みができるプラグインがあるので、そちらも一つの選択肢ではあるかと思います。ただ、プラグインはサイトが重くなってしまう大きな原因でもあります。UXが悪くなって離脱が増加してしまってでもプラグインで対応するのか、それとも自力でがんばってAPIを使用してコーディングするのか、もしくはInstagramを諦めて他の方法にするか、じゅうぶんに検討してみてください。
個別のツイートは埋め込みできる?
タイムラインではない一つ一つのツイートを埋め込みしたい場合は、最初のURL入力画面で個別ツイートのURLを入力すれば、あとはタイムラインと同様の流れで埋め込みできます。が、めったにないようならそれでかまわないかもしれませんが、頻繁に個別ツイートを埋め込む作業が発生する場合は、なかなか手間だと思います。
なので、頻繁に埋め込みを行う場合は、直接ツイートの画面をスクショして編集するという方法も可能です。ここは単純に好みの問題にもなってくるので、作業が慣れているほうを選んでいけばいいでしょう。
エラー頻発All in One SEOは不要!削除と各設定を公開
「All in One SEOを使用しているけど思ったようにGoogleに表示されない!」「アップデートでまた不具合発生!」と悩まされている人多いのではないでしょうか?もうそんな重たくて使いづらいプラグインとはおさらば。解決方法を紹介します。
プログラミングを学ぶメリットとは【今が最大のチャンスである理由】
「プログラミングに興味がある。」「IT業界に入るメリットは?」←現役エンジニアがお応えします。加えて、プログラミングを学ばない先のリスクについても解説します。なぜ今がプログラミングを学ぶチャンスなのか?日本で生きていく上で知っておくべき事実です。