テーマレイアウトの編集

ビジュアルエディタ "Kaleflower" を使って、テーマレイアウトを編集する方法について説明します。

テーマディレクトリ内の レイアウトに、2重拡張子 .kflow をつける(例: defaultレイアウトの場合、 default.html.kflow)ことで、Kaleflowerが起動するようになります。

テーマレイアウトの編集では、専用の特殊なカスタムコンポーネントが利用できます。

コンテンツエリア(bowlと呼びます)を配置します。

nameを与えると、サブコンテンツエリアを配置できます。nameを省略した場合は、 main という名前とみなされます。

パンくず配列を配置します。

このコンポーネントは子要素を持つことができます。子要素内で、変数 pageInfo によってページ情報にアクセスできます。

グローバルナビゲーション配列を配置します。

このコンポーネントは子要素を持つことができます。子要素内で、変数 pageInfo によってページ情報にアクセスできます。

ローカルナビゲーション配列を配置します。

このコンポーネントは子要素を持つことができます。子要素内で、変数 pageInfo によってページ情報にアクセスできます。

ショルダーナビゲーション配列を配置します。

このコンポーネントは子要素を持つことができます。子要素内で、変数 pageInfo によってページ情報にアクセスできます。

カレントページの更新日情報を配置します。

次の変数と関数にアクセスできます。

• config: コンフィグ情報
• topPageInfo: トップページに関する情報
• currentPageInfo: カレントページに関する情報
• pageInfo: カレントページに関する情報
• breadcrumb: パンくず配列
• parent: 親ページに関する情報
• bros: 兄弟ページ配列
• children: 子ページ配列
• globalMenu: グローバルナビゲーション配列
• shoulderMenu: ショルダーナビゲーション配列
• categoryTop: カテゴリトップページに関する情報
• categorySubMenu: カテゴリトップページの子ページ配列
• href($path): リンク先を取得する
• getCurrentPageInfo(): カレントページ情報を取得する
• getPageInfo(): カレントページ情報を取得する
• getBros($path, $options): 兄弟ページ配列を取得する
• getChildren($path, $options): 子ページ配列を取得する
• getCategoryTop($path): カテゴリトップページに関する情報を取得する
• getGlobalMenu(): グローバルナビゲーション配列を取得する
• getShoulderMenu(): ショルダーナビゲーション配列を取得する
• isPageInBreadcrumb($page_id): ページがパンくず配列に含まれるか調べる