WordPressのテンプレートを変更
WordPressをつかって数年経ちましたが、最近デザインを変更しました。
巷でSEOに強いと噂のStingerという無料テンプレートです。
これまでいくつかのWordpressテンプレート(wp.Vicuna Ext. Custom → Arthemia Premium → NewsPlus)を使ってきましたが、このStingerは余計な機能をはぶいている分、シンプルですっきりとした感があります。
また、なにがなんだかわからない状態になっていたプラグインもこの際きれいに棚卸しました。
個人的にはデザインもシンプルで使い勝手がよいので、無料テンプレートStinger 3に落ち着きそうです。
Stinger公式サイトはこちら: SEO対策に強い無料WordPressテーマ「Stinger」
Stinger作者のサイトはこちら: ENJILOG
Stingerカスタマイズメモ
デフォルトのテンプレートに下記サイトを参考にしながら、自分好みに若干カスタマイズをしております。
注意点としては、今後のアップデートを考慮して、Stingerのデフォルト設定を直接いじることはしないようにWordpressの子テーマを作成して、そちらへスタイルシートなどをコピーして変更する部分を修正しました。
まったくの度素人なので、function.phpはさわらないようにしています。
まずは子テーマを作成する
子テーマでコピーしたのは、Style.css, home.php, header.php, footer.phpあたりです。
子テーマについてはこちらが参考になります。
→ SaaSes Staff Blog: WordPressテンプレートのカスタマイズは子テーマで
→ The Present Note: 【重要】WordPressテンプレートのカスタマイズ前に・・・子テーマをつくってのカスタマイズ方法 -CSS篇-
自分好みにカスタマイズしてみる
取り急ぎ私が修正した点は以下の通り。
①背景色変更
②文字フォント変更
③文字装飾(PC向け、スマホ向け)
④ヘッダー固定メニューカスタマイズ(ソーシャルアイコンにWEBフォント利用)
⑤抜粋文字調整(4行→3行)
⑥Adsense広告位置の変更(記事中)
⑦ファビコン変更(プラグイン停止→オリジナル修正)
またプラグインのプラグインはWord Press Popular Postを利用して、サイドバーへ人気記事ランキングをサムネイルで表示しております。
参考にしたのは次サイトです。
①②③⑤
◆えけこのくるる
・記事タイトルの装飾
・トッページ記事タイトルの装飾
・トップページの記事の抜粋部分をコンパクトにする
・背景色の変更
・フォントの変更
④
◆Balance Note
・singer3の特別テーマ「Hunter」を使用してみました。
◆kotala’s note
・[wordpress][Stinger2]画面最上部に固定されたメニューバーの作り方
◆株式会社LIG
・Retinaでもボケない「シンボルアイコン」を使いこなそう!
◆Webpark
・ソーシャルアイコンをWebフォントで表示する方法を色々ご紹介
このあたりの先行者様のサイトを参考にすると、自分なりにカスタマイズができると思います。