STINGER専用シンプルデザイン子テーマ「SIMPLESTER 」

あなたのSTINGERを美しくしてみませんか?

SIMPLESTERのカスタマイズ

customize

特にカスタマイズしなくてもいいテーマを目標に制作していますが、カスタマイズすると更に自分色に染めることが出来ます。ここでは幾つかSIMPLESTERのカスタマイズの仕方をご紹介します。

 

ヘッダー画像&ロゴの設定

ページ上の画像(ヘッダー画像)やロゴのを設定&変更するには外観>カスタマイズ>と進み各セクションを設定していきます。

customize1

ロゴの設定

SIMPLESTERではロゴを表示する部分を高さ25pxで固定しています。iPhone等のRetinaディスプレイでも綺麗に表示するために設定するロゴの高さは2倍の50pxが好ましいです。(というか50pxがイイです!)

customize2

ヘッダー画像の設定

ヘッダー画像はSIMPLESTERの横幅1116pxに合わせたサイズ(1116px×270px)で作成し設定します。

customize3

全体の色の変更

デフォルトでは黄色がメインカラーになっていますが、簡単に好きな色に変更することが出来ます。

まずは先程でも開いたカスタマイズで設定できるのがh2タイトル(丁度この上の見出し)やサイドバーのRSSボタンなどです。早速設定しちゃいましょう。

customize4

その他テーマ内で設定しているカラーもこのまま設定しちゃいましょう。外観>テーマの編集を開きCSSファイルを編集します。「#F62459」と記載されている箇所を好きな色に変更すればOK。複数箇所あります。

■ページトップボタン(ページ右下)■TOP記事一覧のホバー時のインジケーター■TOP記事一覧のメタ要素■h3見出しの下ボーダー■ページネーション■TOPメニューホバー時の色■記事ページのパンくずリスト・タグリストの色■記事ページのSNSボタン周りホバー時の色■サイドバーの新着記事一覧・カテゴリー・タグホバー時の色

ブラウザの検索機能を使って手作業で変更してもイイですが、面倒なのでテキストエディタ(terapad等)やWEBサービス等を使用して一括置換すると楽です。

 

メニューバーのアイコンの設定

ヘッダー画像の下にあるメニューバーのテキストの前に表示されているアイコンですが、外観>メニューより項目を編集することでアイコンの設定が可能です。項目の種類によって変更してみてください。

変更の仕方は簡単。項目を開き、タイトルの属性部分に[home/link/cate/page/envelope]のいずれかを入力し保存していきます。

[home]はTOPページに戻る項目の時、[link]はリンクの項目の時、[cate]はカテゴリー項目の時、[page]は固定ページの時、[envelope]は問い合わせ項目の時です。

customize5

その他カスタマイズ

SIMPLESTER特有のカスタマイズ事項はコレぐらいです。基本的にSTINGERのカスタマイズに依存するので公式ページにて色々と調べてみてください。

STINGER公式サイト

 

ライセンスについて

オールフリーです。基本STINGERで許可されていることについては全て同様に許可しています。改変もOK。ただし無許可での再配布&だけはやめて下さい(汗)

STINGERとSIMPLESTERで自由なブログを作ってみてはいかがでしょうか!!

公開日:
最終更新日:2015/12/20