ビジュアルエディターでテーブル(表)を作成

 

今回はビジュアルエディターでテーブル(表)を作成してみましょう。

表のことをhtmlではテーブルといいます。なのでこれからテーブルという言葉がたくさんでてきますが表のことをさしています。

まずは「管理画面」→「tinymce-advance」をクリックしましょう。

もし使用しないボタンにテーブルがある場合は上の使用するボタンに移動しましょう。

移動する場所はどこでもいいので、使いやすいところにドラッグアンドドロップしてください。

テーブルを使用するボタンに移動

移動したらこんな感じになります。

テーブルが使用するボタンに移動しているか確認

これでテーブルを使うための準備ができました。

今回はフッターの3カラムに作成していきますが、投稿ページや固定ページでも使い方は一緒です。

次に「管理画面」→「外観」→「ウィジェット」→「フッター左」をクリックします。

わかりくい場合はこちらのフッターの3カラムの使い方を見てください。

まずは下記の写真のようにビジュアルエディターにある表のマークをクリックします。

そうしますとテーブルと出てくるのでそれをクリックします。

その次にどのくらいのテーブルを作るか決めます。

今回は横8マスの縦に7マスのテーブルを作成していきます。

青い枠がでてきますので8×7の位置でクリックします。

テーブルマークをクリック

これで表がを作成できました。

次に今回は整骨院の名前、住所、電話番号をはじめに入れますのでいらないマスを結合させていきます。

htmlではマスではなくセルと呼びますのでここからはセルと呼んでいきます。

くっつけたいセルをドラッグします。

セルをドラッグした様子

次にセルをクリックします。そうするとセルの結合がでてきますのでクリックしましょう。

 

テーブルマーク→セル→セルの結合の順番にクリック

これでセルの結合ができました。

住所と電話が入るところも結合していきます。

セルが結合された様子

次にセルをクリックして情報を入れていきます。

下記の写真のような感じになります。

日曜の時間の部分の結合する前のテーブル

日曜はお休みなので縦にセルを結合させます。

上と下のセルをドラッグします。

テーブルマークをクリックしてセルをクリックします。

次にセルの結合をクリックしますと結合できます。

上と下のセルをドラッグ。次にテーブルマーク→セル→セルの結合の順番にクリック

あとは結合されたところをクリックして文字をいれれば完成です。

テーブルが完成した写真

これで表を作成することができました。

 

 

  関連記事 - Related Posts -

 

  最新記事 - New Posts -

 

- Comments -

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


Copyright© 🐩プードル鍼灸整骨院🐩 , 2017 All Rights Reserved.