Google サイトにTwitter公式ウィジェットを挿入する - Google ドライブ利用版

管理面で少し面倒な部分があったので，自分のWebサイトをGoogle サイトに移行しました．

ここで躓いたのが，Twitterウィジェット．

Twitter公式のウィジェットは，そのままだとGoogle サイトに挿入できません．

調べるとGoogle Gadgets Editor(GGE)を利用する方法が出てくるのですが，フレームの中身が表示されず……．

色々と試行錯誤した結果，Google ドライブを利用する方法を思いつきました．

Twitter公式サイトでコードを生成

Twitter公式サイトの設定ページから，希望のウィジェットのコードを生成します．
このコードはメモ帳などにコピーしておきます．

コードをガジェット用XMLに

先ほどのコードをガジェット用のXMLにします．
こんな感じ．

<?xml version="1.0" encoding="UTF-8" ?>
<Module>
  <ModulePrefs title="<ガジェットの名前>" />
  <Content type="html">
    <![CDATA[
      <ここにTwitterで生成したコードを挿入>
    ]]>
  </Content>
</Module>

適当な名前(今回はtwitter.xmlにしました)で保存します．

Google ドライブに保存，共有

このセクションではGoogle ドライブのWebサイト上での操作になります． まず，先ほど作成したXMLファイルをGoogle ドライブにアップロードします．
アップロードが終わったらファイルを右クリックし，「共有...」→「詳細設定」の順にクリックします．
次に「変更」をクリックし，「オン - ウェブ上で一般公開」を選択して[OK]ボタンを押します．
さらに，「共有するリンク」のURLをコピーし，メモ帳などに貼り付けます．

URLの確認

先ほど貼り付けたURLを整形します．
"https://drive.google.com/file/d/<半角英数の文字列>/view?=usp=shar"を
"http://googledrive.com/host/<半角英数の文字列>"とし，ブラウザからアクセスします．
すると，別のURLにリダイレクトされ，XMLが表示されます．
XMLが表示されたこのURLを使います．

Google サイトにガジェットを挿入

最後にサイトにガジェットを挿入します．
挿入したいページの編集ページに入り，「挿入」から「その他のガジェット」を選択します．
「URLを指定してガジェットを追加」を選び．先ほどのXMLが表示されたURLを貼り付け，追加を押します．

あとは適宜サイズ等を指定すればGoogle サイトにTwitterガジェットが表示されます．