Read Me | wm

はじめに

freoのテンプレートです。携帯/iPhone/管理(※プレビューのみ付属)用テンプレートは付属していません。
ブラウザのCSS実装状況によってディテールの異なるパーツがあります。
freo付属のテンプレートと異なり、エントリー・ページ本文内に『ファイルのイメージ』(手動登録サムネイル)を表示しないようになっています(※インフォメーション内のエントリー・ページ・ギャラリー等の一覧ページには使用します)。2011/04/23版以降
freo本体のバージョンは1.6.4で確認しています。本体バージョンが異なる場合は、テンプレートの修正が必要になる事があります。変更箇所はfreo本体の更新履歴を確認してください。
テンプレート導入前にfreo付属の初期状態のテンプレートで動作や機能を確認してください。
ライセンスはGNU General Public License (GPL)です。
使用に際して生じたいかなる損害も当方は責任を負いません。作業前のバックアップ推奨です。
設置・カスタマイズに関するサポートは行っておりません。

上に戻る

使い方

freo付属のテンプレートで設置し、動作確認・機能確認を行ってから導入してください。

defaultフォルダの中のcssの内容を、設置したfreoのcss内にアップロード
defaultフォルダの中のimagesの内容を、設置したfreoのimages内にアップロード
defaultフォルダの中のtemplatesの内容を、設置したfreoのtemplates内にアップロード

デザインを変更する場合は、引き続き【デザイン変更】を行ってください。

プラグインを使用する場合は、【プラグイン導入時の補足事項】もお読みください。

ネタバレボタンを使用する場合は、【ネタバレボタン導入時の補足事項】もお読みください。

テンプレートの変更が反映されない場合は、【テンプレートの変更が反映されない】を確認してください。

上に戻る

デザイン変更

【使い方】の手順通りにdefaultを導入する
extra_designフォルダを開き、使用したいデザインのフォルダの中のcssとimagesの内容を、設置したfreoのcssとimages内にそれぞれアップロード

上に戻る

デザイン一覧

デザイン名の後の数値は本体幅のバリエーションになります。(※polaris_850はdefaultに含まれます)

polaris

750/850/950
crux

550/650/750
spica

750/850/950
sirius

750/850/950
alkes

550/650/750
capella

750/850/950
procyon

650/750/850
wei

650/750/850
proxima

750/850/950
proxima_R

750/850/950
saiph

650/750/850
gienah

750/850/950
gienah_R

750/850/950
hamal

650/750/850
phact

750/850/950
phact_R

750/850/950
alphard

650/750/850
duhr

750/850/950
duhr_R

750/850/950
altair

750/850/950
altair_R

750/850/950
fomalhaut

750/850/950
fomalhaut_R

750/850/950
vega

750/850/950
vega_R

750/850/950
achernar

750/850/950
achernar_R

750/850/950

上に戻る

カスタマイズ

カスタマイズの前に

ファイルを編集する際は、文字コードをUTF-8N(＝UTF-8 BOM無し)に指定して保存してください。
※日本語(等の2バイト文字)を含まないファイルは、エディタによってはShift-JISとして開く事がありますので、文字コードを指定しなおしてください。

異なる文字コードで保存すると、文字化けやエラーになったりします。
cssファイルが文字化けした場合は、文字化け付近の指定が適用されなくなる等の問題が発生します。

参考:
文字コード＞UTF-8のBOMについて
 EmEditorのインストール
 EmEditorの設定

上に戻る

templatesのカスタマイズ

ヘッダーを編集 (メニューの追加等)

templates/header.htmlを開いて編集

メニュー変更例

<ul class="menu">
	<li><a href="{$freo.core.http_file}">HOME</a></li>
	<li><a href="任意のURL">ABOUT</a></li>
	<li><a href="{$freo.core.http_file}/entry">BLOG</a></li>
	<li><a href="任意のURL">GALLERY</a></li>
	<li><a href="任意のURL">CONTACT</a></li>
</ul>

変更したheader.htmlを、設置したfreoのtemplates内にアップロード

上に戻る

フッターを編集 (素材元リンクの追加等)

templates/footer.htmlを開いて編集
- 素材元リンクやフッターに表示しておきたい物を追加する例
  『Created by freo. Template designed by wmks.』の横に並べて追加する時は、↓のようにします。
```
<ul class="powered">
	<li>Created by <a href="http://freo.jp/">freo</a>.</li>
	<li>Template designed by <a href="http://www.usamimi.info/~witchmakers/">wmks</a>.</li>
	<li>Photo by <a href="http://">XXXX</a>.</li>
</ul>
```
  『Created by freo. Template designed by wmks.』の上の行に追加する時は、 <ul class="powered">の直前の行に↓のようにします。
```
<p>ここに内容</p>
```
変更したfooter.htmlを、設置したfreoのtemplates内にアップロード

上に戻る

ユーティリティの編集 (パーツの非表示・追加・移動等)

templates/utility.htmlを開いて編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- 新着の件数は管理メニューから設定可能です(管理メニュー＞システム＞設定管理＞プラグインの設定＞新着○○表示)
変更したutility.htmlを、設置したfreoのtemplates内にアップロード

上に戻る

ユーティリティの構造

パーツを移動・追加する場合は～の間か、～の間で行ってください。※1カラムで左右に分かれている場合はＡが左側、Ｂが右側になります。
パーツごとに～で囲まれているので、非表示にしたいパーツがあれば丸ごと削除してください。

各パーツは↓の様に構成されています。

<!-- ▼○○ -->
<div class="utility">
	<h3>見出し</h3>
	<div class="content">
		内容
	</div>
</div>
<!-- ▲○○ -->

例えば、ブログパーツを追加する時は↓を
```

<div class="utility">
	<h3>ブログパーツの名前</h3>
	<div class="content">
		ここにブログパーツのコード
	</div>
</div>

```
一番上に追加する場合はの直後の行に追加します。
一番下に追加する場合はの直前の行に追加します。

上に戻る

トップページを表示する [extra_toppage]

通常トップページはブログエントリーになりますが、これをインフォメーションのみにします。

extra_toppageフォルダを開きtemplatesの内容を、設置したfreoのtemplates内にアップロード
管理メニュー＞システム＞設定管理＞本体の設定＞表示設定＞インフォメーション＞インフォメーション機能『利用する』に設定
管理メニュー＞システム＞インフォメーション管理＞『本文』に内容を入力
- 『本文』には画像を表示する事も出来ます。『本文』入力フォームの上の「本文」というテキストの横に二つ並んでいる四角いアイコンから、メディアの登録/挿入が可能です。
- 『エントリーID』『ページID』は指定したエントリーやページをトップページに表示します。必要なければ空白にしておいてください。

必要であれば、【ヘッダーを編集 (メニューの追加等)】を参照し、ブログへのリンクをメニューに追加してください。

必要であれば、以下もご利用ください。
【トップページ＋ユーティリティ(ブログと同内容)を表示する [extra_toppage_utility]】
【トップページ＋ユーティリティ(任意の内容)を表示する [extra_toppage_utility_edit]】
【トップページ＋ユーティリティ(最近のブログ記事一覧を移動)を表示する [extra_toppage_utility_recent]】

参考:
トップページのみテンプレートを変更する
 freoでサイト全体を管理する

上に戻る

トップページ＋ユーティリティ(ブログと同内容)を表示する [extra_toppage_utility]

【トップページを表示する [extra_toppage]】の手順通りに[extra_toppage]を導入する
extra_toppage_utilityの中のdefault.htmlを、設置したfreoのtemplates/internals/default/内にアップロード

上に戻る

トップページ＋ユーティリティ(任意の内容)を表示する [extra_toppage_utility_edit]

【トップページを表示する [extra_toppage]】の手順通りに[extra_toppage]を導入する
extra_toppage_utility_editの中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
編集したdefault.htmlを、設置したfreoのtemplates/internals/default/内にアップロード

上に戻る

トップページ＋ユーティリティ(最近のブログ記事一覧を移動)を表示する [extra_toppage_utility_recent]

【トップページを表示する [extra_toppage]】の手順通りに[extra_toppage]を導入する
extra_toppage_utility_recentの中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
編集したdefault.htmlを、設置したfreoのtemplates/internals/default/内にアップロード

上に戻る

ページにユーティリティ(任意の内容)の場所を確保する [extra_page_utility_edit]

extra_page_utility_editの中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
- ページ毎に表示を変えたい場合は、エントリーごと、ページごとにテンプレートを変更する等を参照してください
編集したdefault.htmlを、設置したfreoのtemplates/internals/page/内にアップロード

上に戻る

プロフィールにユーティリティ(任意の内容)の場所を確保する [extra_profile_utility_edit]

extra_profile_utility_editの中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
- プロフィール毎に表示を変えたい場合は、エントリーごと、ページごとにテンプレートを変更する等を参照してください(ページと似たような感じで切り替えられます|例|templates/internals/profile/user2.htmlを作るとID:user2のプロフィールで使用される)
編集したdefault.htmlを、設置したfreoのtemplates/internals/profile/内にアップロード

上に戻る

ギャラリーを作成する [extra_gallery]

ここで作成するギャラリーはfreoでサイト全体を管理するのギャラリー管理と似たような仕様になります。

これ以外にも、freoでは様々な形態のギャラリーが作成出来ますので、用途に合わせて選択してください。
【ギャラリー(画像一覧)の種類について】

ギャラリー用のページを登録
▼設定例
```
ギャラリー | ページID: gallery | 親ID: なし
   花(分類) | ページID: gallery/hana | 親ID: gallery
      梅(作品) | ページID: gallery/hana/ume | 親ID: gallery/hana
      桜(作品) | ページID: gallery/hana/sakura | 親ID: gallery/hana
   魚(分類) | ページID: gallery/sakana | 親ID: gallery
      金魚(作品) | ページID: gallery/sakana/kingyo | 親ID: gallery/sakana
      メダカ(作品) | ページID: gallery/sakana/medaka | 親ID: gallery/sakana
```
- 『ページID』(ページ登録時に一行フォームから入力)と『親ID』(プルダウンから選択)の両方を正しく設定してください(※親IDだけでなく、ページIDも階層化している点に注意してください)。
- IDの文字列『gallery』に異なる文字列を使用する場合は、テンプレート側にも修正が必要になります(後述)。
- 作品ページには『ファイルのイメージ』(手動登録サムネイル)を登録してください。
extra_galleryの中のgallery.htmlを、設置したfreoのtemplates/internals/page/内にアップロード

必要であれば、【ヘッダーを編集 (メニューの追加等)】を参照し、ギャラリーへのリンクをメニューに追加してください。

必要であれば、以下もご利用ください。
【ギャラリーを作成＋ユーティリティ(任意の内容)の場所を確保 [extra_gallery_utility_edit]】

IDの文字列『gallery』の部分に任意の文字列を使用するには

『gallery』ではなく『illust』を使用する場合を例として解説します。

extra_galleryの中のgallery.htmlのファイル名を、illust.htmlに変更
名前を変更したillust.htmlを開いて、62行目と81行目あたりにある↓を
```

```
２つとも以下のように変更
```

```
編集したillust.htmlを、設置したfreoのtemplates/internals/page/内にアップロード

参考:
freoでサイト全体を管理する
 カテゴリーとページの階層化について
 ファイルアップロードについて
 サムネイル画像の手動登録について

上に戻る

ギャラリーを作成＋ユーティリティ(任意の内容)の場所を確保 [extra_gallery_utility_edit]

【ギャラリーを作成する [extra_gallery]】の手順通りに[extra_gallery]を導入する
extra_gallery_utility_editの中のgallery.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
- ページ毎に表示を変えたい場合は、エントリーごと、ページごとにテンプレートを変更する等を参照してください
編集したgallery.htmlを、設置したfreoのtemplates/internals/page/内にアップロード

上に戻る

cssのカスタマイズ

編集するファイルについて

css/wm_freo.css(テンプレート)
css/wm_colorbox.css(ColorBox)

上に戻る

大まかな設定部分にジャンプ (基本文字サイズ・基本リンク色・タイトル画像等)

css/wm_freo.cssを開いて、ファイル内を※で検索すると、大まかな設定部分に飛ぶ事が出来ます。

上に戻る

トップページのみ少しだけスタイルを変更する

トップページ (URLがhttp://○○○/freo/かhttp://○○○/freo/index.php) にアクセスした時、<body>にid="home"が付くようになっています。
これを利用してトップページのみ少しスタイルを変更する事ができます。

例１) トップページのみ背景画像を表示する

css/wm_freo.cssを開いて、『1-レイアウト』にある↓を

body {
	～～～～
}

以下のように変更

body {
	～～～～
}
body#home {/* トップページ */
	background: url("画像のURL") right top no-repeat #FFFFFF;
}

変更したwm_freo.cssを、設置したfreoのcss内にアップロード

上に戻る

例２) トップページのみ異なるサイズの別のタイトル画像を表示する (fomalhaut, achernar)

css/wm_freo.cssを開いて、『1-レイアウト』にある↓を

#title {
	～～～～
}

以下のように変更

#title {
	～～～～
}
body#home #title {/* トップページ */
	height: 500px;/* 画像の縦サイズに合わせて数値を変更 */
	background: url("画像のURL") left top no-repeat #FCFCFC;
}

変更したwm_freo.cssを、設置したfreoのcss内にアップロード

上に戻る

例３) トップページのみ異なるサイズの別のタイトル画像を表示する (alphard, duhr)

css/wm_freo.cssを開いて、『1-レイアウト』にある↓を

#header {
	～～～～
}

以下のように変更

#header {
	～～～～
}
body#home #header {/* トップページ */
	padding-bottom: 600px;/* 画像の縦サイズに合わせて数値を変更 */
	background: url("画像のURL") left bottom no-repeat;
}

変更したwm_freo.cssを、設置したfreoのcss内にアップロード

上に戻る

例４) トップページのみ異なるサイズの別のタイトル画像を表示する (gienah, saiph)

css/wm_freo.cssを開いて、『1-レイアウト』にある↓を

#header {
	～～～～
}

以下のように変更

#header {
	～～～～
}
body#home #header {/* トップページ */
	padding-bottom: 600px;/* 画像の縦サイズに合わせて数値を変更 */
	background: url("画像のURL") left bottom no-repeat;
}

変更したwm_freo.cssを、設置したfreoのcss内にアップロード

上に戻る

ColorBoxのボタンの色等を変更する

例１) ボタンの色を変更する

extra_cbox/controls.psdを編集してpngファイルを出力、images/wm_colorbox/controls.pngに上書きしてください。※ボタンのサイズを変更する場合はcssの編集が必要になります

例２) 背景を変更する

images/wm_colorbox/overlay.pngを差し替えてください。※透明度はjquery.colorbox.js(テンプレートには同梱していません/freoに付属しています)で設定されています

例３) ローディング画像を変更する

images/wm_colorbox/loading.gifを差し替えてください。

ローディング時の背景色は、css/wm_colorbox.cssの『背景』という部分にある #cboxLoadingOverlay{background:#3F3F3F;}を変更してください。

上に戻る

ネタバレボタン導入時の補足事項

導入はネタバレボタンの実装についての通りに行ってください。

デザインの変更はcss/wm_freo.cssの下の方にある『ネタバレボタン』の部分を編集してください。

上に戻る

プラグイン導入時の補足事項

エントリータグクラウド表示プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.0.0で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

プラグイン配布ページの『導入方法』にある、『CSSの編集』は不要です (※追記済み)。

参考: エントリータグクラウド表示プラグイン

上に戻る

エントリーギャラリー表示プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.2.3で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

extra_pluginフォルダの中のentry_galleryの内容を、設置したfreoのtemplates/plugins/entry_gallery/内にアップロードしてください。
※一覧ページにユーティリティの場所を確保したい場合は【ユーティリティの場所を確保する】を参照してください。
プラグイン配布ページの『導入方法』にある、『CSSの編集』は不要です (※追記済み)。
サイドバーに新着画像を一覧表示機能の、CSSのコード追加は不要です (※追記済み)。

参考:
【ギャラリー/イメージ表示プラグインの新着画像一覧が表示されない】
エントリーギャラリー表示プラグイン
 ファイルアップロードについて

上に戻る

ユーティリティの場所を確保する

extra_plugin/entry_gallery_utility_edit/の中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
編集したdefault.htmlを、設置したfreoのtemplates/plugins/entry_gallery/内にアップロード

上に戻る

エントリーイメージ表示プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.2.3で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

extra_pluginフォルダの中のentry_imageの内容を、設置したfreoのtemplates/plugins/entry_image/内にアップロードしてください。
※一覧ページにユーティリティの場所を確保したい場合は【ユーティリティの場所を確保する】を参照してください。
プラグイン配布ページの『導入方法』にある、『CSSの編集』は不要です (※追記済み)。
サイドバーに新着画像を一覧表示機能の、CSSのコード追加は不要です (※追記済み)。

参考:
【ギャラリー/イメージ表示プラグインの新着画像一覧が表示されない】
エントリーイメージ表示プラグイン
 ファイルアップロードについて
 サムネイル画像の手動登録について

上に戻る

ユーティリティの場所を確保する

extra_plugin/entry_image_utility_edit/の中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
編集したdefault.htmlを、設置したfreoのtemplates/plugins/entry_image/内にアップロード

上に戻る

ページイメージ表示プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.2.3で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

extra_pluginフォルダの中のpage_imageの内容を、設置したfreoのtemplates/plugins/page_image/内にアップロードしてください。
※一覧ページにユーティリティの場所を確保したい場合は【ユーティリティの場所を確保する】を参照してください。
プラグイン配布ページの『導入方法』にある、『CSSの編集』は不要です (※追記済み)。
サイドバーに新着画像を一覧表示機能の、CSSのコード追加は不要です (※追記済み)。

参考:
【ギャラリー/イメージ表示プラグインの新着画像一覧が表示されない】
ページイメージ表示プラグイン
 ファイルアップロードについて
 サムネイル画像の手動登録について

上に戻る

ユーティリティの場所を確保する

extra_plugin/page_image_utility_edit/の中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
編集したdefault.htmlを、設置したfreoのtemplates/plugins/page_image/内にアップロード

上に戻る

ページイメージ分類別表示プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.1.2で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

extra_pluginフォルダの中のpage_image_categorizedの内容を、設置したfreoのtemplates/plugins/page_image_categorized/内にアップロードしてください。
※一覧ページにユーティリティの場所を確保したい場合は【ユーティリティの場所を確保する】を参照してください。
プラグイン配布ページの『導入方法』にある、『CSSの編集』は不要です (※追記済み)。

参考:
【ページイメージ分類別表示プラグインで一覧画像が表示されない】
ページイメージ分類別表示プラグイン
 カテゴリーとページの階層化について
 ファイルアップロードについて
 サムネイル画像の手動登録について

上に戻る

ユーティリティの場所を確保する

extra_plugin/page_image_categorized_utility_edit/の中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
編集したdefault.htmlを、設置したfreoのtemplates/plugins/page_image_categorized/内にアップロード

上に戻る

パンくずリスト表示プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.1.0で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

プラグイン配布ページの『導入方法』にある、『テンプレートの編集』は以下のように行ってください。
templates/internals/page/default.htmlを開いて、2行目辺りにあるの直後の行に以下を追加

<!-- ▼パンくずリスト表示 -->
<ol class="topicpath">
	<li class="topicpath_home"><a href="{$freo.core.http_file}">Home</a></li>
	<!--{foreach from=$plugin_page_topicpaths|smarty:nodefaults item='plugin_page_topicpath'}-->
	<li><a href="{$freo.core.http_file}/page/{$plugin_page_topicpath.id}">{$plugin_page_topicpath.title}</a></li>
	<!--{/foreach}-->
	<li class="topicpath_current">{$page.title}</li>
</ol>
<!-- ▲パンくずリスト表示 -->

参考: パンくずリスト表示プラグイン

上に戻る

検索プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.1.1で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

extra_pluginフォルダの中のsearchの内容を、設置したfreoのtemplates/plugins/search/内にアップロードしてください。
※一覧ページにユーティリティの場所を確保したい場合は【ユーティリティの場所を確保する】を参照してください。

参考: 検索プラグイン

上に戻る

ユーティリティの場所を確保する

extra_plugin/search_utility_edit/の中のdefault.htmlを開いて、下の方にある～内を編集
- ユーティリティ内の構造については【ユーティリティの構造】を確認してください。
- プラグインによっては、出力可能なページがあらかじめ設定(libs/freo/plugins/config～～.php)されているので、表示出来ないことがあります。
編集したdefault.htmlを、設置したfreoのtemplates/plugins/search/内にアップロード

上に戻る

メニュー登録プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.0.2で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

ヘッダーのメニューに使用する場合は、プラグイン配布ページの『導入方法』にある、『テンプレートの編集』は以下のように行ってください。
templates/header.htmlを開いて、29行目辺りにある↓を削除し

<ul class="menu">
	<li><a href="{$freo.core.http_file}">Home</a></li>
	<li><a href="{$freo.core.https_file}/login">Login</a></li>
</ul>

代わりに以下を追加

<ul class="menu">
	<!--{foreach from=$plugin_menus|smarty:nodefaults item='plugin_menu'}-->
	<li><a href="{if $plugin_menu.url|regex_match:'/^https?\:\/\//'}{$plugin_menu.url}{else}{$freo.core.http_file}{$plugin_menu.url}{/if}">{$plugin_menu.title}</a></li>
	<!--{/foreach}-->
</ul>

参考: メニュー登録プラグイン

上に戻る

ブックマーク登録プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.0.0で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

extra_pluginフォルダの中のbookmarkの内容を、設置したfreoのtemplates/plugins/bookmark/内にアップロードしてください。

参考: ブックマーク登録プラグイン

上に戻る

ブックマークタグクラウド表示プラグイン

プラグイン配布ページの手順通りに導入し、動作確認を行ってから作業してください。
※プラグインのバージョンは1.0.0で作成しています。異なるバージョンで使用する場合、内容に修正が必要になる事があります。

extra_pluginフォルダの中のbookmark_tagcloudの内容を、設置したfreoのtemplates/plugins/bookmark/内にアップロードしてください。
プラグイン配布ページの『導入方法』にある、『テンプレートの編集』は不要です (※上記ファイルに含まれます)。
プラグイン配布ページの『導入方法』にある、『CSSの編集』は不要です (※追記済み)。

参考: ブックマークタグクラウド表示プラグイン

上に戻る

その他のプラグイン

templates/plugins/内のファイルは、各プラグインに付属のものを使用してください。
css/default.cssにコードを追加するようになっている場合は、css/wm_freo.cssに追加するようにしてください。 ※このテンプレートが関係しないプラグインの場合（管理画面等）は、指定されたファイルに記述してください。

上に戻る

ヘルプ

テンプレートの変更が反映されない

設置したfreoのtemplates_c/内にある、拡張子がphpのファイルをすべて削除してください。

ブラウザのキャッシュを削除してください。

参考: テンプレートを編集しても反映されない

上に戻る

テンプレートを編集すると文字化けした/エラーになった

ファイルを編集する際は、文字コードをUTF-8N(＝UTF-8 BOM無し)に指定して保存してください。
※日本語(等の2バイト文字)を含まないファイルは、エディタによってはShift-JISとして開く事がありますので、文字コードを指定しなおしてください。

テンプレート内に単独で{や}を書くとエラーになります。テンプレート内でこれらを使用する場合は、{literal}～{/literal}で囲む必要があります。

参考:
デザインの変更時の注意点
 文字コード＞UTF-8のBOMについて
 EmEditorのインストール
 EmEditorの設定

上に戻る

『ファイルのイメージ』(手動登録サムネイル)が本文に表示されない

2011/04/23版以降、『ファイルのイメージ』(手動登録サムネイル)を本文に表示しない状態をデフォルトに変更しました(※インフォメーション内のエントリーとページでは『ファイルのイメージ』(手動登録サムネイル)を使用しています)。

freo付属のテンプレートのように、本文に『ファイルのイメージ』(手動登録サムネイル)を表示したい場合は、添付ファイルのイメージやサムネイルを各記事に表示しないやfreo付属のテンプレートを参考に、テンプレートのカスタマイズを行ってください。

参考:
ファイルアップロードについて
 サムネイル画像の手動登録について
 添付ファイルのイメージやサムネイルを各記事に表示しない

上に戻る

ページイメージ分類別表示プラグインで一覧画像が表示されない

『ページID』 (ページ登録時に1行フォームから入力)・『親ID』 (プルダウンから選択して設定) の二つのIDを正しく設定する必要があります。

▼設定例 ※ページIDも階層化している点に注意してください

ギャラリー | ページID: gallery | 親ID: なし
   花(分類) | ページID: gallery/hana | 親ID: gallery
      梅(作品) | ページID: gallery/hana/ume | 親ID: gallery/hana
      桜(作品) | ページID: gallery/hana/sakura | 親ID: gallery/hana
   魚(分類) | ページID: gallery/sakana | 親ID: gallery
      金魚(作品) | ページID: gallery/sakana/kingyo | 親ID: gallery/sakana
      メダカ(作品) | ページID: gallery/sakana/medaka | 親ID: gallery/sakana
-------------------
一覧ページのURL⇒ freo/index.php/page_image_categorized/gallery

参考:
カテゴリーとページの階層化について
 ページイメージ分類別表示プラグイン

上に戻る

ギャラリー/イメージ表示プラグインの新着画像一覧が表示されない

プラグイン導入後、管理メニュー＞システム＞設定管理＞プラグインの設定＞○○ギャラリー/イメージ表示＞表示設定＞新着の表示件数を設定してください。
※導入直後の状態だと0件になっています

上に戻る

タグクラウドが表示されない

エントリー/ページを登録するなど、データが更新されるような動作を行ってください。

参考:
エントリータグクラウド表示プラグイン
 ページタグクラウド表示プラグイン

上に戻る

ギャラリー(画像一覧)の種類について

freoで作成できるギャラリー(画像一覧)には以下のようなものがあります (※一例)。

エントリーギャラリー表示プラグイン: エントリー本文に挿入された画像タグ(メディアから挿入された画像等)か、添付ファイルを元に一覧を作成
エントリーギャラリー表示プラグイン
 【プラグイン導入時の補足事項＞エントリーギャラリー表示】
エントリーイメージ表示プラグイン: エントリーに登録した『ファイルのイメージ(手動登録サムネイル)』を元に一覧を作成
エントリーイメージ表示プラグイン
 【プラグイン導入時の補足事項＞エントリーイメージ表示】
ページイメージ表示プラグイン: ページに登録した『ファイルのイメージ(手動登録サムネイル)』を元に一覧を作成
ページイメージ表示プラグイン
 【プラグイン導入時の補足事項＞ページイメージ表示】
ページイメージ分類別表示プラグイン: ページに登録した『ファイルのイメージ(手動登録サムネイル)』を元に、階層別の一覧を1ページ内にまとめて作成
ページイメージ分類別表示プラグイン
 【プラグイン導入時の補足事項＞ページイメージ分類別表示】
【ページイメージ分類別表示プラグインで一覧画像が表示されない】
テンプレートをカスタマイズして作成: freoでサイト全体を管理するのギャラリー管理のように、手動登録サムネイルを元に、階層別の一覧をページを分けて作成 (※【ギャラリーを作成する [extra_gallery]】で同じような仕様のギャラリーを作成できます); 自分好みにテンプレートをカスタマイズする等して作成

上に戻る

twitterのプロフィールウィジェットの見た目を調整

ユーザー名に線がついたりするのを補正します。

css/wm_freo.cssの一番下に以下のようにして追加してください。※twitterから提供されるコードに変更があった場合等は適宜スタイルを調整してください。

/*================================================
	Twitter widget
================================================*/
.twtr-widget h3, .twtr-widget h4 {
	border: none;
	background: none transparent;
}
.twtr-widget em {
	font-weight: normal;
}

参考:
Twitterへの投稿内容を表示する
 【ユーティリティの構造】

上に戻る

参考リンク

各機能の解説: http://freo.jp/document/customize/index.html
トラブルシューティング: http://freo.jp/setup/trouble/index.html
更新履歴: http://freo.jp/about/record.html

上に戻る

更新履歴

2011/06/03

ネタバレボタン導入時の補足事項を追加

全デザインにネタバレボタン関連記述追加、その他細部調整

css/wm_freo.css

2011/05/24

デザイン『wei』『saiph』を追加

2011/05/11

freo本体の更新に伴い、本体の確認バージョンを「1.6.3」から「1.6.4」に変更
これに伴い以下のファイルを変更

templates/header.html
#31行目辺りにある<li><a href="{$freo.core.https_file}/login">Login</a></li>の直後の行に、以下を追加

<!--{if isset($smarty.session.freo.agent.type|smarty:nodefaults)}-->
<li><a href="{$smarty.server.PHP_SELF}?freo%5Bagent%5D%5Btype%5D=iphone">iPhone</a></li>
<!--{/if}-->

デザイン『alphard』『duhr』『duhr_R』の色を変更

2011/05/06

freo本体の更新に伴い、本体の確認バージョンを「1.6.2」から「1.6.3」に変更
※本体更新に伴う変更はありません

2011/05/03

freo本体の更新に伴い、本体の確認バージョンを「1.6.1」から「1.6.2」に変更
※本体更新に伴う変更はありません

検索プラグインの更新に伴い、プラグインの確認バージョンを「1.0.0」から「1.1.0」に変更
これに伴い、以下の差分ファイルの内容を変更

[extra_plugin] search/default.html
[extra_plugin] search_utility_edit/default.html

2011/05/02

freo本体の更新に伴い、本体の確認バージョンを「1.6.0」から「1.6.1」に変更
※本体更新に伴う変更はありません

エントリーギャラリー表示プラグイン用差分ファイルとその解説(ReadMe.html内)を追加

[extra_plugin] entry_gallery/default.html
[extra_plugin] entry_gallery_utility_edit/default.html

エントリーイメージ表示プラグイン用差分ファイルとその解説(ReadMe.html内)を追加

[extra_plugin] entry_image/default.html
[extra_plugin] entry_image_utility_edit/default.html

ページイメージ表示プラグイン用差分ファイルとその解説(ReadMe.html内)を追加

[extra_plugin] page_image/default.html
[extra_plugin] page_image_utility_edit/default.html

ページイメージ分類別表示プラグイン用差分ファイルとその解説(ReadMe.html内)を追加

[extra_plugin] page_image_categorized/default.html
[extra_plugin] page_image_categorized_utility_edit/default.html

検索プラグイン用差分ファイルとその解説(ReadMe.html内)を追加

[extra_plugin] search/default.html
[extra_plugin] search_utility_edit/default.html

検索プラグイン用差分ファイルの為のスタイルを追加

css/wm_freo.css (『3-各部詳細＞#main＞.page_result』)
#変更前

/*----------------------------------.page_result*/
.page_result {
	margin: 13px 0;
	padding: 0 12px;
	border: 1px solid #F5F5F5;
	background: #FAFAFA;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
}
.page_result h3 {
	margin: 13px 0;
	padding: 0;
	border: none;
	background: none transparent;
	font-weight: normal;
	font-size: 100%;
}
.page_result p {
	margin: 13px 0 13px 21px;
	color: #808080;
}

#変更後 ※一番下の.page_result ul.information～の部分を追加した

/*----------------------------------.page_result*/
.page_result {
	margin: 13px 0;
	padding: 0 12px;
	border: 1px solid #F5F5F5;
	background: #FAFAFA;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
}
.page_result h3 {
	margin: 13px 0;
	padding: 0;
	border: none;
	background: none transparent;
	font-weight: normal;
	font-size: 100%;
}
.page_result p {
	margin: 13px 0 13px 21px;
	color: #808080;
}
.page_result ul.information {
	margin: 13px 0;
}

☆vega等の黒基調デザインは#F5F5F5→#535353、#FAFAFA→#505050、#808080→#A5A5A5になっています

2011/04/27

全デザイン(default含む)をリニューアル

css/wm_freo.css
images/wm_freo/画像

ページの目次部分の構造を変更

templates/internals/page/default.html (62行目あたり)
#変更前

<h3>Title List</h3>
<ul>
	<!--{foreach from=$plugin_page_childs|smarty:nodefaults item='plugin_page_child'}-->
	<li><a href="{$freo.core.http_file}/page/{$plugin_page_child.id}">{$plugin_page_child.title}</a></li>
	<!--{/foreach}-->
</ul>

#変更後

<div class="page_child">
	<h3>Title List</h3>
	<ul>
		<!--{foreach from=$plugin_page_childs|smarty:nodefaults item='plugin_page_child'}-->
		<li><a href="{$freo.core.http_file}/page/{$plugin_page_child.id}">{$plugin_page_child.title}</a></li>
		<!--{/foreach}-->
	</ul>
</div>

ギャラリー用差分ファイルとその解説(ReadMe.html内)を追加

[extra_gallery] gallery.html
[extra_gallery] gallery.html

ページ用差分ファイルとその解説(ReadMe.html内)を追加

[extra_page_utility_edit] default.html

プロフィール用差分ファイルとその解説(ReadMe.html内)を追加

[extra_profile_utility_edit] default.html

2011/04/23

freo本体の更新に伴い、本体の確認バージョンを「1.5.0」から「1.6.0」に変更
これに伴い、以下のファイルを追加

templates/internals/admin/entry_preview.html
templates/internals/admin/information_preview.html
templates/internals/admin/page_preview.html

エントリー/ページ本文に『ファイルのイメージ(手動登録サムネイル)』を表示しないように変更 (※インフォメーション・各種一覧内では使用します)

templates/internals/default/default.html
templates/internals/page/default.html
templates/internals/view/default.html

以下は【トップページを表示する [extra_toppage]】導入時のみ使用

[extra_toppage] templates/internals/category/default.html
[extra_toppage] templates/internals/entry/default.html

デザイン『alphard』『duhr』『duhr_R』をリニューアル

2011/04/21

トップページ用差分ファイルとその解説(ReadMe.html内)を追加

[extra_toppage_utility] default.html
[extra_toppage_utility_edit] default.html
[extra_toppage_utility_recent] default.html

デザイン『hamal』『phact』『phact_R』をリニューアル

2011/04/16

デザイン『hamal』『phact』『phact_R』をリニューアル

2011/04/10

関連エントリー表示プラグイン、パンくずリスト表示プラグイン、ブックマーク登録プラグイン(＋ブックマークタグクラウド表示プラグイン)のスタイルとその解説(ReadMe.html内)を追加

css/wm_freo.css (『4-プラグイン』内)

ブックマーク登録プラグイン用差分ファイルとその解説(ReadMe.html内)を追加

[extra_plugin] bookmark/default.html

ブックマークタグクラウド表示プラグイン用差分ファイルとその解説(ReadMe.html内)を追加

[extra_plugin] bookmark_tagcloud/default.html

2011/04/06

全デザイン(default含む)を修正

css/wm_freo.css (『3-各部詳細』の『#utility＞form.search』内)
#変更前

form.search p input, form.search p input:hover, form.search p input:focus {
	padding: 0;
	border: none;
	background: transparent;
	color: #B0B0B0;
	cursor: pointer;
}

#変更後 ※検索ボタンのbox-shadow等を消し忘れていたのを修正

form.search p input, form.search p input:hover, form.search p input:focus {
	padding: 0;
	border: none;
	background: transparent;
	color: #B0B0B0;
	cursor: pointer;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		box-shadow: none;
}

☆vega等の黒基調デザインは#B0B0B0の部分が#838383になります

2011/03/27 (2)

デザイン『hamal』を修正

css/wm_freo.css (394行目と921行目)
#変更前
```
height: 0.1;
```
#変更後 ※#menu ul:afterと#footer ul.pagetop:afterのheightの値を変更
```
height: 0;
```

デザイン『phact』を修正

css/wm_freo.css (392行目と929行目)
#変更前
```
height: 0.1;
```
#変更後 ※#menu ul:afterと#footer ul.pagetop:afterのheightの値を変更
```
height: 0;
```

デザイン『phact_R』を修正

css/wm_freo.css (392行目と929行目)
#変更前
```
height: 0.1;
```
#変更後 ※#menu ul:afterと#footer ul.pagetop:afterのheightの値を変更
```
height: 0;
```

2011/03/27

デザイン『hamal』『phact』『phact_R』を追加

2011/03/21

デザイン『proxima_R』『gienah_R』『duhr_R』『altair_R』『fomalhaut_R』『vega_R』『achernar_R』を追加

2011/03/19

上部インフォメーションの構造を変更

templates/internals/default/default.html

【トップページを表示する [extra_toppage]】用のトップページの構造を変更

[extra_toppage] templates/internals/default/default.html

全デザイン(default含む)をリニューアル

css/wm_freo.css
images/wm_freo/画像

2011/02/23 (21:30)

『proxima』を調整

css/wm_freo.css (702行目)
#変更前
```
font-weight: bold;
```
#変更後 ※.utility h3のfont-weightの値を変更
```
font-weight: normal;
```

『gienah』を調整

css/wm_freo.css (736行目)
#変更前
```
font-weight: bold;
```
#変更後 ※.utility h3のfont-weightの値を変更
```
font-weight: normal;
```

『alphard』『duhr』を調整

css/wm_freo.css (複数箇所)

2011/02/23 (00:50)

デザイン『proxima』『gienah』を追加

2011/02/20

デザイン『duhr』を追加

2011/02/19

デザイン『alphard』を追加

2011/02/16

ColorBox関連を追加 (※defaultフォルダに含まれます/全デザインで使用出来ます)

css/wm_colorbox.css (ファイル追加)
images/wm_colorbox/controls.png, loading.gif, overlay.png (ファイル追加)

templates/header.html (14行目を変更)
#変更前

<link rel="stylesheet" href="{$freo.core.http_url}{$smarty.const.FREO_CSS_DIR}colorbox.css" type="text/css" media="all" />

#変更後 ※colorbox.cssではなく、wm_colorbox.cssを読み込むようにした

<link rel="stylesheet" href="{$freo.core.http_url}{$smarty.const.FREO_CSS_DIR}wm_colorbox.css" type="text/css" media="all" />

2011/02/06

freo本体の更新に伴い、本体の確認バージョンを「1.4.3」から「1.5.0」に変更
※本体更新に伴う変更はありません

2011/01/30

全デザイン(default含む)を調整(行間・余白etc)

css/wm_freo.css
images/wm_freo/画像

2011/01/29

freo本体の更新に伴い、本体の確認バージョンを「1.4.2」から「1.5.3」に変更
※本体更新に伴う変更はありません

2011/01/28

デザイン『procyon』を追加

2011/01/27

デザイン『sirius』『alkes』『capella』を追加

2011/01/26

エントリーに投稿者名(Posted by ○○)を表示するように変更

templates/internals/default/default.html
templates/internals/view/default.html

以下は【トップページを表示する [extra_toppage]】導入時のみ使用

[extra_toppage] templates/internals/entry/default.html
[extra_toppage] templates/internals/category/default.html

デザイン『vega』『achernar』を追加

2011/01/25

リニューアル

上に戻る

作者情報

Name: wmks
WebSite: witchmakers | http://www.usamimi.info/~witchmakers/
Profile: Google Profile

Thanks

freo: Knight
http://freo.jp/
ColorBox: Jack Moore
http://colorpowered.com/colorbox/
Font: 04b11 ("default/images/wm_colorbox/controls.png"): yuji oshimoto
http://www.04.jp.org/
Smarty: http://www.smarty.net/
jQuery: http://jquery.com/

上に戻る

Read Me | wm_freo

はじめに

使い方

デザイン変更

デザイン一覧

カスタマイズ

カスタマイズの前に

templatesのカスタマイズ

ヘッダーを編集 (メニューの追加等)

フッターを編集 (素材元リンクの追加等)

ユーティリティの編集 (パーツの非表示・追加・移動等)

ユーティリティの構造

トップページを表示する [extra_toppage]

トップページ＋ユーティリティ(ブログと同内容)を表示する [extra_toppage_utility]

トップページ＋ユーティリティ(任意の内容)を表示する [extra_toppage_utility_edit]

トップページ＋ユーティリティ(最近のブログ記事一覧を移動)を表示する [extra_toppage_utility_recent]

ページにユーティリティ(任意の内容)の場所を確保する [extra_page_utility_edit]

プロフィールにユーティリティ(任意の内容)の場所を確保する [extra_profile_utility_edit]

ギャラリーを作成する [extra_gallery]

IDの文字列『gallery』の部分に任意の文字列を使用するには

ギャラリーを作成＋ユーティリティ(任意の内容)の場所を確保 [extra_gallery_utility_edit]

cssのカスタマイズ

編集するファイルについて

大まかな設定部分にジャンプ (基本文字サイズ・基本リンク色・タイトル画像等)

トップページのみ少しだけスタイルを変更する

例１) トップページのみ背景画像を表示する

例２) トップページのみ異なるサイズの別のタイトル画像を表示する (fomalhaut, achernar)

例３) トップページのみ異なるサイズの別のタイトル画像を表示する (alphard, duhr)

例４) トップページのみ異なるサイズの別のタイトル画像を表示する (gienah, saiph)

ColorBoxのボタンの色等を変更する

例１) ボタンの色を変更する

例２) 背景を変更する

例３) ローディング画像を変更する

ネタバレボタン導入時の補足事項

プラグイン導入時の補足事項

エントリータグクラウド表示プラグイン

エントリーギャラリー表示プラグイン

ユーティリティの場所を確保する

エントリーイメージ表示プラグイン

ユーティリティの場所を確保する

ページイメージ表示プラグイン

ユーティリティの場所を確保する

ページイメージ分類別表示プラグイン

ユーティリティの場所を確保する

関連エントリー表示プラグイン

パンくずリスト表示プラグイン

検索プラグイン

ユーティリティの場所を確保する

メニュー登録プラグイン

ブックマーク登録プラグイン

ブックマークタグクラウド表示プラグイン

その他のプラグイン

ヘルプ

テンプレートの変更が反映されない

テンプレートを編集すると文字化けした/エラーになった

『ファイルのイメージ』(手動登録サムネイル)が本文に表示されない

ページイメージ分類別表示プラグインで一覧画像が表示されない

ギャラリー/イメージ表示プラグインの新着画像一覧が表示されない

タグクラウドが表示されない

ギャラリー(画像一覧)の種類について

twitterのプロフィールウィジェットの見た目を調整

参考リンク

更新履歴

作者情報

Thanks