クリックでテンプレートのプレビューができます。

★ 基本情報

テンプレート名 : meaculpa
最新バージョン : 2.1

更新履歴 - Update history

09/08/19 : 2.0→2.1
[Bug Fix] IE6でアンカーにマウスオーバーした際の動作改善
[Bug Fix] 追記開閉スクリプトの仕様変更
09/04/03 : 2.0
公開

「MeaCulpa」復刻版。
プラグイン3はトップページの記事上部に表示されます。
バトン用専用スタイルあり。プラグインON/OFF対応。XHTML 1.0 Transitional。jQuery1.3.2をテンプレート内で使用しています。

Mac版InternetExplorerで閲覧する際には、スタイルを適用しないよう設定されています。ご了承ください。

★ テンプレート追加方法

テンプレートは手作業で追加することになります。

テンプレートの管理画面を開き、適当なテンプレートを [複製] し、複製後のテンプレートのHTML・スタイルシートをすべて選択→削除でまっさらな状態にしてください。 その後、次のHTML・スタイルシートをすべて選択→コピーをし、テンプレートのHTML・スタイルシートにペーストしてください。

HTML↓



スタイルシート↓

★ 使用上の注意

プラグインを使用する場合は以下の項目に注意してください。

現在、プラグイン使用時に表示される「プロフィール」はプラグインのものではなくテンプレートHTMLによるものです。そのため、プロフィール部の表示のみ、プラグイン側での編集が不可となっています。

これは、プラグイン非対応だった[meaculpa]をプラグイン対応にした際に生じた、デザインの変化を最小限に抑えるためです。なお、公式プラグインの「プロフィール」を使用している場合は、スタイルシートを使い不可視にするよう設定されています。ご了承くださいませ。

★ テンプレート更新通知機能つき

更新機能・見本 更新があると、ブログのフッタ部分に★マークがつきます。たまに確認していただけるとありがたいです。

★ 簡易カスタマイズ項目

以下の項目は簡易カスタマイズとしてまとめられています。 詳しくはスタイルシート上部を参照してください。 (バージョンによって項目に多少差があります)

  • フォントサイズの変更
    • タイトルエリアの文字サイズ
    • メインカラムの文字サイズ
    • 記事の本文の文字サイズ
    • サブカラムの文字サイズ
  • 文字色の変更
    • 基本となる文字色
    • タイトル部分の文字色
    • サブカラムの文字色
  • 背景色の変更
    • 記事部分の変更
    • 記事以外の部分
  • カラム幅の変更
  • 記事中の画像に枠をつける
  • 幅可変/固定の切り替え

★ テンプレート独自クラスについて

記事中での使用を想定したいくつかのクラスが用意してあります。

1.要素の回り込み

T38@sapporo 2081222_DSC00456

これまでは回り込みなどを実現するにはいちいちスタイルを直接書き込まなければなりませんでした。しかも、たとえばfloat : left;としただけでは画像と文字が近すぎて、見栄えが良くありません。そこで、テンプレート側で回り込みに関するクラスを用意し、余白などをいちいち設定しなくても良いようにしてみました。

指定方法
テキストを右へ回り込ませたい場合は、「class="f-left"」を、左に回り込ませたい場合は 「class="f-right"」を画像等の要素に追加してください。

<img src="画像のurl" class="f-left" />

太字の部分を追加すればOKです。

なお、このクラスは「2.写真風の枠」、または「3.シンプルな枠」と重複して設定することができます。重複して設定する場合は、

<img src="画像のurl" class="f-left photo" />

というように、半角スペースとともにクラス名を追加してください。

2.写真風の枠

画像に対して写真風の枠をつけます。
「1.要素の回り込み」と重複して指定することが可能です。
090109_DSC00477
こんな感じになります。

指定方法
imgタグに 「class="photo"」を追加してください。

<img src="画像のurl" class="photo" />

太字の部分を追加すればOKです。

3.シンプルな枠

画像に対してシンプルな枠をつけます。
「1.要素の回り込み」と重複して指定することが可能です。
DSC00069
こんな感じになります。

指定方法
imgタグに 「class="imgbox"」を追加してください。

<img src="画像のurl" class="imgbox" />

太字の部分を追加すればOKです。

4.枠をつけない

記事中の任意の要素に枠をつけないようにします。
このクラスは、記事中の画像に枠を表示させるカスタマイズ(スタイルシート上部、簡易カスタマイズ内に項目があります)と組み合わせて利用してください。
「1.要素の回り込み」と重複して指定することが可能です。

指定方法 imgタグに 「class="noimgbox"」を追加してください。

<img src="画像のurl" class="noimgbox" />

太字の部分を追加すればOKです。

★ 使用条件・ライセンスについて

Creative Commons License
このテンプレートは、 クリエイティブ・コモンズ・ライセンス の下でライセンスされています。
テンプレート各部分の原著作者・ライセンスは以下の通りです。

HTML・CSS
"meaculpa" / rimse
Creative Commons License
関連記事


コメント

    コメントの投稿

    (コメントの編集・削除時に必要)
    (管理者にだけ表示を許可する)

    質問の際のお願い

    テンプレートに関する質問は、それぞれのテンプレート専用の記事にて受け付けています。トップページの「Templates Information」から、各テンプレート用の記事へリンクが張ってあります。

    質問の際には、情報の共有のため非公開コメントはご遠慮くださいませ。
    また、使用しているバージョンによって編集内容が異なる事があるため、多くの場合ソースコードの確認が必要になります。出来る限りブログのURLを入力してください。ブログのURLを公開したくない場合は、質問内容を公開コメントで投稿した後、非公開コメントにてブログのアドレスを追加投稿してくださいませ。

    質問以外のコメントは、ご自由にコメントしていただいて結構です。たくさんのコメントお待ちしております。


    トラックバック

    Trackback URL
    Trackbacks


    Recent Entries