フリーページの使い方(カラーミーショップ) ｜ カスタマイズ無料情報 |カラーミーショップ | ネットショップ制作 運営 代行 | SBD スタイル

-フリーページのカテゴライズ-

　もうご存知の方もいらっしゃるかと思いますが、カラーミーショップのレギュラープランではフリーページをなんと10,000ページ使えるようになりました。
　でも、10,000ページも使ったら訳が分からなくなりますよね？
　そこで、今回は、フリーページの使い方としてカテゴライズをテーマにしたカスタマイズをご紹介したいと思います。
　ちょっとした工夫は必要になりますが、フリーページが増えてからでは大変な作業になってしまいますので早めの取り組みがおすすめです。
では、さっそくご紹介いたします。

フリーページに関連一覧を出す

概要

　この発想は割と単純で、フリーページのタイトルにタグを埋め込む方法です。
　「タグって何？」という方もいらっしゃるかも知れませんが、要はフリーページのタイトル ⇒ ”【美容】スクワランのお話 ”　ってことです。
お分かりいただけましたか？
つまり、【美容】の部分です。

　例、フリーページタイトル一覧
【美容】スクワランのお話
【美容】素敵女子の作り方
【美容】クレンジングのお話
【健康】姿勢矯正のお話
【美容】化粧水のお話
【美容】ポイントメイクのお話
【美容】スキンケア商品のお話
【健康】美容・美肌に効果的な健康茶

タグは何でもよいのですが、上記の例では、フリーページのタイトルの頭に【美容】と【健康】の2種類です。
　これはカラーミーショップのグループ名みたいな感じです。これで準備はできました。

　今回のカスタマイズは、このフリーページの一覧を出すときに、このタグが含まれているものだけ出すことで、
【美容】なら

【美容】スクワランのお話
【美容】素敵女子の作り方
【美容】クレンジングのお話
【美容】化粧水のお話
【美容】ポイントメイクのお話
【美容】スキンケア商品のお話

【健康】なら、

【健康】美容・美肌に効果的な健康茶
【健康】姿勢矯正のお話

　と分けて出すことができます。

　これでフリーページの一覧をタグごとに分けて一覧表示できるようになりました。

　今度は、フリーページ内に今、開いているフリーページ（上記の例なら“【美容】スクワランのお話“のページ）内に、タイトルに【美容】タグが含まれていた場合、【美容】の一覧を出します。

　これが、全概要です。

　お分かりいただけましたか？　この時点で、ん~ぅ？って方はこちらからご質問ください(うまく説明出来なくてゴメンなさい)

　それでは、ここまではお分かりいただいている前提で次へ進みます。

実装コード

　下記においては、フリーページの読み込みを繰り返して【美容】が含まれているものだけをリスト化しています。
 

	
<ul class="free-list">                    
   <{section name=num loop=$freepage}>                         
    <{assign var="biyou" value=$freepage[num].page_title|replace:"【美容】":""}>
    <{if $biyou != $freepage[num].page_title}>
      <{assign var="is_biyou" value="true"}>
    <{/if}>                                                
    <{if $is_biyou == "true"}>
      <li>
        <a href="<{$freepage[num].link_url}>">                              
          <{$freepage[num].page_title}>
        </a>
      </li>                    
    <{/if}>                          
   <{/section}>
</ul>
	

　このコードを呼び出したい場所に記述すれば、【美容】が含まれているフリーページのリンクリストが表示されます。
　また共通ページなどがフリーページで構成されている場合は、そのページのタイトルに【美容】または、【健康】が含まれているかチェックし、含まれているタグ一覧を表示する実装コードが下記になります。

　下記の○○○を各ショップのドメインに書き換えれば使えます。例○○○⇒http://sbd-style.net

	
<{assign var=free value=$smarty.get.mode}>
<{assign var=free value=$free|replace:"f":""}>
<{if $smarty.get.mode != $free}><!--フリーページだった場合-->

  <div class="free-list-box">
    <{if $free_area_flg == true}>
      <!--現在のページタイトル取得-->
      <{assign var=freeNum value=$smarty.get.mode}>                    
      <{assign var=freeNum value=$freeNum|replace:"f":""}>
      <{assign var=freeURL value="○○○/?mode=f$freeNum"}>                    
      <{section name=num loop=$freepage}>
        <{if $freepage[num].link_url == $freeURL}>
          <{assign var="page_title" value=$freepage[num].page_title}>                        
        <{/if}>
      <{/section}>
      
      <!--現在のページが何のタグか-->
      <{assign var="is_biyou_page" value="false"}>
      <{assign var="is_kenkou_page" value="false"}>
      <{assign var="is_diet_page" value="false"}>
      
      <{assign var="biyou" value=$page_title|replace:"【美容】":""}>                    
      <{assign var="kenkou" value=$page_title|replace:"【健康】":""}>
      <{assign var="diet" value=$page_title|replace:"【ダイエット】":""}>
      
      <{if $biyou != $page_title}>
        <{assign var="is_biyou_page" value="true"}>  
      <{elseif $kenkou != $page_title}>
        <{assign var="is_kenkou_page" value="true"}>                    
      <{elseif $diet != $page_title}>
        <{assign var="is_diet_page" value="true"}>                  
      <{/if}>                    
      
    
      <h3>関連ページ <{$page_title}></h3>
      <ul class="free-list">
         <{section name=num loop=$freepage}>
          <{if $freeURL != $freepage[num].link_url}><!--現在のページでは無い場合-->                          
            <{assign var="is_biyou" value="false"}>
            <{assign var="is_kenkou" value="false"}>
            <{assign var="is_diet" value="false"}>                       
           
            <{if $is_biyou_page =="true"}><!--現在のページがびようけいだったら-->
              <{assign var="biyou" value=$freepage[num].page_title|replace:"【美容】":""}>
              <{if $biyou != $freepage[num].page_title}>
                <{assign var="is_biyou" value="true"}>
              <{/if}>                                                
              <{if $is_biyou == "true"}>
                <li class="txt">
                  <a href="<{$freepage[num].link_url}>">
                    <!--<{$biyou}>-->
                    <{$freepage[num].page_title}>
                  </a>
                </li>
              
              <{/if}>                        
            <{/if}>
            
            <{if $is_kenkou_page =="true"}><!--現在のページが健康だったら-->
              <{assign var="kentou" value=$freepage[num].page_title|replace:"【健康】":""}>
              <{if $kentou != $freepage[num].page_title}>
                <{assign var="is_kenkou" value="true"}>
              <{/if}>                                                
              <{if $is_kenkou == "true"}>
                <li class="txt">
                  <a href="<{$freepage[num].link_url}>">
                    <!--<{$kentou}>-->
                    <{$freepage[num].page_title}>
                  </a>
                </li>                        
              <{/if}>                        
            <{/if}>
            
            <{if $is_diet_page =="true"}><!--現在のページが【ダイエット】だったら-->
              <{assign var="diet" value=$freepage[num].page_title|replace:"【ダイエット】":""}>
              <{if $diet != $freepage[num].page_title}>
                <{assign var="is_diet" value="true"}>
              <{/if}>                                                
              <{if $is_diet == "true"}>
                <li class="txt">
                  <a href="<{$freepage[num].link_url}>">
                    <!--<{$kentou}>-->
                    <{$freepage[num].page_title}>
                  </a>
                </li>                        
              <{/if}>                        
            <{/if}>
            
          <{/if}>
          
         <{/section}>
      </ul>
    <{/if}>
  </div>            
    
  
<{/if}>