こんにちは！あいうえおLIFE（@pledge17uchs）です！
JINのCSSカスタマイズの種類多すぎ…調べるのめんどいし、おしゃれカスタマイズだけ教えてくれたら助かる
今日は、こんなお悩みに答えていきます。
本記事の内容
- JINおすすめカスタマイズ6選
JINを使っているブロガーさん多いですよね！直接、本人には聞きづらいから、ググったりして調べながらカスタマイズしていくのってブログあるあるですよね。
JINカスタマイズに関しては、それなりにチャレンジしてきましたので参考になると思います。
備忘録的な感じでまとめたら役立つかなと思い、今回まとめてみました！
JINおすすめカスタマイズ6選
基本的なおしゃれカスタマイズは、下記の「FOR JIN」様のブログに掲載してくださっていますので御覧ください。
控えめに言って、【神】です。
FOR JIN様サイトのカスタマイズにはないものを下記に6つピックアップしました。
- マガジンスタイルで、サムネに重なるカテゴリー名をタイトル下に移動する
- グローバルナビやサイドバーにボックスナビを作成する
- SNSシェアボタンの上に文字を入れる
- 検索ボックスのデザインをSANGO調にする
- ヘッダー下に影をつけてSANGO調にする
- プロフィールにボタンをつける【リンク先へ誘導】
下記で詳しく紹介します。
①マガジンスタイルで、サムネに重なるカテゴリー名をタイトル下に移動する
これ困りました。トップページをベーシックスタイルではなく、マガジンスタイルにしているとき、サムネにカテゴリ名が重なってモザイクみたいになるんですよね。
これは本当にありがたかったです！
現在、当ブログは有料プラグインのCARATを入れているので、ボタン一つでサムネに表示するカテゴリの位置を変更できていますが、気の利いたCSSで泣きました。
②グローバルナビやサイドバーにボックスナビを作成する
JINでもcocoonでもカスタマイズ可能かと思いますが、これが作成できると視認性が上がるので楽しいです。僕も使っています（今は、サイドバーだけに設置しています）
テーマがJINの場合でしたら、Fontawesomeでなく、JINのアイコンフォントにするとJINオリジナルって感じでおすすめです。
その方が、サイトスピードも速くなります。
③SNSシェアボタンの上に文字を入れる
僕はSNSシェアボタンは上部は非表示にして、記事下にのみ表示させています。
SNSシェアボタンの上に、”シェアしてね！”とか入れられたらとおしゃれですよね。
SNSシェアボタンの上に、文字があるのってどこかSANGO調でいい感じです。
④検索ボックスのデザインをSANGO調にする
またまたSANGO調にチャレンジです！
SANGOの特長としてはマテリアルデザインですよね。
影がついた感じとか、ポップな優しい色合いが柔らかくて思わずJINにも取り入れたくなります。
そのままでもいいじゃんって言われても、変えれるならやりたいじゃん！だっておしゃれだもん！
カスタマイズしたくなるのは、小さいけど大きい想いなのです。
⑤ヘッダー下に影をつけてSANGO調にする
これやり始めてから他のJINのブログと差別化できた感じします。自己満ではありますが。
このほかにも、box-shadowのCSSはヘッダーだけでなく、コンテンツマガジンの切り替えタブのナビにも影をつけることができます。
⑥プロフィールにボタンをつける【リンク先へ誘導】
プロフィールから固定ページの自己紹介や、アフィリエイトリンク先などに案内したいときに、ボタンがあるとついつい押したくなります。
僕もプロフィールの部分に、【ごあいさつ】という【自己紹介固定ページ】へのリンク先ボタンを設置することができました。
いろいろな角度から案内できるのはいいですね。
まとめ｜JINカスタマイズはググれば教えてもらえるからありがたい
JINカスタマイズ初心者
- このブログのカスタマイズどうやってるんだ？
- PHPいじるとか、JavaScript追加するとかこわい…
- おしゃれにし始めると、夜も眠れないくらいデザイン気になって記事執筆が進んでない…
これは２ヶ月前の僕です。やっと２ヶ月経過してデザインへの欲は落ち着きました。
しかし
- やりすぎて記事書けない
- バックアップも取らずに作業して、失敗して訳わからなくなった
こうならないように、バックアップは必ず取りましょう！
プラグインのBackWPupがおすすめです。
それでは、今日はここまで読んで頂きありがとうございました！
