AFFINGER5で枠線を削除して【スッキリした表】を作る方法

AFFINGER5で作成した表の枠線を削除する方法を紹介します。

ぼってりした印象の表も枠線を削除すれば見た目スッキリ！

お洒落でスタイリッシュに見せることができます。

こんな人のお役に立てる記事です。

小豆

表の枠線を削除したい！
ネットで検索して色々と試してみたけど、どれも上手く枠線が削除できない。
AFFINGER5にはそういった機能はついてないの？

AFFINGER5なら簡単に表の枠線を削除できる

表の枠線を削除する方法をネットで検索すると、多くの方法が出てきますよね。

小豆

どれも試してみたけど、なぜかAFFINGER5では上手く枠線が削除できなかった。

AFFINGER5を使用しているなら、こんな面倒なことをわざわざする必要はありません。

デフォルトの機能で、簡単に表の枠線を削除することができます。

ということで、まずはデフォルトの表（枠線あり）と枠線を削除した表を見比べてみて下さい。

デフォルトの表でも別に悪くはないですが、枠線を削除した表の方が見た目の印象がスッキリしていますね。

枠線なしの表の作り方

AFFINGER5で表の枠線を削除する方法はすごく簡単！

たった2ステップで終わります。

step
1表を作成する

まずは、通常通り表を作成します。

step
2表の枠線を削除する

枠線の削除は、【テキストエディタ】で行います。

テーブルタグを全て選択

装飾なしテーブルをクリック

表の枠線が削除されました。

大福

すごく簡単だね。

テキストエディタに装飾なしテーブルが表示されていない場合は、以下の手順で表示してください。

WordPressメニュー→AFFINGER5管理→投稿・固定記事→⚙管理画面→装飾なしテーブルのチェックを外す

最後に必ず画面下のsaveを押してください。

配色を意識してワンランク上の表を作ろう

表のカラーを意識すると、さらに見た目の良い表を作ることができます。

小豆

どういう色の組み合わせがベストなのかわからない。

こんな場合は、以下のサイトがすごく参考になります。

配色の見本帳に移動

大福

使い方は簡単！
ベースとなる色を1色指定すると、最適な色の組み合わせを紹介してくれるよ。

• ベースとなる色を選択

  

  ベースとなる色を１色決めて、クリックします。




• 配色パターンを選択

  

  画面を下の方までスクロールしていくと、選択した色と相性のいい色の組み合わせか表示されています。

  配色パターンの中から使用したい色をクリック。




• カラーコードをコピー

  

  表示されたHTMLカラーコードをコピー。




• 表にカラーコードを設定

  

  コピーしたカラーコードを、任意のセルに指定します。

  背景色の指定方法

  1. カラーを変更したいセルにカーソルを合わせる
  2. テーブルアイコン→セル→セルのプロパティー
  3. 高度な設定を選択→背景色にカラーコードを貼り付け

まとめ：見やすい表を作ろう

AFFINGER5で作ったデフォルトの表は、シンプル過ぎてなんだか素っ気ない印象です。

カラーを設定、枠線を削除するだけで一気にお洒落且つスタイリッシュな表を作成することができます。

ぜひやってみてください。

小豆

枠線の削除方法はわかったけど、そもそも表の作り方自体がよくわからない。

こんな人は、こちらの記事を参考にしてください。

AFFINGER6の購入を検討している人は、こちらの記事が参考になるはずです。

AFFINGER利用者向けオリジナル特典の販売

＼ AFFINGER6にも対応済み ／

AFFINGERをすでに利用しているユーザー向けの「カスタマイズ＆役立つテクニック」集です。

目的に合わせて、以下の2つを用意しました。

特典詳細ページへ移動する