曲がった事が大好きなひめたそん@himetasonです。
今日も相変わらずひねくれてます。
WordPressのテーマLION MEDIAをカスタムした結果
テーマを変更して約10日。
機能は豊富だし概ね満足している。
しかし、気になることがあった。
テーマの個性が強くて誰かと被ると分かっちゃう
LION MEDIAについて調べれば調べるほどに思った。
デザインがみんな似てしまう。
使い始めるまでは気付かなかった。
しかしいざ自分が使うと、同じテーマを使用しているサイトを見たらすぐに分かってしまう。
悪いことではないのだ。
ユーザビリティを考えたら気にする必要はないと思う。
しかしブログ運営をしている僕は、どうしても独自性が欲しくなる。
完全に自己満足なのだが。
シンプルなテーマというよりかっこいいテーマである事は間違いない。
デフォルトできっちり決まっている。
しかも無料でこのクォリティ。
それ故に使用者が増え似たサイトが増えてしまうのも頷ける。
記事更新ペースを落としてまでカスタマイズ
無知な僕がCSSと戦う毎日。
当然記事の更新ペースは落ちる。
ブロガーとしていかんぞ。
しかしこの知識はいつか役に立つかもしれない。
WordPressを使い続けるなら尚更だ。
カスタマイズ期間は勉強期間だったのだ。
当ブログのビフォーアフターを紹介
毎日コツコツと気になる部分をカスタムしていった。
細かいところはまだ弄るかもしれないが概ね完成。
Before
After
どうだろう、かなりデフォルトからイメージが変わったのではないか。
トップページだけではなく各ページも細かく弄っている。
当ブログを見てもらえばわかると思うが主な変更箇所を紹介しよう。
トップページのデザイン
LION MEDIAの特徴的な部分をほとんど消した。
特にヘッダー周辺である。
カラーを一色に統一し、アイコン全部削除。
検索窓はサイドバーに設置した。
そしてグローバルナビメニュー。
これは完全に憧れのSANGOから影響を受けているが、
このようにアニメーションするようにした。
これだけでも相当イメージが変わったのではないだろうか。
ついでにヘッダー画像を表示するようにした。
後は記事アーカイブの本文非表示。
見た目をシンプルにした。
オシャレ感を出したつもりだがこれからまた見直すと思う。
フッター周辺はBack to TOPを消したくらいでほぼデフォルトのまま。
現在はカラーや範囲などのデザインを変えた。
しかし無いのも不便なので代わりに別のボタンを設置しようと思っている。
後々またイメージを変えたくなるかもしれない。
なのでなるべくシンプルにする事を心がけてみた。
投稿ページのデザイン
このページを見てわかると思うが、記事上のアイキャッチを大きく表示。
パソコンで表示される横の小さいアイキャッチは削除した。
本文のエリアは目次のカラー変更。
そして少し文字を大きくし、見出しも変更した。
特に見出しの編集のしやすさはLION MEDIAの良いところ。
個別でカスタマイザーから編集できて楽である。
主に大きくデザインを変えた部分は以上だ。
後は細かい部分も手探りで弄っている。
ブログ全体にエフェクト追加
ブログ全体にエフェクトを追加した。
重くなるかと思ったがCSSのみの使用なのでそこまで重くならなかった。
ファーストコンタクト時の印象はかなり変わったと思う。
少し今風?な雰囲気にしてみた。
新しめのテーマ故に情報が見つかり難かった
CSS無知な僕は、大半をコピペで済ませようと思っていた。
しかし新しめのテーマだからか思ったより情報は少ない。
僕の調べ方が悪かったのかもしれないが、仕方ないので少しCSSを勉強した。
後はChrome標準機能の検証を使って弄りたい部分を調べる。
そして手探りでCSSを編集、追記していきやっと思うような形になった。
弄り方が分かってくると楽しくなる。
トライアンドエラーを繰り返し、変化を見る。
まるでゲームでもやっているかのようだ。
楽しみながらも少しばかりWordPressの事を学べたと思う。
まとめ
ここまで時間をかけデザインをカスタマイズした結果わかったこと。
「ここまで変えるならもうベースのテーマなんでもよくね?」
って事と、
「こんなに手間をかけるならその時間を執筆、リライトに費やした方がよくね?」
って事である。
そんな手間を短縮し簡単便利に利用できる有料テーマは優秀なのだろう。
結論やはりオススメするのは有料テーマだ。
しかしやった事は無駄とは思わない。
WordPress内部の仕組みに触れ、勉強することができた。
新しい趣味にしようではないか。
そしてここまでやったらもうテーマはLION MEDIAでいこう。
↑すいません「SANGO」に乗り換えました。
無知の初心者がわからないながら手探りでカスタマイズした。
今の所各ページにエラーは無いが、おそらくCSSを誤って弄ってる部分もあると思う。
なので自信を持ってCSS公開!とはいかないのはご了承いただきたい。
もし反響があればまた別途、勉強し直した上で考えたいと思う。
ではまた!