2010年2月4日木曜日

NEW! EC-CUBEカスタマイズ(検索フォームの追加)

サイドナビがある状態の時はヘッダーエリアに検索ブロックを表示する

変更ファイル
  • \data\class_extends\page_extends\frontpart\bloc\LC_Page_FrontParts_Bloc_SearchProducts_Ex.php
  • \data\class\pages\LC_Page.php
  • \data\Smarty\templates\default\header.tpl
  • \html\user_data\packages\default\css\main.css

1.LC_Page_FrontParts_Bloc_SearchProducts_Ex.phpにsetSearchProductsファンクションの追加
function setSearchProducts() {
        $arrSearch = array();    // 検索項目表示用
        $objDb = new SC_Helper_DB_Ex();
        // 選択中のカテゴリIDを判定する
        $this->category_id = $objDb->sfGetCategoryId($_GET['product_id'], $_GET['category_id']);
        // カテゴリ検索用選択リスト
        $arrRet = $objDb->sfGetCategoryList('', true, ' ');
        if(is_array($arrRet)) {
            // 文字サイズを制限する
            foreach($arrRet as $key => $val) {
                $arrRet[$key] = SC_Utils_Ex::sfCutString($val, SEARCH_CATEGORY_LEN, false);
            }
        }
        $this->arrCatList = $arrRet;
}


2.LC_Page.phpにLC_Page_FrontParts_Bloc_SearchProducts_Ex.phpの呼び出しとinit()の中にコードを追加

require_once(CLASS_EX_PATH . "page_extends/frontparts/bloc/LC_Page_FrontParts_Bloc_SearchProducts_Ex.php");
function init() {
    $objSearchProducts = newLC_Page_FrontParts_Bloc_SearchProducts_Ex();
        $objSearchProducts->setSearchProducts();
    $this->category_id_header = $objSearchProducts->category_id;
    $this->arrCatList_header = $objSearchProducts->arrCatList;
}

3.header.tpl の#header内に追加

<!--▼搜索条件由此开始-->
<!--{if $arrPageLayout.LeftNavi|@count > 0}-->
    <div id="main_searcharea">
      <!--搜索框-->
        <form name="search_form" id="search_form" method="get" action="<!--{$smarty.const.URL_DIR}-->products/list.php">
        <div id="mainsearchtxt">
          <input type="hidden" name="mode" value="search" />
            <select name="category_id" class="searchcmbbox">
              <option label="从商品分类来选" value="">从商品分类来选</option>
              <!--{html_options options=$arrCatList_header selected=$category_id_header}-->
            </select>
           
            <input type="text" name="name" class="searchtxtbox" maxlength="50" value="<!--{$smarty.get.name|escape}-->" />
        </div>
            <div id="mainsearchbtn"><input type="image" onmouseover="chgImgImageSubmit('<!--{$TPL_DIR}-->image/mainsearchbtn_on.jpg',this)" onmouseout="chgImgImageSubmit('<!--{$TPL_DIR}-->image/mainsearchbtn.jpg',this)" src="<!--{$TPL_DIR}-->image/mainsearchbtn.jpg" class="mainsearchbtn" alt="搜索" name="search" />
            </div>
        </form>
    </div>
<!--{/if}-->
<!--▲搜索条件到此为止-->

4.main.css に最後に追加

/* メイン検索main_searcharea
----------------------------------------------- */
div#main_searcharea {
    float:left;
    clear:both;
    width: 950px;
    height:50px;
    margin: 0 auto;
    background:no-repeat url("../image/mainsearchback.jpg");
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
}
div#main_searcharea .searchcmbbox {
    width: 140px;
    border:inset 1px #bbbbbb;
    margin-left:80px;
}
div#main_searcharea .searchtxtbox {
    width: 360px;
    height:20px;
    border-top:2px solid #aaaaaa;
    border-right:1px solid #cccccc;
    border-left:2px solid #aaaaaa;
    border-bottom:1px solid #cccccc;
    margin-left:15px;
    background: #fff none;
}
div#main_searcharea #mainsearchtxt {
    float:left;
    width: 610px;
}
div#main_searcharea #mainsearchbtn {
    float:left;
}

0 件のコメント:

コメントを投稿