クリスマスが近づいてくると、街もお店も少しずつクリスマスらしくなってきます。
赤や緑の飾り。
クリスマスツリー。
リース。
オーナメント。
いつもの景色なのに、クリスマスの飾りが入るだけで雰囲気がガラッと変わりますよね。
だったら、
WordPressの記事もクリスマスに着せ替えてみませんか?
→クリスマスコーデ無料配布中
見出しだけ赤や緑にするのではなく、
H2やH3。
箇条書き。
Q&A。
BOX。
ボタン。
そして記事の背景まで。
記事全体を一つのクリスマスデザインとしてまとめると、いつもの記事とはかなり違った雰囲気になります。
このページも実際に、
AIちいちゃんパレット Proの「クリスマスコーデ Ver.1」
を使って着せ替えています。
つまりこの記事は、WordPressの記事をクリスマスデザインにする方法を説明しながら、実際の完成見本もそのまま見られるページです。
今回は、文章の読みやすさを残しながらWordPressの記事をクリスマスらしくする方法を紹介します。
WordPressの記事をクリスマスデザインにするには?
WordPressの記事をクリスマスらしくしたい。
そう考えたとき、最初に思いつきやすいのは、
赤。
緑。
クリスマスのイラスト。
このあたりだと思います。
もちろん、それだけでもクリスマスらしさは出せます。
でも実際にクリスマスコーデを作ってみると、
色を変えるだけでは、なかなか記事全体がクリスマスにはなりませんでした。
たとえば普通のH2を赤くして、その横にリースを一つ置く。
クリスマスではあります。
でも記事全体を見ると、
「普通の記事にクリスマスの素材を置いた」
という感じが残ってしまいます。
そこで大切になるのが、
一つのパーツではなく、記事全体を一つのデザインとして考えること。
これでした。
まずはクリスマスらしい配色を決める
クリスマスデザインといえば、やっぱり赤と緑。
でも、
真っ赤。
真緑。
を記事全体に大量に使うと、かなり強いデザインになります。
ブログ記事の場合は、広告やポスターと違って長い文章を読むこともあります。
そのため、クリスマスコーデでは、
- 赤
- 深い緑
- アイボリー
- 落ち着いたブラウン系
- 白
などを組み合わせています。
赤と緑はクリスマスらしさを伝えるアクセント。
本文の周りにはアイボリーや白などの明るい色。
こうするとクリスマスらしさを残しながら、文章も読みやすくなります。
クリスマスカラーは全部に使わなくていい
ここも大事です。
クリスマスだからといって、
見出しも赤。
BOXも赤。
ボタンも赤。
文字も赤。
では、どこを見ればいいのか分からなくなってしまいます。
赤を使ったら、次は深緑。
その周りには白やアイボリー。
強い色と休ませる色を一緒に使う。
ブログ記事では、このくらいの方が読みやすくなります。
見出しそのものをクリスマスデザインにする
次はH2やH3などの見出しです。
今回のクリスマスコーデでは、
普通の見出しにクリスマス素材を一個置くだけ
にはしませんでした。
たとえばH2なら、
クリスマスカードのような横長デザイン。
そこへ、
オーナメント。
ヒイラギ。
クリスマスツリー。
手描き風のライン。
などを組み合わせています。
一つずつの素材を目立たせるのではなく、
見出し全体で一つのクリスマスグラフィックに見えること
を意識しています。
そして、もう一つ大切なのが文字です。
装飾が増えるほど、文字が負けやすくなります。
そのため見出し文字は、装飾の中でもちゃんと読める大きさと太さを残します。
クリスマスツリーより、
見出しの内容を読んでもらうことの方が大切ですからね(笑)。
H2だけクリスマスにしても記事全体は変わらない
H2が完成すると、
おお、クリスマス!
となります。
でも、その下へスクロールすると普通の記事。
次のH2で、またクリスマス。
これだとクリスマスが、
出たり消えたり
するんですよね。
そこでH3以下にも、同じ世界観を少しずつ入れていきます。
ただし、H2と同じくらい派手にはしません。
H2が一番強い。
H3は少し控えめ。
H4以下はさらにシンプル。
見出しの重要度に合わせて装飾も弱くしていくと、記事として読みやすくなります。
箇条書きやBOXも同じコーデにそろえる
記事の中にあるのは見出しだけではありません。
箇条書き。
POINT。
特典BOX。
ボタン。
こうしたパーツもあります。
見出しだけクリスマスなのに、その直後のPOINTがいつものブルー。
その下のボタンだけ別のデザイン。
これでは少しバラバラに見えます。
そこで、こうした記事パーツにもクリスマスコーデを適用します。
ただし、
全部を同じ形にはしません。
POINTにはPOINTの役割。
ボタンにはボタンの役割。
特典BOXには特典BOXの役割があります。
役割は残したまま、
配色・ライン・素材・文字の雰囲気をクリスマスで統一する。
これがポイントです。
Q&Aもクリスマスデザインにできる
質問と回答をまとめるQ&Aも、記事ではよく使うパーツです。
今回のクリスマスコーデでは、Q&Aにもクリスマスらしいデザインを入れています。
WordPressの記事をクリスマスにできますか?
できます。
と入力しただけでは、AIちいちゃんパレット Proから見ると、まだ普通の文章です。
先にパレットでQ&Aパーツへ変換してからクリスマスコーデを適用します。
そうするとQ&Aも、コーデに合わせて着せ替わります。
Q&Aがクリスマスにならないときは?
Q&Aへ変換する前の普通の文章には、着せ替えが反応しません。
先にQ&Aパーツへ変換してから、クリスマスコーデを適用してください。
これは他のコーデでも同じです。
背景まで変えると記事全体の雰囲気が変わる
そして、かなり大きかったのが、
記事の背景。
H2。
H3。
箇条書き。
Q&A。
BOX。
ここまでクリスマスにしても、それぞれの間には普通の本文があります。
そのため記事全体を見ると、
「クリスマスのパーツが置いてある」
という感じが少し残ります。
そこで本文背景にも、かなり薄いクリスマスデザインを入れました。
すると、
ガラッと変わりました。
別々に存在していたH2やQ&Aなどが、同じ世界の中に入ったように見えるようになります。
背景って、単なる飾りではないんですね。
別々の記事パーツを一つのコーデとしてつなぐ役割
もあります。
クリスマス背景は薄いくらいがちょうどいい
じゃあ背景にも、
ツリー!
サンタ!
プレゼント!
雪!
と入れればいいのかというと、そうでもありません(笑)。
ブログ記事では文章を読みます。
背景が目立ちすぎると、
文字より背景を見てしまう。
長い記事では目も疲れます。
そのため今回のクリスマスコーデでは、背景はかなり薄くしています。
普通に読んでいると邪魔にならない。
でもページ全体を見ると、
なんとなくクリスマス。
このくらい。
「背景画像を見せる」のではなく、
記事全体をなじませるための背景
として使っています。
スマホで読めることも忘れない
WordPressの記事をデザインするとき、PCだけで確認すると危険です。
PCでは、
「右側に大きなクリスマスツリーを置いたらかわいい!」
となっても、スマホでは本文の上にツリーがかぶるかもしれません。
横幅もかなり狭くなります。
そのためクリスマスコーデでも、
- 文字にイラストをかぶせない
- スマホでは装飾を小さくする
- 必要なら一部の素材を非表示にする
- 横スクロールを発生させない
- 本文の左右余白を残す
といった調整が必要になります。
PCで豪華に見えることより、
スマホでも普通に記事を読めること。
こちらを優先します。
クリスマスらしさは「色」だけで作らない
ここまでをまとめると、WordPressの記事をクリスマスデザインにするときは、
赤と緑に変えて完成
では少しもったいないです。
色。
見出し。
ライン。
背景。
イラスト。
BOX。
ボタン。
Q&A。
余白。
文字。
こうしたものが同じ方向を向くことで、
記事全体がクリスマスらしく見えるようになります。
ただし、全部を派手にする必要はありません。
H2はしっかりクリスマス。
背景はうっすら。
本文は読みやすく。
強いところと弱いところを作る方が、記事としてまとまります。
CSSを書かずにクリスマスコーデへ着せ替える
ここまで読んで、
「それ全部、自分でCSS書くの?」
と思った人もいるかもしれません。
一個ずつ作るなら、かなり大変です。
H2のCSS。
H3のCSS。
Q&A。
箇条書き。
ボタン。
背景。
さらにスマホ対応。
そしてクリスマスが終わったら元に戻す。
ちょっと大変ですよね(笑)。
そこでAIちいちゃんパレット Proでは、こうした記事パーツをまとめて変更できるコーデという仕組みにしています。
クリスマスなら、
クリスマスコーデを選んで着せ替える。
季節が終わったら、また別のコーデへ。
テーマそのものを変更する必要はありません。
このページで使っているクリスマスコーデを無料配布しています
そして、
今読んでいるこの記事で使っているデザインが、そのクリスマスコーデです。
完成画像だけを見せているわけではありません。
実際のWordPress記事で、
H2がどう見えるのか。
H3はどうなるのか。
箇条書きは?
Q&Aは?
背景は?
スマホでは?
このページをそのままスクロールして確認できます。
気に入ったら、
AIちいちゃんクリスマスコーデ Ver.1
を無料で使えます。
クリスマスの記事を書いたとき。
12月だけブログの雰囲気を少し変えたいとき。
いつもの記事をちょっと楽しくしてみたいとき。
服を選ぶみたいに、
今日はクリスマスにしよう🎄
くらいの感覚で使ってもらえたらうれしいです。
そしてクリスマスの次は、
ハロウィンコーデも制作予定です。
季節が変わったら、記事もまた違う服へ。
AIちいちゃんクローゼットに、少しずつ新しいコーデを増やしていきます。