seesaaブログに投稿した記事をtwitterに自動投稿する方法ーその1
1.記事一覧から、twitterへ投稿したい記事を選ぶ。
2.中段の「ハッシュタグやコメント」の欄に表示させたい内容を入力する。公開設定が「公開」になっていることを確認し、記事を保存する。
3.twitterに自動投稿されます。
※黄色の矢印の欄には、本来画像が表示されるはずなのですが、何度やってもうまくいきません。OGP設定がうまく機能していないようです。
twitterに自動投稿するには、実は下準備が必要です。
Twitterの連携
まずはTwitterとの連携ね。事前に連携したいTwitterアカウントでログインしておきます。外部連携に「Twitterとの連携」と「Facebookとの連携」という項目があるので、まずは「Twitterの認証を行う」をクリック。
認証画面になるので「連携アプリを認証」をクリック。
するとシーサーブログに管理画面に戻るので、ブログの記事公開した時にTwitterでも公開するかどうかを選択します。
その下に「Twitterまとめ投稿」という項目がありますが、これは前日のTwitterでの投稿を自動で投稿する?という設定です。
「Twitterまとめ投稿」は私は利用した事がないので、「しない」を選択しています。
以上でTwitterの連携は完了。画面の一番下の「保存」をクリックして保存しておきます。
引用元:http://affiliate150.com/seesaa-ogp
twitterに自動投稿されるツイートに画像を表示させるには、下準備が必要です。
シーサーブログのOGP設定
さて、ようやく本題。シーサーブログの場合のOGPタグの設置とちょっと細かい部分を追加していく必要があるのでそれも設定していきます。
先ほどの連携と同様にシーサーブログの管理画面から「設定」⇒「外部連携」と進み、次の2つの設定をやっておきます。
- 「OGPタグの追加」という項目で「追加する」にチェック
- 「OGPの画像を設定」という部分の「ファイル選択」で画像を設定する
このOGPの画像というのは設定していない場合、FacebookやTwitterではシーサーブログのロゴ?が表示されます。こんな感じ。
この「OGPの画像を設定」で設定した画像というのは、トップページや画像のないページで表示される画像なのね。画像を設定してやるとこんな感じになります。
もちろんトップページ以外(個別記事)で画像を使っている場合にはそれが表示されるようになっています。とりあえず画像まで設定できたら一度画面下の「保存」をしておくと、先ほどの設定項目がこのように変化します。
一度画像をアップしてから「保存」するとこの項目に「常にこの画像を使用する」と「記事内に投稿した画像があればそれを使用する」という選択ができるようになっているので、ここはお好みで変更して再度「保存」。
一応これだけ設定しておくと基本的な部分はOKですが、念のためもうちょっと追加していきます。
htmlタグの書き換え
これは無くても機能はするのですが、念のために追加しておいた方が良さそうです。
Seesaaブログの場合は「旧システム」と「新デザインシステム」でやり方がちょっと違うのでそれぞれ説明します。旧と新で管理画面の画像も違うのでそれを見たらどちらかは判断できます。
旧デザインシステム(従来のシステム)の場合
旧デザインの場合は「デザイン」⇒「HTML」と進み、適応中のHTMLを選択。
旧デザインの方で初めてHTMLを編集する方はHTMLのを追加して名前を付けておいて下さい。
「旧デザイン」の場合はHTMLの最初の方にこのような記述があります。
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
xml:lang
=
"ja"
lang
=
"ja"
>
これを次のように書き換え。
<
html
xmlns
=
"http://www.w3.org/1999/xhtml"
xml:lang
=
"ja"
lang
=
"ja"
xmlns:og
=
"http://ogp.me/ns#"
xmlns:fb
=
"http://www.facebook.com/2008/fbml"
>
こんな感じになります。
ここまでできたら一度「保存」しておきましょう。
新デザインシステムの場合
新デザインシステムの場合はSeesaaブログの管理画面から「デザイン」⇒「デザイン設定」⇒「適応中のデザインタイトル」⇒「HTMLの編集」と進みます。
「新デザインシステム」の場合はHTMLの最初の方に「head」という記述があります。
<
head
>
こいつを下記のように書き換えます。
<head prefix=
"og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#"
>
変更して保存したらOK。こんな感じになります。
TwitterCards(Twitterカード)の認証
上記のTwitterとの連携でTwitterとの連携をした場合にはTwitterCardsの認証をやっておくのがおすすめです。
「TwitterCards」というのはTwitterで自分のブログのURLを投稿した時に「概要を表示」という項目を追加してブログ情報をリッチに表示してくれるやつです。
この「概要を表示」をクリックするとこんな感じに表示されます。
TwitterCardを利用する場合に必要なタグは先ほどのOGPタグの追加で既に追加されているので、後はTwitterでの認証。こちらに移動。
⇒Card validatorページに移動して今設定したブログのURLを入力し、「Preview Card」をクリック。
以前は「Request Approval」という申請ボタンがあったような気がしましたが今は見当たりません。とりあえず「自分のURL is whitelisted for summary card」と表示が出てくればOKです。
これでTwitterに自分のブログのURLをTwitterで投稿すると「概要を表示」が表示されるはず(ちょっと時間かかる場合もあるかも)。
引用元:http://affiliate150.com/seesaa-ogp
※この記事を参考に、何回も画像の表示にトライしているのですが、現在のところ、うまくいきません。記事内に画像がない場合には、うまく画像が表示されるのですが、記事内に画像がある場合には、うまくいきません。
seesaaブログに投稿した記事をtwitterに自動投稿する方法ーその2
2.
『<% article.subject %>』<% blog.title | cshorten(20) %>|<% article.short_page_url %>