WordPress プラグイン[TinyMCE Advanced]でセルの結合ができない時の解決法と表の編集の仕方

私はWordPressを使って間もないのですが、

少しブログにも慣れてきたのでテーブル(表)を作ってみたいと思い、プラグイン[TinyMCE Advanced]をインストールしてみました。

しかし、表の挿入は出来ても複数のセルを選択することができず、結合や色付けなどができない状態でした。

今回は私と同じように TinyMCE Advanced を使って表がうまく作れないという人向けに記事を書いていきたいと思います。

今は解決して、プラグインを正常に利用できています。

結論からいうと、原因はブラウザによるものでした。おそらく私のような初心者の方が同じような症状に陥りやすいかと思います。

この症状で悩んでいる方はまだちゃんとしたテーブルを作ったことがないかと思いますので、最後の方でテーブルの編集の説明もしていきたいと思います。

目次

• 1. セルの結合ができない症状
  • 1.1. テーブルから表を作ってセルの結合をしてみる
  • 1.2. 原因はブラウザにあり
  • 1.3. まとめ
• 2. テーブルの編集
  • 2.1. 枠線の引き方
    • 2.1.1. 表の外枠に枠線を引く
    • 2.1.2. 表のセルに枠線を引く
  • 2.2. 色の付け方
    • 2.2.1. 表全体に色を付ける
    • 2.2.2. セルに色を付ける

セルの結合ができない症状

テーブルから表を作ってセルの結合をしてみる

TinyMCE Advancedをインストールしている方はこのような画面が出ると思います。

テーブルのマークを選択すると、

そのままテーブルを選択して、作りたいテーブルのセルの個数を決めてクリックします。

そうすると、テーブルの作成までは出来ました。

ちなみに行の挿入、削除、列の挿入、削除も正常に出来ます。

問題はここからです。

セルを結合をしたいのですが、セルをクリックしてドラッグしても全くセルを選択することができません。

このままでは仕方ないので文字を入力してドラッグしてみます。

文字は複数選択することができました。

では、テーブルのマークからセルの結合を選択してみましょう。

しかし、やはりこれでもセルの結合をすることはできませんでした。

原因はブラウザにあり

原因は、使用しているブラウザでした。

※ここから解決法です。

新しいパソコンを買ってからブラウザは初期から入っていたMicrosoft を使っていました。

今までは特に問題もなかったのでこのブラウザをずっと使っていたのですが、どうやら原因はこれのようです。

あたらしくGoogle Chromeをインストールしてみることにしました。

では、Google Chromeで同じようにテーブルを作成してみます。

ここまではMicrosoft と同じです。

ではセルを複数選択してみます。

無事に複数選択できるようになりました！！

ではテーブルのマークからセルを選択します。

先ほどは選択することができなかったセルの結合が選択できるようになりました。

セルの結合をクリックします。

複数選択していたセルが結合されました。

まとめ

ブログをはじめてみようと新しくパソコンを買って、ワードプレスを始めた人が陥りやすい症状なのかなと思います。

私はテーブルの作成が全然できなくて二日間くらい悩んでました。

でも、ブラウザをGoogle Chromeに変更することによって無事に解決できたので良かったです。

私の同じような症状の人は是非試してみて下さい！

それでは、テーブルを正常に作成することができるようになったので、ここからテーブルの編集について説明していきたいと思います。

テーブルの編集

枠線の引き方

表の外枠に枠線を引く

WordPressのテーブルはExcelとはまた違った作り方なので最初は戸惑うかと思います。私も慣れるまで時間がかかりました。

まずは表の外枠に枠線を引く方法です。

テーブルのマークから表のプロパティを選択します。

そうすると、表のプロパティ画面が開くので、タブ[高度な設定]をクリックし、枠線の色という赤丸の部分をクリックします。

そうすると色という画面が開くので、好きな色を選択します。

今回はわかりやすくするために黒のままでやります。

選んだらOKをクリックします。

色を決めたら、枠線のスタイルを選んでいきます。

Border styleからSolidを選びます。

Solidは普通の細い枠線です。他のを選べば点線にしたりできるので、用途に合わせて変更してください。

OKをクリックするとテーブルの外枠に黒い枠線が引かれました。

表のセルに枠線を引く

続いてはセルに枠線を引く方法です。

まずは適当なセルをクリックして、テーブルのマークからセルを選択し、セルのプロパティをクリックします。

セルのプロパティが開いたら、タブ[高度な設定]をクリックし、枠線の色の赤丸の部分をクリックします。

色という画面が開くので、好きな色を選択します。

今回もわかりやすく黒でやっていきます。色を決めたらOKをクリックします。

続いて枠線のスタイルを決めます。

Border styleからSolidを選びます。

Solidは普通の細い枠線です。他のを選べば点線にしたりできるので、用途に合わせて変更してください。

OKをクリックすると選択していたセルに枠線が引かれました。

複数のセルに枠線を引きたいときは、セルをドラッグで複数選択した状態で同じように設定すると、選択した複数のセルに枠線を引くことができます。

色の付け方

表全体に色を付ける

表全体に色を付けるやり方です。

まずはテーブルのマークから表のプロパティをクリックします。

表のプロパティが開いたら、タブ[高度な設定]をクリックします。

背景色の赤丸で書かれている部分をクリックします。

好きな色を選びます。今回は青でやってみます。

色を選んだらOKをクリックします。

ここは何もせずにOKをクリックします。

表全体に色を付けることができました！

セルに色を付ける

次はセル毎に色を付けるやり方です。

適当なセルをクリックした状態で、テーブルマークからセルを選択し、セルのプロパティをクリックします。

セルのプロパティが開いたら、タブ[高度な設定]をクリックします。

背景色の赤丸で書かれたところをクリックします。

好きな色を選んで、OKをクリックします。

今回は緑でやってみます。

ここは何もせずにOKをクリックします。

セルに色を付けることができました！

複数のセルに色を付けたいときは、セルをドラッグで複数選択した状態で同じように設定すると、選択した複数のセルに一気に色を付けることができます。