colors, colors 3c, Café mélange, Café mélange 3C

2009年10月26日　「ｃolors」「colors 3c」配布
              11月02日　「Café mélange」「Café mélange 3C」配布
2010年 09月16日　拍手機能と新フッターに対応しました。

プラグイン4とプラグイン5をそれぞれ記事の上と下に設置しました。
プラグイン4：トップページとそれに続く記事一覧ページで、記事の上に表示されます。
タイトルはデフォルテで非表示になっています。
                           タイトルを表示させたい場合は、カスタマイズを参照してください。
プラグイン5：詳細記事ページで、記事とコメントフォームの間に表示されます。タイトルは無しです。


トップ画像以外は透過済み画像ですので、記事の背景を変更することができます。プラグインのヘッダーは曲線とアイコンの二つのレイヤーを使用しているので、アイコンだけ変更することも可能です。追記に数種類の色のアイコンを載せていますので、お好きな色に変えてください。変更の仕方は下で説明しています。


作者様の規定により、「colors」と「colors 3C」は商用利用禁止です。
表示確認データはこちらを参照してください。
新HTML + CSS を使用しています。詳しくはこちらを参照してください。
カテゴリーとアーカイブ、キーワード検索表示ページでは、記事上部に該当記事のリストが表示されます。
記事の下にランキング用バナー等を設置する箇所があります。バナーや広告を貼り付けたい方はこちらを参照してください。
コメント投稿者のメールアドレスは表示されません。コメント一覧ページの投稿者名にアドレスのリンクが付きますので、そちらで確認してください。
このテンプレートはSEO用です。ブログ管理ページ左側の「便利ツール」にある「検索エンジン登録」をするとSEOの確率が上がります。
画像は変更自由です。この場合、ページ最下部の画像著作権者のリンクも変更してください。
素材の加工、他での使用は厳禁です。テンプレートご使用の際には利用規約を一読ください。
ブログパーツの幅：「colors」「Café mélange」は180px以下を、「colors 3c」「Café mélange　3C」は160px以下を使用してください。

プラグイン
「colors 」「Café mélange 」プラグイン2が折りたたみ式です。
「colors 3c」「Café mélange 3C」はプラグイン1が左側で、プラグイン2+3（折りたたみ）が右側です。
2カラムのプラグインは左に変更できます。詳しくは追記を見てください。

画像をクリックすると、プレビューが見られます。

colors


colors 3c

Café mélange


Café mélange 3C

2カラムのプラグインを左側に持ってくる

1. テンプレート編集ページ左の編集用エディターで「Plugin」までスクロールします。
2. 最初の「プラグインの配置」で左を選択します。そうすると、プラグインは自動的に左になります。
3. プラグイン自体はこれでおしまいですが、プラグインの上にあるアドミンブロックが右寄りのままなので、この部分を左寄せに変更します。
4. 編集ページ右下のCSSを、最後のほうまでスクロールすると、「プラグイン」ブロックになります。
5. 一番最初の「アドミンブロック」を下記のように変更します。

/*************************************************

  プラグイン

*************************************************/
/* アドミンブロック */
div.AdminBlock {
    margin: 0 10px;
    padding: 10px 10px 0;
    text-align: right
}

上の指定を下のように変更する。

/*************************************************

  プラグイン

*************************************************/
/* アドミンブロック */
div.AdminBlock {
    margin: 0 10px;
    padding: 10px 10px 0 20px;
    text-align: left
}

これで、アドミンブロックも左に寄りました。

カスタマイズ用アイコン

作ってはみたものの、テンプレートで使わなかったアイコンです。プラグインのアイコンを他の色に変えたいときにどうぞ。左のアイコンは記事ヘッダー用です。画像を右クリックで保存してから使用してください。直リンク禁止です。

画像の使い方
プラグイン
まず、上の画像を保存した後、ご自分のブログへアップロードしてください。そのあと、テンプレート編集ページ右下のCSSの、最後近くの「プラグイン」ブロックまでスクロールします。ブロックの上の方に「プラグインタイトル」の指定個所があります。

h4.PluginTitle {
	padding-left: 18px;
	margin: 0;
	background: url(http://blog.cnobi.jp/v1/blog/user/94865e2082d6a98dce84b98a914f5c2a/1255952874) left center no-repeat;
}

backgroundのURLを、アップロードした画像のURLに変えます。これで、プラグインのヘッドのアイコンだけ色が変わります。

記事タイトル
記事タイトル用のアイコンは、色変わりで４色出るようにスクリプトで指定してあります。アイコンを上の画像と差し替え、または色の順番を変更することもできます。
CSS真ん中へんにある「エントリー（記事ブロック）」の上の方に記事タイトル指定部分があります。

/* 記事タイトル */
h2.EntryTitle {
    height: 16px;
    margin: 0;
    padding: 0 10px 8px 35px;
    background: url(http://blog.cnobi.jp/v1/blog/user/94865e2082d6a98dce84b98a914f5c2a/1255952780) 10px center no-repeat;
}

h2.EntryTitle1 {
    height: 16px;
    margin: 0;
    padding: 0 10px 8px 35px;
    background: url(http://blog.cnobi.jp/v1/blog/user/94865e2082d6a98dce84b98a914f5c2a/1255952755) 10px center no-repeat;
}

h2.EntryTitle2 {
    height: 16px;
    margin: 0;
    padding: 0 10px 8px 35px;
    background: url(http://blog.cnobi.jp/v1/blog/user/94865e2082d6a98dce84b98a914f5c2a/1255952740) 10px center no-repeat;
}

h2.EntryTitle3 {
    height: 16px;
    margin: 0;
    padding: 0 10px 8px 35px;
    background: url(http://blog.cnobi.jp/v1/blog/user/94865e2082d6a98dce84b98a914f5c2a/1255952792) 10px center no-repeat;
}

それぞれのbackgroundのURLを変更すれば、記事の前のアイコンの色が変わります。
画像を変更して、他のアイコンを入れたいときは、そのアイコンのURLをここに入れれば、お好きなアイコンを表示させることができます。