NEFS

GoogleドキュメントをHTMLに変換「ポチッとHTML」-スプレッドシート(GAS)版

  • 更新日:2022/09/10
ポチッとHTML
筆者
Googleドキュメントを細かく設定してHTML化したいという人向けのツールです。

Googleドキュメントに執筆した文章を、HTMLに変換する際には「Docs to Markdown」というアドオンが一般的に使われます。

ただ、テーブルのヘッダーセルを指定できなかったり、HTML化したあとにタグを書き換えたりするのが本当に面倒で(筆者が…)。

そこで、この悩みを解決するべくスプレッドシートの「Gas(Google Apps Script)」で、GoogleドキュメントにあるテキストをHTMLに変換する「ポチッとHTML」を制作しました。

  • GoogleドキュメントをHTML化できる
  • タグは細かく設定して面倒な手間を省ける

    →つまり、サクッとHTML化して入稿の時間を短縮できるツールです。

編集権限のあるGoogleアカウントがあれば誰でも使えて、HTMLの指定はシートごとでバラバラに設定できます。

簡単な初期設定だけしておけば、あとはボタンを押して実行するだけです。  

ポチッとHTML インターフェース

「ポチッとHTML」は500円(税込)の買い切りで、購入後にスプレッドシートをフォルダにコピーするだけで利用を開始できます。

個人利用の範囲であれば、Gasに書かれたコードを改変しても問題ありませんし、ライターに配布しても構いません(カスタマイズはお問い合わせより、相談いただければ柔軟にお見積りします)。

詳細な使い方のマニュアルもスプレッドシートに添付していますので、ぜひご利用ください。  

ポチッとHTMLの主な機能

ポチッとHTMLは、Googleドキュメントで作成した文章を指定のタグでカスタマイズできる「HTML変換ツール」です。

主な機能は、以下のとおりです。

  1. Googleドキュメントの文章をHTMLへ変換する
  2. 指定した対象のテキストを一括置換できる
  3. クライアントごとにHTML設定をシートで変更できる

Googleドキュメントの文章をHTMLへ変換する

ポチッとHTMLでは、対象となるGoogleドキュメントの文章を、指定したHTMLタグを使って変換してから別シートへ出力します。

書式設定を読み込みますから、余計なタグを設定しなくてもそのまま変換できます(デフォルトでH2・H3・H4のタグは変換前に自動削除しています)。

Googleドキュメント HTML変換

お好きなHTMLタグを設定できますので、太字装飾を変換して黄色下線といった形で有効活用していただければと思っています。

また、HTMLはいつでもカスタマイズできますので、急な仕様変更があってもおおよそは対応できるはずです。

表のthタグの設定は太字で対応

表をHTML化する際にネックとなるのが、<td>を<th>(いわゆるヘッダー)に変換する方法です。

ポチッとHTMLでは、ヘッダーに変換したい部分だけ太字を反映していただければ、自動的に<td>が<th>に変換されます。

なお、表にリストを埋め込むといった入れ子構造には対応しておりません

指定した対象のテキストを一括置換できる

ポチッとHTMLには、ただHTMLに変換するだけではなく、一括でテキストを置換する補助機能を備えています。

個人で別に販売している「ポチッとテキスト(後述)」よりは劣りますが、正規表現で一致したもの「すべて」を変換できます。

例えば、内部リンクを差し込みたい場所に「★」を記述し、そのまま置換するといった形です。

また、通常のHTMLタグでは対応しきれないもの(divを追加する等)も、特定のテキストを付与して置換するだけでまとめて設定できますから、面倒な手間を一定以上カットできます。

ポチッとテキストとの違い

ポチッとHTMLは、あくまでも変換が目的ですから、文章の置換の精度はポチッとテキストより低いです。

例えば、以下の場合もすべて対象となりますので、表記統一のための一括変換にはリスクがあります。

  • 見出し
  • リスト

一方で、ポチッとテキストは置換対象をそれぞれ指定でき、無駄な置換のロスはありません。

ポチッとHTMLでは、HTMLの変換を補助する程度としてお使いください。

※ポチッとテキストの詳細はこちら

クライアントごとにHTML設定をシートで変更できる

ポチッとHTML シート

ポチッとHTMLは、変換するHTMLをシートごとに設定できるよう作られています。

例えば、A社にはA社のシート、B社にはB社のシートといった形で設定しておくと、複数の媒体にも対応できるわけです。

意外にも、<p>タグを<span>にしてほしい、<b>タグを<strong>にしてほしいといった細かい違いがあります。

こうした際にも迅速な対応を求められることから、個人的にも便利だと思って追加した機能です。

好みで設定できるHTMLのオプション

ポチッとHTML オプション

ポチッとHTMLでは、好みにあわせられるように個別で以下のオプションを用意しました。

  • 目次
  • ID
  • Aタグ

目次オプションでは、H2〜H4までのタグにID用の「#〜〜〜」を付与できます。

IDオプションと組み合わせると、すべてH4まではリンク化できますので、目次を別途で作るときに便利です。

また、目次はデフォルトでリスト化しますが、リストを外して設定したタグだけを付与したものを出力できます。

Aタグオプションでは、以下の4種類を追加で変換できます。

  • 新しいタブで開く
  • rel = “nofollow”を追加
  • rel = “sponsored”を追加
  • rel = “UGC”を追加

ただ、Gasの使用上すべてのAタグに入ってしまう点だけは、ご了承ください(本当にすみませんです)

ポチッとHTMLに寄せられるよくある質問

ポチッとHTMLはGoogleドキュメント以外に対応していますか?

申し訳ありませんが、Googleドキュメントのみとなっております。

Wordを扱う場合は、Driveに保存し、Googleドキュメントに変換してからお使いくださいませ。

対象となる文章の範囲はどこまで?

Googleドキュメントに記載されているテキストがすべて対象となります。

置換したくないテキストを取り除き、タイトルからまとめまでをGoogleドキュメントに転記して使ってください。

どのように判断してHTML化されていますか?

Googleドキュメントにある書式設定の機能を、Gasで読み取り反映しています。

そのため、Hタグがついていても標準テキストとなっていれば、Hタグは反映されません。

リストや表も同様です。

表が正常に変換できないのはなぜですか?

ポチッとHTMLでは、ヘッダーに変換したい部分だけ太字を反映していただければ、自動的に<td>が<th>に変換されます。

変なところに入っていても、そのセルはヘッダーです。どう足掻いてもヘッダーになります。

また、セル結合された表には対応しておりません(アップデートしようかは迷い中です)。

正常に動作せずにエラーが起きるのはどうして?

正常に動作しない場合は、以下のことが考えられます。

  • 表にリストが入れ子になっている
  • Googleドキュメントが対象になっていない(.Docsは未対応)
  • 入力しているHTMLに誤り(空欄や変なタグなど)がある など

なお、筆者の個人仕様で作られており、セル結合が嫌いなので対応してませんし、表リストを埋め込むといった入れ子構造にも対応しておりません

入力したデータはどこかに送信されますか?

購入されたスプレッドシートからデータを収集したり、Googleドキュメントからテキストを読み込んだりはしません。

ポチッとHTMLでは、テキストをHTMLに変換したり、テキストを置換したりする機能のみが備えられています。

入力したクレジットカードの情報やアドレスはどうなりますか?

Stripeによる決済を採用しており、クレジットカード情報の収集・保管はおこなっておりません

また、入力されたアドレスにつきましても同様です。

購入したスプレッドシートのプログラムが動かなくなったときは?

付属しているマニュアルをお読みいただき、操作方法にお間違えがないか確認してください。

また、作者のミスによって動作しない場合に限り、無償で修正しますので、お問い合わせください。

本製品は毎月動作を確認していますが、Google側のアップデートによって正常に動作しなくなる場合があります。

目次オプションがH4までなのにIDはH5まであるのはなぜ?

なぜでしょう?作者もよくわかりませんが、何かに使ったまま残していたのだと思います。

個人で使っていたシートを調整して販売しているだけですので、どうしても不思議な部分ってありますよね。

ポチッとHTMLのダウンロード

ポチッとHTML

  「ポチッとHTML」は500円(税込)の買い切りで、購入後にスプレッドシートをフォルダにコピーするだけで利用を開始できます。

個人利用の範囲であれば、Gasに書かれたコードを改変しても問題ありません。

»利用規約はこちら

詳細な使い方のマニュアルもスプレッドシートに添付していますので、ぜひご利用ください。

筆者
筆者が使っていたものを使いやすく調整したものですから、細かいカスタマイズが必要な場合はお問い合わせより別途、ご依頼くださいませ〜!