Googleドキュメントで作成した記事をブログやWordPressサイトで公開する方法
GoogleドキュメントはGoogle社が提供しているオンラインのドキュメント作成サービスです。複数のユーザーで共有して閲覧や編集ができるため、ブログやウェブページの下書き原稿を書くためのツールとしても便利です。例えば、記事を書く人（ライター）が、Googleドキュメントでブログの下書き原稿を作成し、ウェブサイトの管理者と共有すれば、メールでやりとりする手間が省け、スピーディーにコンテンツを公開できます。
そこで今回は、Googleドキュメントで書かれたウェブページの下書きを、各種ブログやWordPressサイトで公開する方法を紹介したいと思います。なお、本記事ではWordPressで作成したブログを例にして説明しますが、アメブロなどの各種ブログサービスを利用する場合でも基本的な作業の流れは同じです。
記事をHTML形式で出力する
Googleドキュメントの記事をWordPressのテキストエディタにコピーする際、単純なテキスト原稿であればそのままコピー＆ペーストすればよいのですが、画像や文字装飾、見出しなどが含まれる場合はHTMLで書かれたテキストをコピーしなければなりません。ところが、Googleドキュメントのファイルメニューからウェブページ（.html、zip）としてダウンロードしたHTMLファイルは、大量のpタグやspanタグが挿入されている上、日本語がHTMLエンティティ（アンパサンド［&］で始まりセミコロン［;］で終わる文字列。文字実体参照とも呼ばれる。）に変換されており、そのままでは日本語として扱えません。
そこでまず、Googleドキュメントのページから、不要なタグのない通常のHTMLを取得するため、Googleドキュメントのアドオンメニューから「Docs to Markdown」をインストールします。インストールできたら、アドオン > Docs to Markdown >Convert の順に進み、右側のウィンドウに表示される「HTML」ボタンをクリックすると、現在のドキュメントのHTMLソースが表示されます。
ファイルメニューからダウンロードしたHTMLは日本語が英数字の文字列に変換されてしまいますが、この方法なら正常に日本語で出力されており、余計なタグもほとんど入りません。
画像をアップロードする
次に、メニューのファイルからウェブページ（.html、zip）形式でファイルをダウンロードします。Googleドキュメントに埋め込まれた画像はダウンロードしたimagesフォルダ内に保存されているので、画像ファイルをメディアライブラリ（あるいはサーバ上の画像保存フォルダ）にアップロードします。このとき、アップロード済みのファイルと同じ名前のファイルをアップロードすると上書きされたり別名で保存されるため、画像ファイルの名前は先頭に日付を入れるなどしてユニークなファイル名に変更しておくとよいでしょう。後で行うファイル名の一括置換作業が楽になります。
※追記：出力した画像ファイルの順番が正しく並ばないときの回避策を追記しました。
画像のパスを書き換える
「Docs to Markdown」で出力したHTMLは、imgタグのパスが相対パスになっているので、これをアップロードした画像のパスに書き換えます。画像の点数が多い場合はテキストエディタで開いて一括置換すると効率的です。
置換前：img src = /images/img.jpg
置換後：img src = https://greed-island.ne.jp/uploads/images/img.jpg
公開する
HTMLをWordPressのテキストエディタにペーストし、不要なコメントやタグをあれば削除します。最後にプレビューを確認し、問題なければ公開して作業完了です。なお、今回の記事もこの手順で作成しました。
複数の画像や文字装飾を含むGoogleドキュメントからウェブページを作成する場合は、今回紹介した方法を覚えておくと効率的に作業できます。
おまけ：その他の方法
テキストだけならコピー＆ペーストでOK
Googleドキュメントで作成した原稿が画像を含まないテキストだけのファイルであれば、コピー＆ペーストするのが一番簡単です。Googleドキュメントをすべて選択してコピーし、WordPressのビジュアルエディタにペーストすればOKです。ただし、見出し、箇条書き、太字、リンクなどはきちんと反映されますが、テキストカラー、フォントサイズ、アンダーラインは反映されません。また、Googleドキュメントに埋め込まれている画像や動画はコピー＆ペーストしても反映されません。
プラグインを使ってGoogleドキュメントからWordPressを直接編集する
WordPressのプラグイン「Jetpack」と、Googleドキュメントのアドオン「WordPress.com for Google Docs」を組み合わせて利用すると、GoogleドキュメントからWordPressに記事を直接投稿できるようになります。Jetpackを利用するためには、WordPress.comアカウントを取得する必要がありますが、一度設定してしまえば後は楽なので、頻繁に更新する場合は試してみるとよいでしょう。なお、筆者は余計なプラグインをインストールしたくないのでこの方法は使っていません。
追記：画像の順番がおかしい場合の対処法
Googleドキュメントからエクスポートされたzipファイルの画像は、ドキュメントと同じ順序で表示されないことがあり、画像の順番が入れ替わってしまう場合があります。
このようなときは、「Docs to Markdown」を使わずに、ウェブページとした出力したHTMLファイルをブラウザで開き、デベロッパーツールからソースコードをコピーすることで解決します。手順は下記のとおりです。
- Googleドキュメントの「ファイル」からウェブページとしてダウンロードする。
- HTMLファイルをブラウザで開き、デベロッパーツール（Chromeの場合はメニュー > 表示 > 開発）を起動する。
- body内のソースコードをコピーする。
- テキストエディタにペーストし、不要なpタグ、spanタグ、style属性を削除する。
- imgタグのパスをアップロード先のパスに書き換える。
他にもっと良い方法があればぜひご連絡ください。
