affinger-color-setting-table-20200227_ec

WordPress

AFFINGER5で、「表」の枠線や背景色の初期設定をカスタマイズする手順【WordPressブログ】



今回は、このブログでも愛用中のWordPressテーマ「WING(AFFINGER5)」における…

「表」の初期設定
をカスタマイズする手順

をご紹介していきたいと思います

まずWordPressにおける表とは…

affinger-color-setting-table-20200227_1-03

↑ こういったもの

具体的なカスタマイズ内容としては…

  • 背景色
  • 枠線色
  • テキスト色
  • 太字にする

などの初期設定が変更できます

そして「WING(AFFINGER5)」なら、このカスタマイズは超簡単です

それではさっそく見てきましょー🐥

「表」の使い方自体は、↓ をどうぞ♪

WordPress_表の基本的な作成手順_アイキャッチ
WordPressで「表」を入れる・作る手順【プラグイン「TinyMCE Advanced」を使用】

続きを見る

当ブログのWordPress環境

▼ 当ブログのWordPressテーマ AFFINGER5

wing300_gif_osusume

プロフィール

azuki_01

あずき@ブロガー

フリーランス3年目 / 元アパレル / WordPressとSEOを独学で学んで、10年間の会社員生活から独立しました

・Twitter → @azuki_rinrin

・インスタ → azuki_rinrin

【アドセンス並列表示の枠線編】AFFINGER5における色設定の手順【「表の色設定」を変えれば消せる】

pc-work-202001_01

まずは、カスタマイズ画面を開きましょう(下記手順です)

affinger-color-setting-table-20200227_top-01

↑ WordPress管理画面 > 外観 > カスタマイズ をクリックします

affinger-color-setting-table-20200227_top-02

↑ 左側のメニュー一覧から、「オプションカラー」をクリックします

affinger-color-setting-table-20200227_1-01

↑ つづいて、「table(表)」をクリックします

affinger-color-setting-table-20200227_1-02

↑ 表のカスタマイズ画面が表示されました

初期設定では…

affinger-color-setting-table-20200227_1-03

↑ こんな感じに設定されてます

試しにちょっと極端な例として…

affinger-color-setting-table-20200227_1-04

↑ このように設定してみます

プレビュー画面を見てみると…

affinger-color-setting-table-20200227_1-05

↑ こんな感じになりました

自分の好きな配色にカスタマイズしてみましょう

ちなみに参考例として、僕が実際に使ってる配色は…

affinger-color-setting-table-20200227_1-06

↑ 1番上の「表のボーダー色」だけ、トップグレー系に変えてます

具体的なカラーコードは、「#e0e0e0」です

そのほかの項目は、すべて初期設定のまま!

ちなみに一度変更してから最初の設定に戻したいときは、 色を選択 > クリア でデフォルト状態に戻せます

改めてプレビューを確認してみると…

affinger-color-setting-table-20200227_1-07

↑ 最初の状態よりも、だいぶ柔らかい印象の枠線に変わりました

設定できたら、画面上部の 公開 をクリックして設定を保存しましょう

これで、表の色設定はOKです

お疲れさまでした♪

あずき🐥

初期設定ではなく、その表ごとでのカスタマイズ手順は ↓ をどうぞ♪

WordPress_表の基本的な作成手順_アイキャッチ
WordPressで「表」を入れる・作る手順【プラグイン「TinyMCE Advanced」を使用】

続きを見る

▼ 当ブログのWordPressテーマ AFFINGER5

wing300_gif_osusume

プロフィール

azuki_01

あずき@ブロガー

フリーランス3年目 / 元アパレル / WordPressとSEOを独学で学んで、10年間の会社員生活から独立しました

・Twitter → @azuki_rinrin

・インスタ → azuki_rinrin

-WordPress

Copyright© あずきのぶろぐ。 , 2020 All Rights Reserved.