カラーミーで特定のページのみ共通部分(サイドメニューとか)を非表示にする方法

カラーミーで特定のページのみ共通部分(サイドメニューとか)を非表示にする方法

Posted 2014/04/14 by oredayo

カラーミーでTopページからサイドメニューを消し去る方法

本日のテーマは最近お仕事で触らせて頂く機会がやたらと多いカラーミーに関するナニガシです。

御存知の通りカラーミーは買い物カゴの設置から在庫管理まで出来るショッピングサイトCMSで、htmlやcssがわからない人でも簡単にECサイトが作れるような仕組みになっています。

様々なテンプレートの中から好みのものをチョイスして、自分だけのデザインにカスタマイズすることも可能です。

カラーミにはphp的な独自のタグが存在するわけですが、今日はそんなタグを用いて特定のページでサイドメニューを非表示にする方法を紹介します。

具体的な方法

Topページを例にとって共通部分のサイドメニューを非表示方法を説明します。
まずは状況の整理です。

  • ヘッダー、サイドメニュー、フッターは「共通」というテンプレートに記載されている
  • WordPressでもよく使用する if や include に関する独自タグ

まずはバックアップを取る

カラーミーの管理画面からサイドメニューのデザイン設定>デザイン設定>画面中央部のテンプレートをコピーをクリックします。
テンプレートをコピーしておけば、万が一作業に失敗してしまってもコピーから復元することが可能です。
無料テンプレートなら5つまでしか保持できないため、バックアップはこまめに削除&更新したほうがよいでしょう。

共通部分に条件分岐を加える

カラーミー独自タグの条件分岐は以下の様な感じです。

 <{if $条件}>
条件に当てはまる場合のソース
<{/if}> 

if elseなら

 <{if $条件}>
trueのソース
<{else}>
falseのソース
<{/if}> 

ちなみにincludeはこんな感じ

 <{include file = $file_name} 

つまり、
Topページの場合→Topページのテンプレートファイルのみ
Topページ以外の場合→共通部分+テンプレートファイル
という形で書くだけでOKです。簡単でしょ?

ifで条件を「Topページなら」に指定する方法は

 <{if $file_name == "file:◯/top.tpl"}> 

です。

◯の部分はテンプレートのIDを入力して下さい。
対象テンプレートのプレビューを開きURLの「?tid=◯」の部分がそのままページのIDになります。
テンプレートID
まとめるとこんな感じです。

<{if $file_name == "file:◯/top.tpl"}>
<{include file = $file_name}>
<{else}> 
<header>ヘッダー部分のソース</header>
<{include file = $file_name}>
<aside>サイドメニューのソース</aside>
<footer>フッターのソース</footer>
 <{/if}>

最後に

これさえ知ってれば、結構色々なことに応用できますから、カスタマイズの自由度も相当上がります。

ちなみに先日カラーミーで任意のページ(カテゴリーページとか)にカートを設置する方法という記事も書いているので合わせて読んでみてください。