WordPressを使ってブログに表を掲載する際、方法としては２つあります。
1つはWordPressの表機能を利用すること、もう1つはExcelで作成した表を貼り付ける方法です。
本記事ではExcelで作成した表を貼り付けた際に生じる問題と、その解決方法について紹介します。
発生した問題と原因
Excelで作成した表をWordpressへ貼り付けると、文字配置は左寄せに、線幅を変えていた罫線はWordPressのデフォルトである薄い色に自動変換されます。
これら自体は問題ないのですが、以下のようにExcelでは表示されていなかった縦線や横線が残ってしまう問題が生じることがあります。
| A | B | C | |
| D | E | F | G |
| H | I | J | |
| K | L | M | N |
| O | P | Q | |
| R | S | T | U |
| V | W | X | |
元となったExcelの表の画像を以下のリンクに示します。
この表は7×4の行列を基本として、文字Aのセルは横2つのセルを、文字DとKは縦2つのセルを結合しています。
このことからAのセル右側、DとKのセル下側に太い線が設定されていると考えることができます。
問題の解決方法
問題が生じている文字Aのセルにカーソルを合わせて、セルのプロパティを確認するとスタイルに以下のパラメータが設定されていました。
“border-right: .5pt solid black; height: 18.75pt; width: 108pt;”
この最初の2つのパラメータから「セルの右側に0.5ptの実線を引く」と定義されていると予想できます。
そこで該当箇所を削除し、”height: 18.75pt; width: 108pt;”としてみました。
| A | B | C | |
| D | E | F | G |
| H | I | J | |
| K | L | M | N |
| O | P | Q | |
| R | S | T | U |
| V | W | X | |
すると上の表のように文字Aのセル右側に表示されていた実線をWordPressでデフォルト設定されている薄い線に修正することができました。
文字DやKのセルについてもプロパティを調べてみたところ、”border-bottom: .5pt solid black; height: 37.5pt; border-top: none;”と表示されていましたので、”height: 37.5pt; border-top: none;”に設定を変更すれば、以下のように実線を消すことができました。
| A | B | C | |
| D | E | F | G |
| H | I | J | |
| K | L | M | N |
| O | P | Q | |
| R | S | T | U |
| V | W | X | |
修正方法自体は非常に簡単と感じると思います。
しかし表が結合セルの数が多い場合、一つ一つを修正するのは非常に面倒になります。
そのような場合には以下のリンクのようにExcelで表を作成する際に罫線に装飾を加えないのが良い方法だと思います。
これを貼り付けると以下のように表示されます。
| A | B | C | |
| D | E | F | G |
| H | I | J | |
| K | L | M | N |
| O | P | Q | |
| R | S | T | U |
| V | W | X | |
このようにすべての罫線はWordpressのデフォルトが採用されていますので、あとは自分で装飾したいところだけを修正すればよいことになります。
まとめ
- Excelで作成した表をWordPressへ貼り付けると、結合セルの箇所に実線が入ってしまう
- セルプロパティのsolid black関連を削除することでデフォルトの薄い線に修正することができる
- Excelで表を作成する際に罫線装飾せずにWordPressへ貼り付け、あとから装飾を加えるのが最も楽な方法である
最近のコメント