今僕のブログで使用しているテーマを編集した記録を公開します。
正直まだ全然できてないので中途半端な記事になると思いますが、進展させるごとに追記をしていこうと思うので、暖かい目で見守っていただけたらありがたいです。
カスタマイズしようと思った経緯
今の会社に入社したときはブログには興味があまりなかったが、業務でEC-CUBEやWordpress、Os-Classを触る機会がとても多いので、CMSをもっと深く知ろうと思いブログを始めました。
とりあえずxamppを使いローカル環境でテーマを作ったりしていたんですが、これじゃいつまで経っても本番に移行できんなと思い、見切り発車気味ですがさくらのレンタルサーバを借りて運用を始めました。
とりあえずのサーバを借りてWordPressを導入するまでは(「ブログの始め方」を参照)問題なく終えれたんですが、テーマ選びが結構難航しました。テーマの量がえぐい。
無料テーマだと、見た目をかっこよくするのに管理画面でのカスタマイズだけでは出来ずファイルを直接書き換える必要があるみたいです。
有料だと1万円弱払えばカスタマイズの自由度が高いテーマを導入できるみたい。
あと有料テーマの多くはSEO対策のポイントが抑えられているらしい。
参考:SEOについて(wiki)
上記のwikiではどういったコーディングが望ましいか例示しているがそもそもSEOに関するアルゴリズムは非公開らしい。wikiを見る限りテーマが関与しそうなところに関しては、「titleとmetaはちゃんとしろよ!見出しはちゃんとh1でくくれよ!」くらいかな。
SEOに興味があるし備忘録ブログなので、無料テーマで実現したいことは自分の手で実装していきたいと思います。
カスタマイズ対象テーマ
無料のプラグイン「STINGER8」にしました。理由は、よく見るブログがこのテーマを使っている&シンプルだったのでこれにしました。テーマ比較にあんまり時間は使っていないのでよく厳選するともっと便利なテーマがあるかもしれません。
管理画面でできること
管理画面でもできるのにコード書き換えやっちゃうと競合して落ちる!とかなると怖いから管理画面でできることは把握しとこう!
1.サイト基本情報の変更
サイトのタイトルとキャッチフレーズとサイトアイコンの登録ができる。
2.背景色の変更
ヘッダーだけとか柔軟な設定機能はなし。全部変わる。
3.ヘッダー画像の登録・変更
ヘッダーが画像をアップできるだけ。場所変えたりは無理。
4.背景画像
画像の元サイズに合わせて、拡大したり折り返したりできる。背景画像に関してはこの機能で十分。
5.メニュー
メニューの位置としてヘッダーメニュー、フッターメニュー、スマホ用メニューがある。表示する項目変更できるだけで、見せ方(アイキャッチ画像を表示する)などの選択・変更はできない。
6.ウェジェット
サイドバートップ、サイドバー、スクロール広告用の3か所に差し込み可能。
7.ホームページ設定
トップの固定ページ表示機能っぽいけどよくわからん。
8.追加CSS
サイトの外観、レイアウトのCSSを追加できます。
追加CSSに以下の内容を記述します。
background-color: #000;
}
上記の記述でカスタムへニュー項目の色が変わります。
この項目で既存のCSSを変更ができます。レイアウトちょこっと変えたいだけならファイルを変えるよりこっちの方が安全そうですね。
ちなみに反映したい場所のクラス名を知りたい場合は、F12押して確認するか、Wordpressのstyle.cssを参考にすれば簡単に編集できると思います。
その他
「投稿一覧」の一括編集でコメント欄をなくすことができます。その他設定変更は諸々あるけどレイアウトに関してはこれくらいかな?
シンプルを売りにしているテーマで、かつ無料のテーマなので幅広いカスタマイズは直接ファイルを書き換えないと難しいかも。
ただ、記事を見やすくしたり使いやすくすることはプラグインを導入することで可能だと思うので、こちらもまた紹介したいと思います。