ノートっぽいスキンを作ってみた(一部を除きマルチカラー対応)

nt_multi_1

涼しくなったなぁ~。と思っていたら、もう師走!
今年も一か月を切ってしまいました(汗)

11月は少し予定が入っていて、なかなか記事を書くことが出来ませんでしたが、この12月であとどの位、記事を書くことが出来るかなぁ?
ラストスパート頑張りたいと思います(#^.^#)

今回は、「hタグ」に力を入れたデザインにして見ました。
太い色鉛筆(クレヨンかな?)で書いたようなや線吹き出し風のデザインも入れてあります。
黄色耳の付箋と、#mainの左肩のクリップはヒバナさんの画像ですが、他の装飾はcssで仕上げてありますので、お好きな色に変えて使ってみて下さい。

h1タグとサイドバーのタイトルは、色鉛筆っぽく見える透明画像を貼ってあります。background-colorを好きな色に指定頂ければ、オリジナルのサイトが出来上がると思いますので、是非トライしてみて下さい。

また、見本のサイドバーのタイトルは、破線を指定(紫色)していますが、実線やドットを指定すればまた違った感じになると思いますので、遊んでみて(笑)下さい。

h2タグの付箋だけは、変更できませんが、ヒバナさんのサイトへ行ってダウンロードも可能ですので、是非トライしてみて下さい。

今回は、ナビやヘッダーはいじっていません。オリジナルのままです<m(_ _)m>
理由としては、今回のhタグが派手目になってしまった?為に、ごてごてし過ぎるよりはシンプルに。という事で。

また、背景画像ですが、今回も写真ACさんの素材を使わせて頂きました。
こちらは再配布NGとなっていますので、画像は入っていません。
ご自身で、好きな画像を設定下さい。

スポンサーリンク

ノート*マルチカラー

上の画像では、少し見難いかもしれませんが、線の端が滲んだような?散ったような縁になっています。
その「味」を堪能頂ければと思います。

nt_multi_2

ブログタイトル

❤ 今回はGoogleのWebfontは使っていません。前記事に書いたのですが、ヘッダー画像を使ってみても良いのでは?と思っています。

見出し類

❤ h1~h5まで設定致しました(h6)は私が使わないので設定していません(笑)

以前、リクエストのあったタグ周りの装飾に少しチャレンジしてみました。

サイドバーのタイトル

❤ サイドバーは、今は破線状になっていますが、線種を変える事が出来ます。幅を変えると、色鉛筆っぽく見えなくなるので、ご注意下さい。

一覧リスト エントリーカード(デフォルト)、タイル状

❤ エントリーカード

デフォルトのエントリーカードでは、一覧リストはこの様になります。

nt_multi_3

3列や2列のタイル状は、次のようになります。 写真の多いブログにも、邪魔をせずに良いかと思います。
nt_multi_4

下のリンクよりダウンロード下さい。 手順等は、Simplicityさんのこのページが見やすいと思います<m(_ _)m>

ダウンロードしたファイルをご自身のSimplicityテーマのskinフォルダへ追加頂き

ダッシュボード ➡ 外観 ➡ カスタマイズ ➡ スキン よりこのskinを選択してお使い下さい。

スキン追加方法の手順は、Simplicityさんのサイトでもご確認頂けます。

今回に限らず、参考にさせて頂いているサイト様🌸

いつも有難うございます

以前「stripe」というはてなブログテーマを作ったのですが、その時に使ったストライプ背景のCSS(グラデーション)を応用してマスキングテープ風デザインやドット柄、チェック柄背景パターンのCSSをご紹介します。 ブログ記事は白背景に文字が続くと、特に長文では読む方は単調に感じてしまいます。 ガーリーなデザインでブログ記...

どのサイト様もとてもセンスが良くて、勉強になります。まだまだ足元にも及ばないですが、眺めては少しずつ近づけるよう、頑張って行きたいと思います。

励みになります
ランキングに参加しました。
「ダウンロードしたよ。」の
応援クリック頂けると嬉しいです(#^^#)
にほんブログ村 IT技術ブログ WordPressへ
にほんブログ村


スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする