字型選擇 A A A






Electrial Commerce Professional
EZeShop
Lead you out the Technology Forest
  首頁 » 商品目錄 » 免費模組與服務 » FREE10 登入  |  新舊首頁切換  |  我的帳號  |  購物車內容  |  結帳   

osCommerce 圖形化選單
[FREE10]

NT$0
| 產品諮詢| 推薦這個商品給親友| 連結EZeShop |

主選單是網站提供服務的入口,若能以類似Office 2000軟體中的圖形化選單來呈現,將更吸引人。除了圖形化選單之外,本程式也能設定成文字選單,讓你連結到 osCommerce 本身或外部的網頁,比如說設個連結到你在Yahoo或eBay的拍賣商品,雙管齊下一定對銷售有助益。
另外,這個程式也能讓你更方便地展示商品,由你挑選出來的促銷商品就好像是另一種圖形化選單,按下商品的小圖後,就連結到商品的詳細介紹,讓站長在特價與新進商品之外,又多了一個促銷推薦商品的方式。

程式下載(big5版)   程式下載(utf8版)

安裝方法

  1. 下載檔案,解壓到 catalog/includes/boxes/icon_menu.php
  2. 修改左右欄框程式,
    要擺左邊就修改 catalog/includes/column_left.php
    要擺右邊就修改 catalog/includes/column_right.php
    把下列程式碼加到修改程式最後一個 ?> 的前一行

    require(DIR_WS_BOXES . 'icon_menu.php');

    如果要擺放不同位置,就依需要調整上面程式碼的位置。
  3. 修改icon_menu.php裡面標註 setting area 設定區域裡面的設定變數,增加或修改你要的選單項目。

程式參數說明

$mtitle='主選單'; //訊息盒標題文字,若沒有任何文字的空字串,則不顯示標題列
$mwidth=HEADING_IMAGE_WIDTH; //圖形寬度,本例使用後台設定的標題圖案寬
$malign='center'; //選項對齊方式,可以選擇左(left),右(right),置中(center)


增加/修改選單選項
每增加一個選項,就要把下列陣列設定程式碼複製一份,同時設定複製出來的陣列駐標值來決定選項內容,選項內容設定說明如下:

$menu_item[ ]=array(
    'icon'=>'images/table_background_reviews.gif', //選項圖檔路徑
    'mouseover'=>'images/table_background_list.gif', //滑鼠指到選項後呈現的圖檔
    'alert'=>'會員權益', //滑鼠指到選項圖的說明文字
    'text'=>'會員權益', //文字選項內容
    'link'=>'conditions.php' , //點選選項後的連結網址
    'parameter'=>'' //點選選項後的超連結參數
);


應用範例1-圖形化選單
設定區域的設定參數如下:

$mtitle='主選單';
$mwidth=HEADING_IMAGE_WIDTH;
$malign='center';
$menu_item[ ]=array(
    'icon'=>'images/table_background_reviews.gif',
    'mouseover'=>'images/table_background_list.gif',
    'alert'=>'會員權益',
    'text'=>'會員權益',
    'link'=>'conditions.php' ,
    'parameter'=>''
);
$menu_item[ ]=array(
    'icon'=>'images/table_background_cart.gif',
    'mouseover'=>'',
    'alert'=>'出貨退貨',
    'text'=>'出貨退貨',
    'link'=>'shipping.php' ,
    'parameter'=>''
);

上列的參數示範設定了2個選項,其中一個有設定mouseover的圖檔,所以當滑鼠指到該選項便會更換圖檔,另一個沒有設定,所以滑鼠指到該選項仍然是原來的圖檔。

應用範例2-文字選單
設定區域的設定參數如下:

$mtitle='主選單';
$mwidth=HEADING_IMAGE_WIDTH;
$malign='left';
$menu_item[ ]=array(
    'text'=>'eBay拍賣',
    'link'=>'http://www.ebay.com.tw',
    'parameter'=>'target=_blank'
);
$menu_item[ ]=array(
    'text'=>'Yahoo!拍賣',
    'link'=>'http://bid.yahoo.com.tw/',
    'parameter'=>'target=_blank'
);
$menu_item[ ]=array(
    'text'=>'Skype網路電話',
    'link'=>'callto://echo123/',
    'parameter'=>'target=_blank'
);

上例調整了$malign參數,讓文字選項靠左對齊,3個文字選項都設定了parameter參數,讓點選之後跳出新的視窗。

應用範例3-站長推薦商品
設定區域的設定參數如下:

$mtitle='站長推薦';
$malign='center';
$menu_item[ ]=array('pid'=>'19');
$menu_item[ ]=array('pid'=>'5');

上例的選項內容,只要指定pid到所要顯示商品的編號,就可以顯示出該產品的小圖,滑鼠點選後可以看商品的詳細說明。指定商品時均是以後台設定的商品小圖寬度顯示,所以就不需要再設定$mwidth變數來指定圖寬。

移除方法
把增加到column_left.php或column_right.php的程式碼刪除掉即可。

圖形化選單展示畫面

本商品上架日期:2005年06月01日星期3.
評價