WordPressで使える！北欧風メモ帳デザイン素材5選【おしゃれな装飾コード】

WordPressで使える！北欧風メモ帳素材

ブログの解説やコラムを可愛く彩る、オリジナルの装飾素材です。

▼ 使いたい画像を長押しで保存してください ▼

①白樺

②ポピー

③小花

④落ち葉

⑤ツリー

【使い方】

1. 上の画像を長押しして保存し、ご自身のWordPressの「メディア」にアップロードしてください。
2. メディア画面で、アップロードした画像の「ファイルURL」をコピーします。
3. 下のコードをコピーし、「★ここに自分の画像URLを入れる★」を自分のURLに書き換えれば完成です！

① 白樺（バーチ）風メモ

💡 タイトル

ここに本文が入ります

<div style="position:relative; width:100%; max-width:500px; margin:20px auto; overflow:hidden; border-radius:10px;"><img alt="" decoding="async" src="★ここに自分の画像URLを入れる★" style="width:100%; display:block;"><div style="position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:10%; box-sizing:border-box;"><div style="background:rgba(255,255,255,0.95); padding:20px; border-radius:5px; width:100%; box-shadow:0 2px 10px rgba(0,0,0,0.1);"><div style="margin:0 0 10px 0; font-weight:bold; color:#444;">タイトル</div><div style="margin:0; color:#666;">本文をここに入力</div></div></div></div>

② 大柄の赤い花（ポピー風）

📣 お知らせ

ここに本文が入ります

<div style="position:relative; width:100%; max-width:500px; margin:20px auto; overflow:hidden; border-radius:10px;"><img alt="" decoding="async" src="★ここに自分の画像URLを入れる★" style="width:100%; display:block;"><div style="position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:10%; box-sizing:border-box;"><div style="background:rgba(255,255,255,0.95); padding:20px; border-radius:5px; width:100%; box-shadow:0 2px 10px rgba(0,0,0,0.1);"><div style="margin:0 0 10px 0; font-weight:bold; color:#444;">タイトル</div><div style="margin:0; color:#666;">本文をここに入力</div></div></div></div>

③ 清楚な小花柄

🌸 ひとこと

ここに本文が入ります

<div style="position:relative; width:100%; max-width:500px; margin:20px auto; overflow:hidden; border-radius:10px;"><img alt="" decoding="async" src="★ここに自分の画像URLを入れる★" style="width:100%; display:block;"><div style="position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:10%; box-sizing:border-box;"><div style="background:rgba(255,255,255,0.95); padding:20px; border-radius:5px; width:100%; box-shadow:0 2px 10px rgba(0,0,0,0.1);"><div style="margin:0 0 10px 0; font-weight:bold; color:#444;">タイトル</div><div style="margin:0; color:#666;">本文をここに入力</div></div></div></div>

④ 黄金色の落ち葉

🍂 季節のメモ

ここに本文が入ります

<div style="position:relative; width:100%; max-width:500px; margin:20px auto; overflow:hidden; border-radius:10px;"><img alt="" decoding="async" src="★ここに自分の画像URLを入れる★" style="width:100%; display:block;"><div style="position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:10%; box-sizing:border-box;"><div style="background:rgba(255,255,255,0.95); padding:20px; border-radius:5px; width:100%; box-shadow:0 2px 10px rgba(0,0,0,0.1);"><div style="margin:0 0 10px 0; font-weight:bold; color:#444;">タイトル</div><div style="margin:0; color:#666;">本文をここに入力</div></div></div></div>

⑤ 規則正しいツリー柄

🌲 コラム

ここに本文が入ります

<div style="position:relative; width:100%; max-width:500px; margin:20px auto; overflow:hidden; border-radius:10px;"><img alt="" decoding="async" src="★ここに自分の画像URLを入れる★" style="width:100%; display:block;"><div style="position:absolute; top:0; left:0; width:100%; height:100%; display:flex; align-items:center; justify-content:center; padding:10%; box-sizing:border-box;"><div style="background:rgba(255,255,255,0.95); padding:20px; border-radius:5px; width:100%; box-shadow:0 2px 10px rgba(0,0,0,0.1);"><div style="margin:0 0 10px 0; font-weight:bold; color:#444;">タイトル</div><div style="margin:0; color:#666;">本文をここに入力</div></div></div></div>