ブログへの表挿入に。エクセル表からHTMLテーブルを作ってくれるツールが便利すぎる

シェアする

table

エクセルから表を作るのは簡単です。

そりゃ表計算ソフトって言われるくらいだから、表を作るのは朝飯前です。例えばこんな表ならものの1分もかからずに作れてしまいます。

表のサンプル

かたや、ブログエディターなどの表挿入は、枠組みを作るのは簡単ですが、データ入力を手軽に行えるようにはなっていません。

なので僕は、ブログへ表を挿入するときは、エクセルで表を作ってしまいます。そしてそこから、作成した表を、HTMLテーブルに変換してブログに貼り付けています。

今回は、そんな「エクセル→HTMLテーブル」変換ツールをいくつか紹介します。

photo by Kian Mehrabi

スポンサーリンク
レクタングル(大)広告

基本的な使い方

これからいくつかHTMLテーブル変換ツールを紹介しますが、基本的な使い方は全て同じです。

まずは、エクセルに作りたい表を作成します。オフィスを手元に持っていなくても、オンラインで使用できるMicrosoft Office Onlineで十分です。

表のサンプル

表ができたら、表全体を選択します。

エクセルの表を選択する

あとはそれをコピー(Ctrl+C)してツールの入力欄に貼り付け(Ctrl+V)ます。この例は、エクセルシートをHTMLテーブルに変換しちゃう君 (ββ)を使用。

ツールに貼り付け

あとは「変換」してHTMLテーブルを取得します。

HTMLテーブル変換後

WordPressエディターや、ブログエディターから貼り付ければ以下のようになります。

売上利益
2014年1月1000100
2014年2月130090
2014年3月1100110
2014年4月1500120
2014年5月1700140

大抵のWordpressテーマの場合は、これでOKです。

もし、使用しているテーマがテーブル表示のスタイルを設定してなくて、表示がずれてしまう場合は、以下のスタイルシートをCSSファイルに貼り付ければ、それなりの見栄えのテーブルが作成されます。あとは自分も好みに変更してください。

WordPress向け設定例。

スポンサーリンク
レクタングル(大)広告

エクセル→HTMLテーブル変換ツール

以下では、エクセルテーブル→HTMLテーブルに変換できるWEBツールをいくつか紹介します。

エクセルシートをHTMLテーブルに変換しちゃう君 (ββ)

エクセルシートをHTMLテーブルに変換しちゃう君 (ββ)

今日の表見出しの範囲やセルの結合など細かいところまで設定できます。また、「CSSを出力しない」にすれば、テーマ独自のスタイルを適用することができます。

エクセルシートをHTMLテーブルに変換しちゃう君 (ββ)オプション

また、「変換」を実行すると、変換後の表の状態を確認できるのもユーザーに優しいです。

変換後の表の確認

作成後はこんな感じになります。

売上利益
2014年1月1000100
2014年2月130090
2014年3月1100110
2014年4月1500120
2014年5月1700140

ExcelのHTMLテーブル化フォーム(簡易版)

ExcelのHTMLテーブル化フォーム(簡易版)

こちらは、表のタイトルを設定できたり、奇数行と偶数行に異なったスタイルをつけてくれます。なので行ごとに表示を変更したい場合は、Classにそれぞれスタイルを割り当てると見やすい表がつくれます。

ExcelのHTMLテーブル化フォームオプション

WordPress向けスタイル設定例。

こんな感じの表がつくれます。

今月の業務成績
売上利益
2014年1月1000100
2014年2月130090
2014年3月1100110
2014年4月1500120
2014年5月1700140

Excel to HTML

Excel to HTML

これが最もシンプルで簡単に使えるかも。行と列に表見出しを使用するか指定するだけです。

見出しの設定

普通の表が表示されます。このツールで作成される表には、thead、tbodyなどはつきません。

売上利益
2014年1月1000100
2014年2月130090
2014年3月1100110
2014年4月1500120
2014年5月1700140
スポンサーリンク
レクタングル(大)広告

まとめ

これらのツールを使うようになってから、ブログに表を作成するのに億劫さはあまり感じないようになりました。

表を作るときは、Microsoft Office Onlineのエクセルなどで、パパっと作成。あとはツールでHTMLに変換すれば、結構な作業を軽減できます。

『ブログへの表挿入に。エクセル表からHTMLテーブルを作ってくれるツールが便利すぎる』へのコメント

  1. 名前:オヤマ タケシ 投稿日:2017/06/21(水) 09:01:56 ID:cf6121ff7

    凄くわかり易い説明で、感銘しました
    一つご質問です。
    数式が入っているExcelデータをサイトに掲載することはできませんか
    占いサイトのように、視聴者が誕生日などを入力し、Excel内の機能で
    数値化(評価)できるようにしたいのですが?

    簡単に言うと占いサイトの様なものをWordpressに記述する方法です
    どうぞ宜しくお願い申し上げます。

  2. わいひら 名前:わいひら 投稿日:2017/06/21(水) 12:43:25 ID:2eacaa829

    エクセルをそのままテーブルにできるのは楽で良いですよね。

    数式が入っているExcelデータをサイトに掲載することはできませんか
    占いサイトのように、視聴者が誕生日などを入力し、Excel内の機能で
    数値化(評価)できるようにしたいのですが?
    簡単に言うと占いサイトの様なものをWordpressに記述する方法です

    Excelのような計算機能を持ったテーブルということなら通常は出来ないと思います。
    ただ、JavaScriptを用いれば、テーブルであっても入力フォームであっても簡単な計算機能を持たせることは可能かと思います。

  3. 名前:シダハジメ 投稿日:2017/12/22(金) 13:05:29 ID:89cd8f7a0

    初めまして。
    FC2ブログにエクセルで作成した表を挿入できるそうなので、こちらのブログを拝見して、エクセルシートをHTMLテーブルに変換しちゃう君 (ββ)を使用して作成してみました。プレビューしたところ、表の格子が表示されないのです。エクセルで作成時、格子機能をクリックしたのですが、どうしてなのでしょうか? お忙しい中、申し訳ないのですが回答お願いします。

  4. わいひら 名前:わいひら 投稿日:2017/12/22(金) 19:38:00 ID:959c15a9a

    はじめまして。
    FC2は、深く使用したことがないので詳しいことはわからないのですが、表のスタイルシートが設定されていないのかもしれません。
    確かなことは、実際表が挿入された該当ページを見てみないと、何とも言えないかもしれません。