Google+の一般公開の投稿をブログに埋め込んでみる。
埋め込むといっても、以下のOGP形式ではなく、TwitterやInstagramのようにHTMLコードを用いた埋め込み。
<!-- Place this tag in your head or just before your close body tag. -->
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<!-- Place this tag where you want the widget to render. -->
<div class="g-post" data-href="https://plus.google.com/+GoogleJapan/posts/fKiiMviDREp"></div>
上記の"https://plus.google.com"で始まる部分に埋め込む対象となるGoogle+の投稿のURLを入力すればOK。
埋め込みに必要なコードは上記の通りという事がわかった。
旧UIでは、埋め込みコードは投稿から取得できたらしいが、新UIになって投稿から取得できなかったので、以下の記事に書かれていたコードを使って埋め込んだ。
ちなみに、はてなブログの「見たまま編集」では埋め込んだGoogle+の投稿が表示されないが、プレビューでは何も問題なく表示されている。埋め込む場所の調整は、はてなブログの「HTML編集」を見ながら調整すると良い。
+1ボタンやコメント欄が出てこないけど、これだけ機能すれば充分だと思う。
ただ、幅の調整ができなかったので、スマホで見た時に埋め込んだGoogle+の投稿の右側が切れてしまうのが難点だ。
iPodTouchから埋め込んだ投稿を見た時の様子。右側が切れているのが分かると思う。
タブレット端末(Huawei MediaPad M3)から埋め込んだ投稿を見た時の様子。画面が大きいのもあってか、右側が切れていないのが分かると思う。
ちなみに、Google+のオープンコミュニティの投稿はHTMLコードでは埋め込めなかった。
-end-
