読者です 読者をやめる 読者になる 読者になる

気ままに殴り書き

日々感じたことを、気ままに書き記す予定でしたが。。。

Excel to HTML、ブログへの表の組み込みが3ステップで簡単にできた

ブログ運営 ブログ運営-編集便利ツール

f:id:kminebg1110:20160106220735j:plain

ブログを始めて、最初に戸惑ったものの1つとして、ブログへの「表の挿入」がありました。当初はFC2ブログを使用していたのですが、表の組み込みツールがあり、それを使用。

「はてなブログ」に引っ越してからは、最も原始的な方法である「エクセルなどの表計算ソフトで表を作成し、Windowsソフトのペイントに表をコピペしてイメージ化」して対応しています。

これなら、会社で使い慣れているエクセルそのままに、罫線や網掛までイメージ化されるので、それをブログに挿入しておしまい。簡単です。

 がしかし、ブロガーたるもの「いつまでもそのような原始的な方法ではダメだ」と思い検索したところ、以下のリンク先のとおり、様々な簡単な方法があるものです。

そのなか、ブログを始めて間もない、HTMLに無知な私にも最も簡単にできたものをご紹介です。

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

ブログの表作成にTables Generatorが便利!ExcelからMarkdown・HTML・テキストへ簡単変換できる - ちょろげ日記

 

スポンサーリンク

 

 

初心者にも簡単な「Excel to HTML」

以下の簡単な事例でのご紹介です。この事例ではOpneOfficeを使用していますが、エクセルでも同様です。

ブログに表示したい表の範囲をコピーします。

f:id:kminebg1110:20160105222021p:plain

 

そして、以下の「Excel to HTML」のサイトを開きます。

Excel to Table | Excel表からHTMLテーブルへ一発変換 | すぐに使える便利なWEBツール | Tech-Unlimited

 

▼Excel to HTML画面

f:id:kminebg1110:20160105222034j:plain

下記の3ステップでHTMLの作成となり、これをブログに貼付けて完了。

  1. 最初の赤枠にて、見出し行など任意のものを選択します。
  2. 中央の赤枠に、先ほどコピーした表を貼り付け。
  3. 赤丸の「変換する」をクリックすると、その上にHTMLが作成されますので、ブログに貼り付けておしまい。

 

▼HTMLをブログに貼付けて表示したもの。左側の赤枠は余分なセルあり。これを修正したものが右側。

f:id:kminebg1110:20160105222111p:plain

1行目と1列目が薄い灰色となっていますが(私の環境では、スマホでは薄い灰色であるものの、なぜかPCでは白表示)、上記の手順1にて「見出し行と見出し列が必要」としたためです。

この機能はなかなか便利です。自分で色を指定するには、HTMLを追記する必要がありますが、いつも色を迷ってしまいます。Excel to HTMLでは、サイト・ブログで最も使用例が多い灰色の見出し表示で、迷わなくても、またシンプルでよいかも。

 

ここで一つ問題が。左の赤枠のとおり、余分なセルができています。これを事前に削除するには、上のスクショにて青文字で記載しましたとおり、手順2の表を貼付けたところで何故か改行されたような扱いになっており、これが影響しています。。これは「Backキーを押すことで解消」します。そして出来上がったものが以下の右側。これでバッチリです。

 

いかがでしょうか。他にも複数のツールで試してみましたが、多少はHTMLの知識が必要であったり、初心者の私には時期尚早でした。ご紹介のExcel to HTMLでしたら、HTMLの知識がなくとも簡単に、また、スマホ・タブレットでも対応できそうです。