どういう分野であれ、記事の中で表を使いたいことがあると思います。HTMLやMarkdown形式で表を描こうとすると、それなりに面倒ですし、慣れてない人にはハードルが高めです。


でも、Bloggerなら表を作るのも簡単です。Googleスプレッドシートで表を作成して、それをBloggerに貼り付ければいいだけです。なにせ、どちらもGoogleのサービスですから。


以下、備忘録としてやり方をまとめておきます。


Googleスプレッドシートで表を作成

まずはスプレッドシートで表を作成しましょう。


表ができたら、その表の範囲を選択して右クリック→「コピー」を選択します。



Bloggerへ表を貼り付け

表のコピーができたら、Bloggerの投稿作成画面に戻り、コピーした表を貼り付けます。



これで貼り付け自体は完了です。ただのコピー&ペーストです。



ただ、よく見てみると、表の横幅が大きすぎてはみ出ていますね。このままでは表の全体が表示されないので、調整が必要になります。


貼り付けた表のサイズ調整

表のサイズを調整するために、Bloggerの投稿作成画面を「作成ビュー」から「HTMLビュー」に切り替えます。


切り替えたら、「table-layout: fixed; width: 0px;」という部分を見つけてください。



見つかったら、その部分を「table-layout: auto; width: 100%;」に書き換えます。



「table-layout」を「auto」に設定することで、デバイスの画面サイズに対応したサイズで表示され、「width」を「100%」に設定することで、表の横幅が画面の横幅いっぱいに表示されます。50%にすれば表の横幅は画面の横幅の半分になります。

この書き換えをすませて、「作成ビュー」に戻ると、表がきちんと作成画面の横幅に収まっています。


そして、実際のサイトの表示でも、表の横幅が画面の横幅にフィットしています。


これで、表の貼り付けが完了です。

大したことではありませんが、知っておくとかなり便利かと思います。