「Blogger」投稿記事に表を追加したい
 |
Bloggerで投稿記事に表を追加したい時ってありませんか？
めったにそうは思わないかもしれませんが、何か調べた結果を一覧表にしたほうが、わかりやすい時もありますよね。
Google driveのドキュメントの表を貼り付ける
実は、Google driveのドキュメントで使われている表をコピペすることで、表を簡単に貼り付けることができます。
以下の表は、当ブログの今年の投稿記事数を一覧表にしたものですが、ドキュメントで作成した表を貼り付けたものです。
残念ながら、この表の幅はBloggerの投稿記事で編集する際、HTMLビューで編集する必要があります。
ですが、ちょっとした一覧を設けたい際、簡単にできるので、お試しいただければと思います。
Google driveのスプレッドシートの表を貼り付ける
当然ながら、スプレッドシートの表も貼り付けられます。
上記の表と同様に、幅はHTMLビューでの編集が必要になります。
HTMLビューでの編集は、ソースを見れば察してもらえると思いますが、かなり複雑な状態で、表を編集することを躊躇すると思います。
あくまで、これらのやり方は、急遽必要な場合のみに行うことをお勧めします。
理由として、レスポンシブのブログの場合、固定幅の表は、レイアウトを崩してしまう可能性があるからです。
特に横幅の広い表は、十分に注意する必要があり、表の作り方そのものを再検討する必要があるでしょう。
Microsoft Excelの表を貼り付ける
Microsoft Excelから表を貼り付けることも可能ですが、表の罫線が見えない状態になります。Excel側で、罫線の色・太さを指定しても、罫線は表示されません。
| 0% | 8 |
| 0% | 5 |
| 0% | 3 |
| 0% | 4 |
| 0% | 19 |
| 0% | 5 |
逆にこのような状態が都合が良ければ良いのですが、こちらも幅などは変更しにくいです。
Microsoft Wordの表を貼り付ける
Excelとは違い、罫線に色が付いた状態で、貼り付けることができます。また、Wordにある表スタイルをある程度引き継いでくれますので、見た目を比較的ラクに変えることができます。
|
１ |
２ |
|
１ |
２ |
|
２ |
２ |
|
３ |
３ |
|
３ |
３ |
|
３ |
３ |
しかし、こちらも表の幅は変更しにくく、HTMLビューで変更する必要があります。
レスポンシブに対応した表が欲しいんだよ！
正直、なかなか難しい面もあります。すべての表をレスポンシブに対応させることは難しいでしょう。
個人的には、いっそのこと表は画像にしてしまうのが良いかなと感じています。
二次利用しにくいので、お勧めできる方法かもしれません。
また、表を画像にして、別ウィンドウで開くようにすると、ユーザーも使いやすいかもしれません。
