Twecommerce3.X佈景架構

(樣板引擎)Smarty

關於smarty的部分雖然在前兩本書都已經提過,但因為這是一些觀念與基礎的介紹所以仍簡單的說明一下,避免新加入使用TWE的朋友一頭霧水。

TWE-COMMERCE是採PHP程式碼與HTML碼分離的方式,在了解商店佈景架構前首先先來了解系統使用的(樣板引擎)Smarty,看看(樣板引擎)Smarty如何來扮演PHP程式碼與HTML碼之間的橋樑。

Smarty 是一個專為PHP程式碼所衍生的(樣板引擎)或是(模板引擎)。其最主要的目的是在於分離PHP程式碼與HTML網頁程式碼,為何要分離呢?

簡單的說很多的PHP程式設計師對於網頁美工可能興趣缺缺,可能對美工沒概念,如果要同時輯寫程式又要顧及美工,會是一件相當痛苦的事。相對的很多對網頁美工有概念有經驗的網頁設計師,可能對PHP程式完全不了解,或是說一知半解,那當這位網頁美工設計師拿到一支PHP程式碼與HTML程式碼混合的程式時,那也絕對是一種折磨。

所以有了所謂Smarty(樣板引擎)的誕生,讓PHP程式設計師專注於其程式部分的發展,讓網頁美工專職於美工設計部份,能在個人專業領域裡各斯其職,它的角色等於是PHP與HTML彼此的溝通橋樑與媒介。

Smarty是使用物件導向(OOP)的方式編寫,目前TWE3.0是使用Smarty_2.6.19的版本。

TWE裡的Smarty並沒有運用到很多的函式,都是用 Smarty 的語法 (if、foreach、section)來搭配PHP變數內容作呈現。以TWE的程式架構不外乎如下:

建立Smarty 物件

拉進左右區塊

拉進程式所需函式

指定導行列與拉進頁首程式

從資料庫中列出所需資料

將變數指派為Smarty參數

指派Smarty使用的HTML檔案

顯示網頁

如果以實際程式為例,可以將程式解釋如下:

檔案名稱:address_book.php

<?php

/* ------------------------------------------------------------------------------------

   $Id: address_book.php,v 1.5 2004/02/07 23:05:09 oldpa   Exp $  

   TWE-Commerce - community made shopping

   http://www.oldpa.com.tw

   Copyright (c) 2003 TWE-Commerce

------------------------------------------------------------------------------------

based on:

(c) 2000-2001 The Exchange Project  (earlier name of osCommerce)

(c) 2002-2003 osCommerce(address_book.php,v 1.57 2003/05/29); www.oscommerce.com

(c) 2003    nextcommerce (address_book.php,v 1.14 2003/08/17); www.nextcommerce.org

(c) 2003    xt-commerce  www.xt-commerce.com

Released under the GNU General Public License

---------------------------------------------------------------------------------*/版權宣告

  include( 'includes/application_top.php');//拉進application_top.php裡面有載入 Smarty 樣版引擎

  $smarty = new Smarty;

1建立Smarty 物件

require(DIR_FS_CATALOG .'templates/'.CURRENT_TEMPLATE. '/source/boxes.php');

2拉進左右區塊

  require_once(DIR_FS_INC . 'twe_address_label.inc.php');

  require_once(DIR_FS_INC . 'twe_get_country_name.inc.php');

  require_once(DIR_FS_INC . 'twe_image_button.inc.php');

  require_once(DIR_FS_INC . 'twe_count_customer_address_book_entries.inc.php');

   require_once(DIR_FS_INC . 'twe_js_zone_list.inc.php');

3拉進程式所需函式

  if (!isset($_SESSION['customer_id'])) {   

    twe_redirect(twe_href_link(FILENAME_LOGIN, '', 'SSL'));

  }//檢查是否為登入客戶,如果不是,將客戶導向登入頁面

$breadcrumb->add(NAVBAR_TITLE_1_ADDRESS_BOOK, twe_href_link(FILENAME_ACCOUNT, '', 'SSL'));

$breadcrumb->add(NAVBAR_TITLE_2_ADDRESS_BOOK, twe_href_link(FILENAME_ADDRESS_BOOK, '', 'SSL'));

require(DIR_WS_INCLUDES . 'header.php');

4指定導行列與拉進頁首程式

if ($messageStack->size('addressbook') > 0) {

$smarty->assign('error',$messageStack->output('addressbook'));

}//指派錯誤訊息參數

$smarty->assign('ADDRESS_DEFAULT',twe_address_label($_SESSION['customer_id'], $_SESSION['customer_default_address_id'], true, ' ', '<br>'));//指派客戶預設地址,twe_address_label()函式會依客戶$_SESSION['customer_id']從資料庫中將該客戶預設的地址列出。

$addresses_data=array();

  $addresses_query = "select address_book_id, entry_firstname as firstname, entry_lastname as lastname, entry_company as company, entry_street_address as street_address, entry_suburb as suburb, entry_city as city, entry_postcode as postcode, entry_state as state, entry_zone_id as zone_id, entry_country_id as country_id from " . TABLE_ADDRESS_BOOK . " where customers_id = '" . (int)$_SESSION['customer_id'] . "' order by firstname, lastname";

  $addresses =  $db->Execute($addresses_query);

  while (!$addresses->EOF) {

    $format_id = twe_get_address_format_id($addresses->fields['country_id']);

     if ($addresses->fields['address_book_id'] == $_SESSION['customer_default_address_id']) {

     $primary = 1;

     } else {

     $primary =0;

}

5從資料庫中列出所需資料

$addresses_data[]=array('NAME'=> $addresses->fields['firstname'] . ' ' . $addresses->fields['lastname'],

'BUTTON_EDIT'=> '<ahref="' .twe_href_link(FILENAME_ADDRESS_BOOK_PROCESS,'edit='.$addresses->fields ['address_book_id'],'SSL').'">'.twe_image_button('small_edit.gif', SMALL_IMAGE_BUTTON_EDIT).'</a>',

'BUTTON_DELETE'=>'<a href="' .twe_href_link(FILENAME_ADDRESS_BOOK_PROCESS,'delete=' .$addresses->fields ['address_book_id'],SSL') .'">' .twe_image_button('small_delete.gif',SMALL_IMAGE_BUTTON_DELETE) . '</a>' , 'ADDRESS'=> twe_address_format($format_id, $addresses, true, ' ', '<br>'),

'PRIMARY'=> $primary);

}

將資料庫中列出的資料指派成陣列變數,一般如果HTML欲顯示的資料不多,不一定需要使用陣列方式。

$smarty->assign('addresses_data',$addresses_data);

$smarty->assign('BUTTON_BACK','<a href="' .twe_href_link(FILENAME_ACCOUNT,'','SSL') .'">

' .twe_image_button('button_back.gif', IMAGE_BUTTON_BACK) . '</a>');

  if (twe_count_customer_address_book_entries() < MAX_ADDRESS_BOOK_ENTRIES) {

  $smarty->assign('BUTTON_NEW','<a href="' .twe_href_link(FILENAME_ADDRESS_BOOK_PROCESS,'','SSL') .'">' .twe_image_button('button_add_address.gif', IMAGE_BUTTON_ADD_ADDRESS) . '</a>');

  }

$smarty->assign('ADDRESS_COUNT',sprintf(TEXT_MAXIMUM_ENTRIES, MAX_ADDRESS_BOOK_ENTRIES));

  $smarty->assign('language', $_SESSION['language']);

  $smarty->caching = 0;

6將變數指派為Smarty參數

  $main_content=$smarty->fetch(CURRENT_TEMPLATE . '/module/address_book.html');

7指派Smarty使用的HTML檔案

  $smarty->assign('language', $_SESSION['language']);

  $smarty->assign('main_content',$main_content);

  $smarty->caching = 0;

  $smarty->display(CURRENT_TEMPLATE . '/index.html');

8顯示網頁

?>

用最口語化的方式來看看使用到的幾個smarty函式:

fetch()從字面意思來看fetch(拿來)、(去請..來)。在實際例子中:

$main_content=$smarty->fetch(CURRENT_TEMPLATE . '/module/address_book.html');

我們可以將整段程式解釋成:

頁面變數$main_content =$smarty->去請(商店佈景資料夾/module/address_book.html)來;

assign()從字面意思來看assign(分派)、(分配)。實際例子中:

$smarty->assign('main_content',$main_content);

我們可以將整段程式解釋成:

$smarty->指派(html使用參數,頁面變數);

 display()從字面意思來看display(顯示、陳列)。實際例子中:

$smarty->display(CURRENT_TEMPLATE . '/index.html');

我們可以將整段程式解釋成:

$smarty->顯示(商店佈景資料夾/index.html);

這樣是否有助於您了解smarty程式運作模式?

接下來看看address_book.html裡面程式處理address_book.php變數的模式,在這裡列舉資料陣列處理的方式:

{foreach name=aussen item=addresses from=$addresses_data}

<table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr class="moduleRow" onmouseover="rowOverEffect(this)"onmouseout="rowOutEffect(this)">

<td class="main"><strong>{$addresses.NAME}</strong> {if $addresses.PRIMARY=='1'}

<em>({#title_standard#})</em>

{/if}

</td>

<td>

<div align="right">{$addresses.BUTTON_EDIT} {$addresses.BUTTON_DELETE}</div>

</td></tr><tr>

<td class="main">{$addresses.ADDRESS}</td>

<td>&nbsp;</td>

</tr>

</table>

{/foreach}

當address_book.php程式變數以陣列的方式丟給HTML時(在address_book.php程式中參考:將資料庫中列出的資料指派成變數),可以使用foreach這個smarty內建函數來處理,foreach在使用時必須是成對的,其必要的參數為item跟from缺一不行。

from:是對映address_book.php程式中陣列參數。

範例中程式段{foreach name=aussen item=addresses from=$addresses_data}

其中from=$addresses_data是對應到address_book.php程式中(參考6將變數指派為Smarty參數), $smarty->assign('addresses_data',$addresses_data);其中$addresses_data為陣列變數。

item:是指定項目名稱

範例中程式段{foreach name=aussen item=addresses from=$addresses_data}

其中item=addresses,所以要指定顯示陣列資料時使用{$addresses.NAME}、{$addresses.BUTTON_EDIT},例如如果將item參數改變例如:item=test,那要指定顯示陣列資料時就要使用{$test.NAME}、{$test.BUTTON_EDIT}。

另外值得注意的是儘管在address_book.php有指派變數,但是在HTML裡如果沒有將變數套入,仍不會有該變數值顯示,當然也不會有錯誤訊息。

smarty的運用很廣,在這裡只做簡單的介紹,如果您對smarty有進一步需求,可以至http://smarty.php.net/網站參考相關文件。

佈景程式檔案對照

首先來了解一下TWE-COMMERCE整個佈景檔案的編排與程式之間的關係。

系統放置佈景檔案的資料夾在(商店資料夾/templates/),預設佈景檔名為(twe),在(twe)資料夾裡,有放置著各個網頁、email、區塊..等等使用的佈景檔案。

(商店資料夾/templates/twe/)

admin資料夾後台使用郵件與列印檔案

mail資料夾放置電子郵件佈景(這是會郵寄給各戶的MAIL佈景)

print_packingslip.html包裝列印

print_order.html訂單列印

english資料夾電子郵件佈景英文檔

send_gif.txt管理員傳送禮劵文字檔

send_gif.html管理員傳送禮劵HTML格式檔

send_coupon.txt管理員傳送折價劵文字檔

send_coupon.html管理員傳送折價劵HTML格式檔

gift_accepted.txt購買禮劵釋出文字檔

gift_accepted.html購買禮劵釋出HTML格式檔

create_account_mail.txt管理員新增帳號文字檔

create_account_mail.html管理員新增帳號HTML格式檔

change_order_mail.txt變更出貨狀態文字檔

change_order_mail.html變更出貨狀態HTML格式檔

tchinese資料夾電子郵件佈景中文檔

send_gif.txt管理員傳送禮劵文字檔

send_gif.html管理員傳送禮劵HTML格式檔

send_coupon.txt管理員傳送折價劵文字檔

send_coupon.html管理員傳送折價劵HTML格式

gift_accepted.txt購買禮劵釋出文字檔

gift_accepted.html購買禮劵釋出HTML格式檔

create_account_mail.txt管理員新增帳號文字檔

create_account_mail.html管理員新增帳號HTML格式檔

change_order_mail.txt變更出貨狀態文字檔

change_order_mail.html變更出貨狀態HTML格式檔。

boxes資料夾放置商店前台左右區塊HTML佈景檔

  box_whatsnew html新上市商品區塊

  box_tell_friend html推薦給親友區塊

  box_specials html特價商品區塊

  box_search html搜尋區塊

  box_reviews html商品評論區塊

  box_order_history html訂單紀錄區塊

  box_notifications html商品通知區塊

  box_manufacturers_info html廠商資訊區塊

  box_manufacturers html廠商區塊

  box_news.html新聞跑馬登

  box_news_categories.html新聞目錄

  box_login html登入區塊

  box_languages html語言選擇區塊

  box_information html資訊台區塊

  box_infobox html客戶群組資訊區塊(功能未開啟)

  box_currencies html貨幣選擇區塊

  box_content html服務台區塊

  box_categories html商品目錄區塊

  box_cart html購物籃區塊

  box_best_sellers html暢銷商品區塊

  box_admin html管理員資訊區塊

  box_add_a_quickie html快速購買區塊

buttons資料夾放置商店前台按鈕圖片

english資料夾前台按鈕英文圖片

tchinese資料夾前台按鈕中文圖片

img資料夾放置商店佈景相關圖片(LOGO、圖示..等等)

javascript資料夾放置JAVA檔案

general.js.php這支檔案目前沒有內容,如果商店佈景有使用到JAVA語言可以將JAVA程式語言內容填入,這個general.js.php檔在(商店資料夾/includes/header.php)已經拉進程式中,所以只要填入內容就會有作用。

mail資料夾放置商店前台相關電子郵件佈景檔

english資料夾英文電子郵件佈景檔

  change_password_mail.txt忘記密碼通知郵件文字檔

  change_password_mail.html忘記密碼通知郵件html格式檔

  create_account_mail.txt註冊通知郵件文字檔

  create_account_mail.html註冊通知郵件HTML格式檔

  order_mail.txt訂單通知郵件文字檔

  order_mail.html訂單通知郵件HTML格式檔

  send_gift_to_friend.txt寄禮劵給親友郵件文字檔

  send_gift_to_friend.html寄禮劵給親友郵件HTML格式檔

  tell_friend_mail.txt推薦商品給親友郵件文字檔

  tell_friend_mail.html推薦商品給親友郵件HTML格式檔

tchinese資料夾中文電子郵件佈景檔

  change_password_mail.txt忘記密碼通知郵件文字檔

  change_password_mail.html忘記密碼通知郵件html格式檔

  create_account_mail.txt註冊通知郵件文字檔

  create_account_mail.html註冊通知郵件HTML格式檔

  order_mail.txt訂單通知郵件文字檔

  order_mail.html訂單通知郵件HTML格式檔

  send_gift_to_friend.txt寄禮劵給親友郵件文字檔

  send_gift_to_friend.html寄禮劵給親友郵件HTML格式檔

  tell_friend_mail.txt推薦商品給親友郵件文字檔

  tell_friend_mail.html推薦商品給親友郵件HTML格式檔

module資料夾放置模組佈景檔(中央區塊)

center_modules資料夾中央首頁模組樣式檔

  center_news.html中央首頁新聞樣式佈景檔

  new_products_default.html中央首頁新上市商品樣式佈景檔

  products_best.html中央首頁暢銷商品樣式佈景檔

  products_featured.html中央首頁推薦商品樣式佈景檔

  specials_center.html中央首頁特價商品樣式佈景檔

  upcoming_products.html中央首頁即將上市商品樣式佈景檔

product_options資料夾商品屬性選擇樣式佈景檔

  table_listing.html列表式樣式佈景檔

  product_options_selection.html選項式樣式佈景檔

  product_options_dropdown.html下拉式樣式佈景檔

product_listing資料夾放置商品列表樣式檔案

  product_listing_v1.html商品列表佈景檔

product_info資料夾放置商品明細樣式檔

  product_info_v1.html商品明細樣式檔

categorie_listing資料夾放置商品目錄樣式檔

  categorie_listing.html商品目錄樣式檔

news_categorie_listing資料夾放置商品目錄樣式檔

  categorie_listing.html新聞目錄樣式檔

news_product_info資料夾放置商品明細樣式檔

  product_info_v1.html新聞明細樣式檔

news_product_listing資料夾放置商品列表樣式檔案

  product_listing_v1.html新聞列表佈景檔

news_product_options資料夾商品屬性選擇樣式佈景檔

  table_listing.html新聞列表式樣式佈景檔

  product_options_selection.html新聞選項式樣式佈景檔

  product_options_dropdown.html新聞下拉式樣式佈景檔

  ………………………………………………………………………………….

  tell_a_friend.html推薦給親友佈景檔

  ssl_check.html SSL檢查佈景檔

  specials.html 特價商品佈景檔

  shopping_cart.html購物車內容佈景檔

  reviews.html商品評論佈景檔

  products_reviews.html商品評論佈景檔

  products_media.html商品額外說明佈景檔

  product_reviews_write.html寫評論佈景檔

  product_reviews_info.html商品評論明細佈景檔

  product_navigator.html商品導覽列佈景檔

  print_product_info.html列印商品明細佈景檔

  print_order.html列印訂單明細佈景檔

  popup_search_help.html搜尋彈出視窗佈景檔

  password_forgotten.html忘記密碼佈景檔

  order_details.html訂單明細佈景檔

  new_products_overview.html商品明細佈景檔

  new_products.html商品明細佈景檔

  main_content.html中央頁面內容佈景檔

  news_new_products_default.html新聞明細佈景檔

  news_new_products.html新聞明細佈景檔

  news_main_content.html中央頁面新聞內容佈景檔

  logoff.html登出佈景檔

  login.html登入佈景檔

  gv_send.html郵寄禮劵佈景檔

  gv_redeem.html兌換禮劵佈景檔

  gv_faq.html禮劵使用說明佈景檔

  graduated_price.html分級價格佈景檔

  gift_cart.html禮劵兌換佈景檔

  error_message.html錯誤訊息佈景檔

  create_account_guest.html非會員購物註冊表單佈景檔

  create_account.html會員購物註冊表單佈景檔

  cookie_usage.html COOKIE使用說明佈景檔

  content.html中央頁面內容佈景檔(連結)

  contact_us.html聯絡我們佈景檔

  checkout_success.html結帳完成佈景檔

  checkout_shipping_address.html結帳變更出貨地址佈景檔

  checkout_shipping.html結帳出貨方式佈景檔

  checkout_payment_address.html結帳付款方式變更地址佈景檔

  checkout_payment.html結帳付款方式佈景檔

  checkout_new_address.html新增出貨地址佈景檔

  checkout_confirmation.html結帳訂單確認佈景檔

  also_purchased.html推薦購買商品佈景檔

  advanced_search.html進階搜尋佈景檔

  address_book_process.html新增、編輯地址佈景檔

  address_book_details.html註冊表單欄位明細佈景檔

  address_book.html變更地址佈景檔

  account_password.html變更密碼佈景檔

  account_notifications.html變更商品通知佈景檔

  account_newsletter.html變更電子報佈景檔

  account_history_info.html單筆訂單紀錄佈景檔

  account_history.html訂單紀錄佈景檔

  account_edit.html編輯帳號佈景檔

  account.html我的帳號佈景檔

source資料夾放置區塊程式檔案

inc資料夾放置區塊含括檔

  twe_show_category.inc.php商品目錄樣式含括程式檔案

  twe_show_news.inc.php新聞目錄樣式含括程式檔案

boxes資料夾放置區塊php程式

  add_a_quickie.php快速購買區塊樣式程式檔案

  admin.php管理員資訊樣式程式檔案

  best_sellers.php暢銷商品區塊樣式程式檔案

  box_news.php新聞跑馬燈區塊樣式程式檔案

  categories.php商品目錄區塊樣式程式檔案

  content.php服務台區塊樣式程式檔案

  currencies.php貨幣區塊樣式程式檔案

  infobox.php客戶群組資訊區塊樣式程式檔案

  information.php資訊台區塊樣式程式檔案

  languages.php語言區塊樣式程式檔案

  loginbox.php登入區塊樣式程式檔案

  manufacturer_info.php廠商資訊區塊樣式程式檔案

  manufacturers.php廠商區塊樣式程式檔案

  news_categories.php新聞目錄區塊樣式程式檔案

  order_history.php 訂單紀錄區塊樣式程式檔案

  product_notifications 商品通知區塊樣式程式檔案

  reviews.php 商品評論區塊樣式程式檔案

  search.php商品搜尋區塊樣式程式檔案

  shopping_cart.php購物籃區塊樣式程式檔案

  specials.php特價商品區塊樣式程式檔案

  tell_a_friend.php推薦給親友區塊樣式程式檔案

  whats_new.php新上架商品區塊樣式程式檔案

boxes.php(區塊導入條件程式)

index.html商店頁面區塊編排佈景檔

stylesheet.css CSS檔案(定義字體、顏色、背景..等等)。

Twecommerce3.0佈景架構

關於佈景的製作與套版在第二版的書中也經介紹過,之前TWE版本的佈景對一個不懂程式的使用者來說在版面的編排與配置上是相當棘手的,這段時間在oldpa幫客戶更改網站程式時,經常會發現客戶將網站版面製作的相當精美,在功能區塊的配置上也簡化許多,但是一檢查程式大部分的客戶並沒有將省略掉的區塊程式註解掉,也就是說雖然版面看不到該功能區塊但是程式依舊在RUN資料庫依舊在「select」,或許商品數量少或是同時上限人數不多感覺不出差異,但實際上是浪費了許多資源。

在之前版本的佈景檔中例如:templates/twe/source/boxes.php,檔案裡出現:

require(DIR_WS_BOXES . 'box_news.php');

require(DIR_WS_BOXES . 'news_categories.php');

require(DIR_WS_BOXES . 'whats_new.php');

require(DIR_WS_BOXES . 'search.php');

require(DIR_WS_BOXES . 'content.php');

..........等等

這些都是指定拉進哪些區塊進來的敘述,如果只將templates/twe/index.html中的{$box_NEWS}的參數拿掉而沒有將templates/twe/source/boxes.php中的

require(DIR_WS_BOXES . 'box_news.php');

註解掉,那就是程式依舊在跑只是畫面沒有顯示,就是形成浪費。註解的方式很簡單只需在程式段前方加入兩個斜線例如:

//require(DIR_WS_BOXES . 'box_news.php');

如此簡單的動作就能節省SERVER的資源。

那有何方式可以不用更改程式就能達到如此效果?答案就在Twecommerce3.0新增加的版面配置功能。

在新的版面中目前區分為區塊功能與中央頁面,在中央首頁部分增加了暢銷商品與推薦商品模組,關於中央首頁模組的程式部分通通放在:程式資料夾/includes/modules/center_modules/下,中央首頁模組的佈景檔通通放置在:程式資料夾/ templates/twe/module/center_modules/,在左右區塊的部分仍然沿用之前的路徑,爾後要新增中央首頁模組或左右區塊都須將程式放入同等位置,這樣程式才會自動抓取安裝並使用。

區塊功能又分為左右區塊與獨立區塊,中央頁面分為中右、中左、中央,所以基本上可以將版面配置的模式會相當多樣,以下列舉幾個樣式(圖 6-1)為預設佈景,資料夾名稱為twe,採取的方式為上方獨立區塊共放置了會員登入、新聞跑馬燈、語系選擇三個區塊並將此三個功能區塊的佈景設計成橫向式的編排,由於受版面寬度的限制,所以只放了三個功能區塊,當然程式並沒有限制將幾個功能放在獨立區塊,但程式目前是預設限制在三個區塊後會向下折一行,等等在拆解程式時在一同解說,其餘非獨立區塊的功能區塊通通放置在左邊區塊,中央頁面商品都顯示兩項後折下一行,大部份程式參考的參數都設計在後台管理以方便操作更改。

首頁參數

(圖 6-1):

進入「後台管理」>>「系統設定」>>「首頁商品列表設定」,這些參數的設定只會影響首頁的表現(圖 6-2):

(圖 6-2)

在設定這些參數前必須與版面配置的方式作配合。

1.顯示幾則新聞:

這個項目指定中央新聞模組最多只能顯示幾則新聞,這會影響新聞模組區塊的高度,越多則新聞高度越高,目前新聞模組沒有加入每一列顯示數量的參數。

2.每一列可列多少個最新商品:

這個項目指定每一列可以最多顯示幾個商品後折下一行,這會影響新商品區塊的寬度,由於預設新商品佈景編排是採圖左文字右的方式,如果打算每列要多出兩個商品,那可能必須更改新商品佈景new_products_default.html成為上圖下文字的模式,計算一下圖片寬度與中央區塊寬度的比例,最多每一列能塞入幾個商品。

3.顯示幾個最新商品:

這個項目指定最多顯示幾個最新商品,這會直接影響新商品區塊的高度,如果區塊顯示在中左而每列指定一個最新商品最多顯示<10個商品,那這個區塊將會相當高。

4.每一列可列多少個特價商品:

當後台有指定特價商品時會出現「特價商品」中央區塊,這個項目指定每一列可以最多顯示幾個特價商品後折下一行,這會影響特價商品區塊的寬度,由於預設特價商品佈景編排是採圖左文字右的方式,如果打算每列要多出兩個商品,那可能必須更改新商品佈景specials_center.html成為上圖下文字的模式,計算一下圖片寬度與中央區塊寬度的比例,最多每一列能塞入幾個特價商品。

5.顯示幾個特價商品:

當後台有指定特價商品時此參數才會被引用,這個項目指定最多顯示幾個特價商品,這會直接影響特價商品區塊的高度。

6h.商品上市預告:

當上架商品時有指定未來上架日期時此區塊會顯現,這個項目指定中央即將上市商品模組最多只能顯示幾個商品,這會影響「即將上市商品」模組區塊的高度,越多則區塊高度越高,目前「即將上市商品」模組沒有加入每一列顯示數量的參數。

7.每一列可列多少個暢銷商品:

當前台有客戶購買商品產生訂單後會出現「暢銷商品」中央區塊,這個項目指定每一列可以最多顯示幾個暢銷商品後折下一行,這會影響暢銷商品區塊的寬度,由於預設暢銷商品佈景編排是採圖左文字右的方式,如果打算每列要顯示大於兩個商品,那可能必須更改新商品佈景products_best.html成為上圖下文字的模式,計算一下圖片寬度與中央區塊寬度的比例,最多每一列能塞入幾個暢銷商品。

8.顯示幾個暢銷商品:

當前台有客戶購買商品產生訂單後此參數才會被引用,這個項目指定最多顯示幾個暢銷商品,這會直接影響「暢銷商品」區塊的高度。

91.每一列可列多少個推薦商品:

當商品上架時有指定商品為推薦商品時會出現「推薦商品」中央區塊,這個項目指定每一列可以最多顯示幾個推薦商品後折下一行,這會影響暢推薦品區塊的寬度,由於預設推薦商品佈景編排是採圖左文字右的方式,如果打算每列要顯示大於兩個商品,那可能必須更改新商品佈景products_featured.html成為上圖下文字的模式,計算一下圖片寬度與中央區塊寬度的比例,最多每一列能塞入幾個推薦商品。

10.顯示幾個推薦商品:

當商品上架時有指定商品為推薦商品時此參數才會被引用,這個項目指定最多顯示幾個推薦商品,這會直接影響「推薦商品」區塊的高度。

以上這十個參數最後將取決於該模組是否有啟用(圖 6-3)。

區塊配置

區塊配置功能主要分為三個部分,進入「後台管理」>>「系統設定」>>「區塊配置」:

(圖 6-3)>

第一個部分

最上方是用框架的方式將商店前台帶入,方便可以立即檢視版面配置但由於擔心整個頁面拉的太長,所以只設定高度200,如果相顯示大一點或是不相使用此框架,那可以開啟admin/layout_controller.php找出第305行:

       <tr><td><iframe src="<?php echo 'index.php'; ?>" width="100%" height="200" border="0" frameborder="1"></iframe></td></tr>

如要更改高度請更改height的值,如不想使用此框架可將整段程式刪除.

更換Logo:

這個項目可以更換商店LOGO(包括討論區LOGO都會一起更換),旁邊會顯示目前使用LOGO的檔名與尺寸例如:logo.jpg-->883X242,如欲更換LOGO只需按下「瀏覽」按鈕(圖6-4):

(圖6-4)

從彈出視窗中選擇本機製作好的LOGO圖檔後按下「儲存」鈕即可將LOGO置換(圖6-5)

(圖6-5)

在製作LOGO時應注意整體版面寬度,如以目前螢幕主流1024X768的寬度來說,全版寬度最好以1003px~1004px為主,因為必須扣除右方捲軸的寬度。

總寬:

這裡指的是版面的總寬度,總寬=左欄寬+右欄寬+中央寬。

左欄寬:

這裡指的是放置在版面左手邊區塊的寬度。

右欄寬:

這裡指的是放置在版面右手邊區塊的寬度。

中央寬: 

這裡指的是放置在版面正中央區塊的寬度。

以上欄位皆可同時輸入後按下「儲存」鈕,即可更改版面的LOGO與欄寬。

區塊路徑:E:/AppServ/www/twe30/templates/twe/source/boxes/ ...  

左右與獨立區塊程式放置的位置 。

中央模組路徑E:/AppServ/www/twe30/includes/modules/center_modules/ ... 

中央模組程式放置的路徑位置。

第二個部分

接下來是各個區塊的目前狀態:

檔名

表單的頂端

檔名

對應區塊

 

box_news.php

新聞跑馬燈

 

shopping_cart.php

購物欄

 

categories.php

商品目錄

 

news_categories.php

新聞目錄

 

loginbox.php

會員登入

 

add_a_quickie.php

快速購買

 

infobox.php

會員資訊

 

content.php

服務台

 

search.php

搜尋

 

languages.php

語系

 

specials.php

特價商品

 

whats_new.php

新上架商品

 

information.php

資訊台

 

best_sellers.php

暢銷商品

 

reviews.php

商品評論

 

order_history.php

購物紀錄

 

manufacturer_info.php

廠商資訊

 

manufacturers.php

廠商

 

tell_a_friend.php

推薦商品給親友

 

currencies.php

貨幣

 

admin.php

管理員

 

shop_content.php

中央首頁內容

 

center_news.php

中央首頁新聞

 

products_best.php

中央首頁暢銷商品

 

products_featured.php

中央首頁推薦商品

 

specials_center.php

中央首頁特價商品

 

new_products.php

中央首頁新商品

 

upcoming_products.php

中央首頁即將上市商品

 

主要狀態

顯示目前區塊開啟或關閉的狀態,「綠燈」為開啟,「紅燈」為關閉,可直接按下燈號設定開啟或關閉,此處狀態為最高原則,如未開啟則下面所有參數與位置將不會被引用。

縱列

顯示目前區塊位置,在左右區塊中只有兩種情況(圖6-5-A):

(圖6-5-A)

打勾代表目前所處位置,紅燈代表可以放置的位置,欲選擇另一邊顯示直接按下該位置紅燈即可變換。

在中央區塊的狀況,總共有三種狀態(圖6-5-B),分別為中左、中央、中右:

(圖6-5-B)

綠色打勾代表目前位置,紅燈代表可以放置的位置,欲選擇更換直接按下該位置紅燈即可變換。

排序

區塊的排列順序,越上方數字越小,獨立區塊越左方數字越小,中央模組的中左與中右與獨立區塊相同。

獨立區塊狀態

此獨立區塊獨立於左區塊或右區塊,不受「縱列」左右參數影響(圖6-5-C):

(圖6-5-C)

當獨立區塊開啟時,縱列項目會隱藏,「獨立區塊狀態」會顯示開啟字樣,非獨立區塊會顯示紅色關閉字樣,欲設定該區塊為獨立區塊時,按下「動作」欄位的小圖示或是旁邊的「編輯」鈕(圖6-5-D)進入編輯畫面:

(圖6-5-D)

在(獨立區塊狀態)選紐處選擇「開啟」或「關閉」,也可同時編輯其他項目,按下「更新」鈕後即可完成設定。

動作

點選圖示可立即進入該區塊的編輯畫面進行編輯。

第三個部分

在頁面最下方有八個預設的版面配置(圖6-6)

(圖6-6)

點選其中任一個圖示,則會將目前佈景以圖示上的編排方式來做版面配置。

簡單介紹完「版面配置」與「首頁商品列表設定」的各相功能後,可以很清楚看到兩者息息相關,現在依實際範例來看看其中變化。

以(圖6-7)的版面配置使用的是templates_1:

(圖6-7)

「後台管理」>>「系統設定」>>「首頁商品列表設定」

顯示幾則新聞  5

每一列可列多少個最新商品  2

顯示幾個最新商品  10

每一列可列多少個特價商品  2

顯示幾個特價商品  2

商品上市預告  10

每一列可列多少個暢銷商品  2

顯示幾個暢銷商品  2

每一列可列多少個推薦商品  2

顯示幾個推薦商品  2

如此的設定可以得到(圖6-7)的結果,如果將版面配置給成templates_6(圖6-7-A):

(圖6-7-A)

商店前台的版面配置會成為(圖6-8):

(圖6-8)

整個版面被撐開了,主要原因是(圖6-9)

(圖6-9)

排在中右的中央內容使用的Falsh寬度是580、特價商品每列秀出兩個,排在中左的推薦商品與暢銷商品每列秀出兩個,現在將shop_content.php調整為置中,「後台管理」>>「系統設定」>>「首頁商品列表設定」

每一列可列多少個特價商品  1

顯示幾個特價商品  1

每一列可列多少個暢銷商品  1

顯示幾個暢銷商品  1

每一列可列多少個推薦商品  1

顯示幾個推薦商品  1

調整後的商店首頁(圖6-10)

(圖6-10)

版面已經依正常寬度顯示,從以上例子可以知道,「中左」與「中右」的區塊依序是:顯示中左一個區塊後折一行顯示下一個中左區塊,當中左區塊顯示完後會開始顯示中右區塊,中右區塊顯示一個之後折一行顯示下一個中右區塊,中右區塊顯示完後開始顯示置中的區塊,置中的區塊顯示一個後折一行顯示下一個置中區塊,直到置中區塊全部顯示完畢。

能不能顛倒呢?將置中先顯示再顯示中左或中右?當然是可以的只是這必須從程式佈景檔main_content.html去做調整,等稍後拆解程式時在一並解說。

如果此時將顯示數量作一改變例如:「後台管理」>>「系統設定」>>「首頁商品列表設定」

每一列可列多少個特價商品  1

顯示幾個特價商品 2

每一列可列多少個暢銷商品  1

顯示幾個暢銷商品 2

每一列可列多少個推薦商品  1

顯示幾個推薦商品 2

商店前台呈現的結果(圖6-10):

(圖6-11)

當然這些結果必須取決於是否有上架商品?幾個?、是否有指定特價商品?幾個?、是否有指定推薦商品?幾個?、是否有訂單產生?幾個?...等等因素。

調整完相關設定與參數後為何區塊沒出現?在區塊來說有些區塊必須有products_id的值時才會出現,例如推薦商品給親友、商品評論、廠商資訊...等等,有的是登出後才會出現例如:登入區塊。有的是開始結帳時會消失例如:購物籃。

Twecommerce3.0經過佈景核心修改後,可以很容易的開關區塊與調整位置,而不會浪費資源。

更換佈景

更換佈景的方式與之前版本方式大致相同,唯獨在更換佈景後必需作一次的「版面配置」,讓程式將區塊佈景資料記錄到資料庫,接下來依實做來講解。

當你取得佈景後例如佈景檔名為(twe30_1),將(twe30_1)資料夾上傳至SERVER端的templates資料夾下,進入「後台管理」>>「系統設定」>>「我的商店」(圖6-12):

(圖6-12)

商店使用佈景 (Theme)項目選擇新佈景(twe30_1)後,按下儲存鈕完成更新。

進入「後台管理」>>「系統設定」>>「版面配置」(圖6-13):

(圖6-13)

會出現發現新佈景與發現新區塊的提示,代表著程式已經將這些資料寫入資料庫中了,接著只需要去佈置版面即可。

當執行「後台管理」>>「系統設定」>>「版面配置」這支程式時,程式會去檢查templates下有無未紀錄的佈景檔,再檢查templates/佈景檔名稱/source/boxes/下有無未紀錄的區塊程式,再檢查includes/modules/center_modules/下有無未紀錄的中央區塊模組,如果沒有程式會略過,如果有程式會將資料記錄到資料庫裡。

那如果是中途刪除掉了區塊或是中央模組程式或如何呢?例如將templates/佈景檔名稱/source/boxes/add_a_quickie.php程式移除後,進入「後台管理」>>「系統設定」>>「版面配置」(圖6-14)

(圖6-14)

前台上方出現了找不到add_a_quickie.php這支程式的錯誤訊息,「版面配置」中出現紅色區塊標示出add_a_quickie.php不存在,此時可以按下add_a_quickie.php(圖6-15)右手邊會出現可以刪除的按鈕:

(圖6-15)

按下刪除鈕後進入刪除確認畫面後即可將add_a_quickie.php在資料庫中的紀錄移除(圖6-16)前台錯誤訊息也將消失:

(圖6-16)

我們再試著將add_a_quickie.php放回原來位置會如何呢?再進入「後台管理」>>「系統設定」>>「版面配置」(圖6-17)

(圖6-17)

程式會自動將add_a_quickie.php紀錄到資料庫中,並出現「WARNING:發現新區塊(更新資料庫完成):add_a_quickie.php」的訊息,預設是開啟排序為0置於左邊,此時只要再針對add_a_quickie.php作排序與位置調整即可。

從以上的說明得知,無論是更換佈景或是增加區塊或是增加中央模組或是移除區塊後都必須執行一次「後台管理」>>「系統設定」>>「版面配置」這支程式,方能算完成安裝。

Twecommerce3.0佈景程式架構

剛剛介紹完操作的部分,接著來拆解程式的部分,在透過程式的拆解中會加入一些可以變更與增加的解說。

在與之前的程式差異主要有:templates/佈景檔名稱/source/boxes.php、templates/佈景檔名稱/source/boxes/*、includes/center_modules.php、新增首頁中央模組程式統一置放於includes/modules/center_modules/*、新增首頁中央模組程式佈景檔統一置放於templates/佈景檔名稱/module/center_modules/*、templates/佈景檔名稱/index.html、templates/佈景檔名稱/module/main_content.html。這部分對於使用之前版本想升級的朋友需特別注意。

在資料庫的部分首先新增了兩個資料表分別為(layout_boxes)、(layout_template):

layout_boxes

layout_id                                                   ID(主鍵、唯一)

layout_template                                        佈景名稱

layout_box_name                           區塊名稱(包括中央區塊)

layout_box_status                          區塊狀態(0為關閉1為開啟)

layout_box_location                       區塊位置(0:左、1:右、2:中左、3:中央、4:中右)

layout_box_sort_order                             區塊排序(數字越小,越優先)

layout_box_status_single               獨立區塊狀態(0為關閉1為開啟)

layout_box_sort_order_single      獨立區塊排序(數字越小,越優先)

這個資料表紀錄了整個版面的配置與排序。

layout_template

layout_template_id                        ID(主鍵、唯一)

layout_template_name                             佈景名稱

layout_template_logo                               LOGO檔名

layout_template_width                            版面總寬

layout_template_left_width                     左區塊寬度

layout_template_right_width        右區塊寬度

layout_template_center_width      中央區塊寬度

layout_template_added                佈景新增日期

這個資料表紀錄各區塊寬度與LOGO,商店與討論區LOGO都是抓取此處資料。

boxes.php

有了這些資料記錄後再來看看程式如何抓取判斷,首先來看看templates/佈景檔名稱/source/boxes.php:

<?php

/* -----------------------------------------------------------------------------------------

   $Id: boxes.php,v 1.2 2008/04/07 23:02:54 oldpa Exp $  

   TWE-Commerce - community made shopping   http://www.oldpa.com.tw

   Copyright (c) 2003 TWE-Commerce

   -----------------------------------------------------------------------------------------

   (c) 2003  xt-commerce  www.xt-commerce.com

   Released under the GNU General Public License

---------------------------------------------------------------------------------------*/版權宣告

  define('DIR_WS_BOXES',DIR_FS_CATALOG .'templates/'.CURRENT_TEMPLATE. '/source/boxes/');//定義DIR_WS_BOXES參數

$smarty = new smarty;//建立smarty物件

$lbox_content=''; //初始化左區塊

$rbox_content=''; //初始化右區塊

$sbox_content=''; //初始化獨立區塊

$sbox = $db->Execute("select layout_box_name from layout_boxes

                        where layout_box_status  = '1'

                     and layout_template ='".CURRENT_TEMPLATE."'

                     and layout_box_status_single ='1'

                       order by layout_box_sort_order_single ASC");//從資料庫取出獨立區塊(layout_box_status_single ='1')開啟的,狀態(layout_box_status  = '1')開啟的(layout_box_name)區塊名稱,並依(layout_box_sort_order_single)為順序

if($sbox->RecordCount()>0){  //如果有抓取到資料

$sbox_content=array();

$rows = 0;

    while (!$sbox->EOF){

 $rows++;

   $width = (int)(100 / $rows) . '%';//這個寬度的變數目前預設佈景沒使用到,這個部分主要是讓程式判斷共有幾筆資料來均分版面寬,如果是5筆,那會成為每一個區塊分到20%的寬度

   include(DIR_WS_BOXES . $sbox->fields['layout_box_name']); //依取出的資料拉進相同檔名的程式執行。  

   $sbox_content[]=array('WIDTH' =>$width,

                          'BOXES' => '{$'.str_replace('.php', '', $sbox->fields['layout_box_name']).'}');//將取出的資料中.php的檔名部分用空白取代,並加入{$}包裹起來成一字串,例如資料庫取出的區塊名稱為「box_news.php」,經過這段程式後字串會變成{$box_news},這就是將丟給index.html顯示的區塊變數字串。  

   $sbox->MoveNext();

  }//迴圈結束

}

//取出左區塊資料

$lbox = $db->Execute("select layout_box_name from layout_boxes

                         where layout_box_status  = '1'

                         and layout_box_location = '0'

                     and layout_template ='".CURRENT_TEMPLATE."'

                     and layout_box_status_single !='1'

                        order by layout_box_sort_order ASC");

if($lbox->RecordCount()>0){ 

$lbox_content=array();

    while (!$lbox->EOF){

   include(DIR_WS_BOXES . $lbox->fields['layout_box_name']);   

   $lbox_content[]=array('BOXES' => '{$'.str_replace('.php', '', $lbox->fields['layout_box_name']).'}');  

   $lbox->MoveNext();

  }

}

//取出右區塊資料

$rbox = $db->Execute("select layout_box_name from layout_boxes

                         where layout_box_status  = '1'

                         and layout_box_location = '1'

                     and layout_template ='".CURRENT_TEMPLATE."'

                     and layout_box_status_single !='1'

                       order by layout_box_sort_order ASC");

if($rbox->RecordCount()>0){ 

$rbox_content=array();

    while (!$rbox->EOF){

   include(DIR_WS_BOXES . $rbox->fields['layout_box_name']);   

   $rbox_content[]=array('BOXES' => '{$'.str_replace('.php', '', $rbox->fields['layout_box_name']).'}');  

   $rbox->MoveNext();

  }

}

$smarty->assign('rbox_box',$rbox_content);//將右區塊變數指派Smarty參數

$smarty->assign('1box_box',$lbox_content);//將左區塊變數指派Smarty參數

$smarty->assign('sbox_box',$sbox_content);//將獨立區塊變數指派Smarty參數

$smarty->assign('tpl_path','templates/'.CURRENT_TEMPLATE.'/');

?>

這支程式執行結果依預設佈景twe會得到下列字串:

rbox_box                                        右區塊

空值

1box_box                                       左區塊

{$add_a_quickie}                快速購買

{$admin}                                        管理員

{$best_sellers}                               暢銷稍品

{$currencies}                       貨幣

{$categorie}                         商品目錄

{$content}                                     服務台

{$information}                               資訊台

{$manufacturers}                廠商]

{$manufacturer_info}                    廠商資訊

{$infobox}                                     會員資訊

{$order_history}                           購物紀錄

{$news_categories}             新聞目錄

{$reviews}                                     評論

{$search}                                       搜尋

{$shopping_cart}                購物車

{$specials}                                     特價商品

{$tell_a_friend}                             推薦給親友

{$whats_new}                               新上架商品

sbox_box                                       獨立區塊

{$box_news}                       新聞跑馬燈

{$languages}                        語系

{$loginbox}                         會員登入

這些資料庫取出的檔名經取代後成為指派給Smarty的區塊變數,但是依舊保留原來檔案名稱,這些檔案都是置放在templates/佈景檔名稱/source/boxes/*,除了.php外一字不差(包括大小寫),再進一步解釋,在之前版本中在templates/佈景檔名稱/index.html程式裡區塊的變數是{$box_INFORMATION} {$box_REVIEWS}{$box_WHATSNEW} {$box_TELL_FRIEND}....等等,而這些變數的指派都是在區塊程式裡例如:templates/佈景檔名稱/source/boxes/whats_new.php

..................

..........略

if (!CacheCheck()) {

  $box_smarty->caching = 0;

  $box_whats_new= $box_smarty->fetch(CURRENT_TEMPLATE.'/boxes/box_whatsnew.html');

  } else {

  $box_smarty->caching = 1; 

  $box_smarty->cache_lifetime=CACHE_LIFETIME;

  $box_smarty->cache_modified_check=CACHE_CHECK;

  $cache_id = $_SESSION['language'].$random_product->fields['products_id'].$_SESSION['customers_status']['customers_status_name'];

  $box_whats_new= $box_smarty->fetch(CURRENT_TEMPLATE.'/boxes/box_whatsnew.html',$cache_id);

  }

    $smarty->assign('box_WHATSNEW',$box_whats_new);

其中box_WHATSNEW是之前版本的指派方式沒有一定規則可以隨心所欲,但在Twecommerce3.0版本中必須是:

$smarty->assign('whats_new',$box_whats_new);

其中whats_new是必須與區塊檔案名稱去掉「.php」後完全相同(大小寫需一致),如此才能與資料庫所取出的資料字串相吻合,所以如果以後自行增加區塊程式時,或是之前版本佈景區塊檔案要移植過來使用,程式最後的smarty指派必須依照此一規則修改程式才會顯現,請特別注意。

center_modules.php

這是另一個與先前版本更動過的檔案,主要是判斷與擷取首頁中央的各個模組,開啟includes/center_modules.php:

<?php

/* -----------------------------------------------------------------------------------------

   $Id: center_modules.php,v 1.3 2008/08/12 09:19:32 oldpa Exp $  

   TWE-Commerce - community made shopping

   http://www.oldpa.com.tw

   Copyright (c) 2003 TWE-Commerce

   -----------------------------------------------------------------------------------------

   based on:

   (c) 2000-2001 The Exchange Project  (earlier name of osCommerce)

   (c) 2002-2003 osCommercebased on original files from OSCommerce CVS 2.2 2002/08/28 02:14:35 www.oscommerce.com

   (c) 2003  nextcommerce (center_modules.php,v 1.5 2003/08/13); www.nextcommerce.org

   (c) 2003  xt-commerce  www.xt-commerce.com

   Released under the GNU General Public License

   ---------------------------------------------------------------------------------------*/版權宣告

define('DIR_WS_CENTER_MODULES', DIR_WS_MODULES .'center_modules/');//定義中央模組資料夾路徑

$module_smarty= new Smarty;//建立Smarty物件

$module_smarty->assign('tpl_path','templates/'.CURRENT_TEMPLATE.'/');

$center_center='';//初始化

$center_right=''; //初始化

$center_left=''; //初始化

$center_left_box = $db->Execute("select layout_box_name from layout_boxes where layout_box_status  = '1'                                        and layout_box_location = '2' and layout_template ='".CURRENT_TEMPLATE."'

                                     and layout_box_status_single !='1'

                                        order by layout_box_sort_order ASC");

//從資料庫中擷取屬於中央左(layout_box_location = '2'),狀態(layout_box_status  = '1')開啟的(layout_box_name)區塊名稱,並依(layout_box_sort_order)為順序

if($center_left_box->RecordCount()>0){   //如果有抓取到資料

$center_left=array();

$rows = 0;   

    while (!$center_left_box->EOF){ //迴圈開始

$rows++;

   $width = (int)(100 / $rows) . '%';

include(DIR_WS_CENTER_MODULES.$center_left_box->fields['layout_box_name']); //依檔名拉進中央模組程式  

   $center_left[]=array('WIDTH' =>$width, 'BOXES' => '{$'.str_replace('.php', '', $center_left_box->fields['layout_box_name']).'}');  

   $center_left_box->MoveNext();

  }

}

//將取出的資料中.php的檔名部份,用空白取代,並加入{$}包裹起來成一字串,例如資料庫取出的區塊名稱為「center_news.php」,經過這段程式後字串會變成{$center_news},這就是將丟給main_content.html顯示的中左區塊變數字串。

$center_right_box = $db->Execute("select layout_box_name from layout_boxes

                                        where layout_box_status  = '1'

                                        and layout_box_location = '4'

                                     and layout_template ='".CURRENT_TEMPLATE."'

                                     and layout_box_status_single !='1'

                                        order by layout_box_sort_order ASC");

//從資料庫中擷取屬於中央右(layout_box_location = '4'),狀態(layout_box_status  = '1')開啟的(layout_box_name)區塊名稱,並依(layout_box_sort_order)為順序

if($center_right_box->RecordCount()>0){  //如果有抓取到資料

$rows = 0;   

$lbox_content=array();

    while (!$center_right_box->EOF){ //迴圈開始

      $rows++;

   $width = (int)(100 / $rows) . '%';   

include(DIR_WS_CENTER_MODULES.$center_right_box->fields['layout_box_name']);  //依檔名拉進中央模組程式 

   $center_right[]=array('WIDTH' =>$width,

                         'BOXES' => '{$'.str_replace('.php', '', $center_right_box->fields['layout_box_name']).'}');  

   $center_right_box->MoveNext();

  }//迴圈結束

}

//將取出的資料中.php的檔名部份,用空白取代,並加入{$}包裹起來成一字串,例如資料庫取出的區塊名稱為「center_news.php」,經過這段程式後字串會變成{$center_news},這就是將丟給main_content.html顯示的中右區塊變數字串。

$center_box = $db->Execute("select layout_box_name from layout_boxes

                                        where layout_box_status  = '1'

                                        and layout_box_location = '3'

                                     and layout_template ='".CURRENT_TEMPLATE."'

                                     and layout_box_status_single !='1'

                                        order by layout_box_sort_order ASC");

//從資料庫中擷取屬於中央右(layout_box_location = '3'),狀態(layout_box_status  = '1')開啟的(layout_box_name)區塊名稱,並依(layout_box_sort_order)為順序

if($center_box->RecordCount()>0){    //如果有抓取到資料

$rbox_content=array();

    while (!$center_box->EOF){ //迴圈開始

include(DIR_WS_CENTER_MODULES $center_box->fields['layout_box_name']);

//依檔名拉進中央模組程式   

   $center_center[]=array('BOXES' => '{$'.str_replace('.php', '', $center_box->fields['layout_box_name']).'}');  

   $center_box->MoveNext();

  }//迴圈結束

}

//將取出的資料中.php的檔名部份,用空白取代,並加入{$}包裹起來成一字串,例如資料庫取出的區塊名稱為「center_news.php」,經過這段程式後字串會變成{$center_news},這就是將丟給main_content.html顯示的中右區塊變數字串。

$default_smarty->assign('center_left',$center_left);//將中左區塊變數指派Smarty參數

$default_smarty->assign('center_center',$center_center); //將中央區塊變數指派Smarty參數 

$default_smarty->assign('center_right',$center_right);  //將中右區塊變數指派Smarty參數

?>

之前版本的includes/center_modules.php只是單純拉進中央模組,並在includes/modules/default.php中,當沒進入任何商品目錄時導進,程式如下:

................略

} else { // default page

     $shop_content_query="SELECT

                     content_title,

                     content_heading,

                     content_text,

                     content_file

                     FROM ".TABLE_CONTENT_MANAGER."

                     WHERE content_group='5'

                     AND languages_id='".$_SESSION['languages_id']."'";

     $shop_content_data=$db->Execute($shop_content_query);

    $default_smarty->assign('title',$shop_content_data->fields['content_heading']);

     include(DIR_WS_INCLUDES . FILENAME_CENTER_MODULES);

//導進中央模組

if ($shop_content_data->fields['content_file']!=''){

       ob_start();

                  if (strpos($shop_content_data->fields['content_file'],'.txt')) echo '<pre>';

                       include(DIR_FS_CATALOG.'media/content/'.$shop_content_data->fields['content_file']);

                  if (strpos($shop_content_data->fields['content_file'],'.txt')) echo '</pre>';

                  $shop_content_data->fields['content_text']=ob_get_contents();

       ob_end_clean();

        }

    $default_smarty->assign('text',str_replace('{$greeting}',twe_customer_greeting(),$shop_content_data->fields['content_text']));

    $default_smarty->assign('language', $_SESSION['language']);

      // set cache ID

  if (USE_CACHE=='false') {

  $default_smarty->caching = 0;

  $main_content= $default_smarty->fetch(CURRENT_TEMPLATE.'/module/main_content.html');

  } else {

  $default_smarty->caching = 1;

  $default_smarty->cache_lifetime=CACHE_LIFETIME;

  $default_smarty->cache_modified_check=CACHE_CHECK;

  $cache_id = $_SESSION['language'].$_SESSION['currency'].$_SESSION['customer_id'];

  $main_content= $default_smarty->fetch(CURRENT_TEMPLATE.'/module/main_content.html',$cache_id);

  }

    $smarty->assign('main_content',$main_content);

  }

  }

?>

在上一段程式碼中還有一段屬於中央首頁內容管理的部份,也已經獨立出來成為單一模組取名為shop_content.php並放置在includes/center_modules/資料夾下,程式部份內容:

---------------------------------------------------------------------------------------*/  略

$shop_content_query="SELECT

                     content_title,

                     content_heading,

                     content_text,

                     content_file

                     FROM ".TABLE_CONTENT_MANAGER."

                     WHERE content_group='5'

                     AND languages_id='".$_SESSION['languages_id']."'";

     $shop_content_data=$db->Execute($shop_content_query);

    $default_smarty->assign('title',$shop_content_data->fields['content_heading']);

if ($shop_content_data->fields['content_file']!=''){

       ob_start();

                  if (strpos($shop_content_data->fields['content_file'],'.txt')) echo '<pre>';

                       include(DIR_FS_CATALOG.'media/content/'.$shop_content_data->fields['content_file']);

                  if (strpos($shop_content_data->fields['content_file'],'.txt')) echo '</pre>';

                  $shop_content_data->fields['content_text']=ob_get_contents();

       ob_end_clean();

        }

    $default_smarty->assign('shop_content',$shop_content_data->fields['content_text']);

?>

在shop_content.php程式最末行:

$default_smarty->assign('shop_content',$shop_content_data->fields['content_text']);

當指派smarty時shop_content仍然是本身檔案名稱去掉.php(大小寫需相同),這是一定必須遵守的規則,否則頁面將無法呈現,請特別注意。

main_content.html

templates/佈景檔名稱/module/main_content.html這支檔案主要是顯示首頁中央區塊的佈景檔,為了讓區塊能依資料庫中擷取的資料來顯示所以必須作修改,開啟templates/佈景檔名稱/module/main_content.html:

{config_load file="$language/lang_$language.conf" section="index"}

{$MODULE_error}//錯誤訊息的變數

{if $center_left || $center_right}//如果中左區塊或中右區塊有值

<table width="100%" border="0" cellpadding="0" cellspacing="0">

  <tr>   

    <td class="main" width="50%" valign="top">

<table  border="0" cellspacing="0" cellpadding="0" width="100%" style="padding-right:5px">

  <tr>{php} $col=0;  {/php}

  {if $center_left}{foreach name=aussen item=box_data from=$center_left}

  {php} $col++; {/php}

<td class="boxText" >{eval var=$box_data.BOXES}</td>

{php}

  if ($col>=1) {//當值大於等於1$col變數歸零,也就是當出現第一個商品後會折下一行顯示。

  $col=0;

  echo '</tr><tr>';

  }

  {/php}

  {/foreach}

  </tr>

</table>

</td>{/if}

{if $center_right}//如果中右區塊有值  

    <td class="main" width="50%" valign="top">

<table  border="0" cellspacing="0" cellpadding="0" width="100%">

  <tr>{php} $col=0;  {/php}

  {foreach name=aussen item=box_data from=$center_right}

  {php} $col++; {/php}

<td class="boxText" >{eval var=$box_data.BOXES}</td>       

 {php}

  if ($col>=1) {//當值大於等於1$col變數歸零,也就是當出現第一個商品後會折下一行顯示。

  $col=0;

  echo '</tr><tr>';

  }

  {/php}

  {/foreach} </tr>

</table>

</td>{/if}

  </tr>

  </table>

  {/if}

{if $center_center}//如果中央區塊有值

{foreach name=aussen item=box_data from=$center_center}

<p>{eval var=$box_data.BOXES}</p>

{/foreach}

{/if}

程式中中左與中右程式裡有if ($col>=1)的判斷式,主要是因為當有第二個中左區塊或中右區塊甚至三個以上時,必須要讓區塊能一個往下接著一個來顯示,要不然第二個中左會變成第一個中右,依目前一般螢幕顯示網頁,左右區塊加上中左或中右的寬度很難讓面一個以上的中左或中右同時顯示而不撐開,當然也有例外,如果打算網站只使用中央部份左右兩邊區塊捨棄不用,那或許可以讓兩個中左或兩個中右呈現,所以只需要更改if ($col>=1)其中1的數值為想呈現區塊的數量即可,例如if ($col>=2),如此便會出現兩個中左後再折一行出現第三個中左,中右也是相同道理。

在資料庫中其實也有可以運用的現成參數,可以讓這理由後台控制,進入商店後台「系統設定」>>「首頁商品列表設定」(圖6-18):

(圖6-18)

其中的 :

每一列可列多少個特價商品

每一列可列多少個暢銷商品

每一列可列多少個推薦商品

這三個值分別為:

MAX_DISPLAY_INDEX_SPECIAL_PRODUCTS_PER_ROW

MAX_DISPLAY_INDEX_BESTSELLERS_PER_ROW

MAX_DISPLAY_INDEX_FEATURED_PER_ROW

這三個參數都可套入其中,例如:

($col>= MAX_DISPLAY_INDEX_SPECIAL_PRODUCTS_PER_ROW) 特價商品的參數

($col>= MAX_DISPLAY_INDEX_BESTSELLERS_PER_ROW) 暢銷商品的參數

($col>= MAX_DISPLAY_INDEX_FEATURED_PER_ROW) 推薦商品的參數

如此就能在後台控制區塊轉折,當然還是必須確定不會影響該沿用此參數模組區塊的表現。

header.php

在後台可以上傳LOGO與欄寬所寫進的資料必須處理(圖6-19),後台「系統設定」>>「區塊配置」

由於這些參數所有頁面都必須使用,所以選擇在includes/header.php裡面來處理,

(圖6-19)

$layout_logo = $db->Execute("select * from layout_template where layout_template_name = '" . CURRENT_TEMPLATE . "'");//從layout_template資料表中取出目前使用佈景(CURRENT_TEMPLATE)的所有資料

$logo = '';初始

 if(!$layout_logo->RecordCount()){//如果沒有資料

$logo = 'logo.jpg';//使用此檔名圖片

$smarty->assign('logo_width', '883');// logo.jpg圖寬

$smarty->assign('logo_height', '242');// logo.jpg圖高

}else{//否則

$logo = $layout_logo->fields['layout_template_logo'];//使用此檔名圖片

$img=DIR_FS_CATALOG.DIR_WS_IMAGES.$layout_logo->fields['layout_template_logo'];//LOGO圖片的絕對路徑

if(file_exists($img)) $size = GetImageSize("$img");//如果圖片確實存在,計算出圖片寬與高的值。

$smarty->assign('logo', $logo); //指派LOGO smarty,以下皆是指派各欄寬的smarty。

$smarty->assign('logo_width', $size[0]);// 指派LOGO smarty圖寬

$smarty->assign('logo_height', $size[1]);// 指派LOGO smarty圖高

$smarty->assign('width', $layout_logo->fields['layout_template_width']);

$smarty->assign('left_width', $layout_logo->fields['layout_template_left_width']);

$smarty->assign('right_width', $layout_logo->fields['layout_template_right_width']);

$smarty->assign('center_width', $layout_logo->fields['layout_template_center_width']);

}   

這段程式主要目的是,無論在任何時候都有一張LOGO圖片頂著,所以logo.jpg這張LOGO圖希望能一直存在於images資料夾裡才不會開天窗。

index.html

當以上的各區塊程式與佈景檔處理完之後接著就是丟到templates/佈景檔名稱/index.himl來做最後網頁的顯示,index.html這支程式是影響整個網站外觀最重大的程式:

{config_load file="$language/lang_$language.conf" section="index"} //拉進語言檔index區域文字定義

<table width="{$width}" align="center" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td valign="top">   

<table width="100%" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="20" bgcolor="#000000">&nbsp;</td>

    <td width="20" bgcolor="#FFFFFF">&nbsp;</td>

    <td>

{if $sbox_box}  //獨立區塊開始,如果獨立區塊有值

<table  border="0" cellspacing="0" cellpadding="0">{php} $col=''; {/php}

  <tr>{foreach name=aussen item=box_data from=$sbox_box}{php} $col++; {/php}

<td class="boxText" valign="top"><table  border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="100%">{eval var=$box_data.BOXES}</td>//執行獨立區塊字串

  </tr>

</table></td>

{php}

  if ($col>=3) {//顯示三個區塊後轉折下一行顯示。

  $col=0;

  echo '</tr><tr>';

  }

  {/php}

{/foreach}   

  </tr>

</table>

{/if}//獨立區塊結束

<table width="100%" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="100%"><a href="{$default}"><img src="images/{$logo}" width="{$logo_width}" height="{$logo_height}" border="0"></a></td>//LOGO所在位置

  </tr>

</table>

<table width="100%"  border="0" cellpadding="0" cellspacing="0" bgcolor="#000000">

      <tr>

//導覽列開始<td class="headerNavigation">{$navtrail}</td>//導覽列結束

//功能連結開始<td class="link"><div align="right">{if $account}{php} if (isset($_SESSION['customer_id'])) { {/php}<a href="{$logoff}">{#link_logoff#}</a> | {php} } {/php}{/if}{if $account}<a href="{$account}">{#link_account#}</a> | {/if}<a href="{$cart}">{#link_cart#}</a> |{if OPEN_FORUM=='true'} <a href="{$forum}">{#link_forum#}</a> | {/if} <a href="{$checkout}">{#link_checkout#}</a> </div></td>//功能連結結束

      </tr>

    </table>

      <table  width="100%"  border="0" cellpadding="0" cellspacing="0">

        <tr>{if $1box_box}//左區塊開始,如果左區塊有值

          <td valign="top" >

<table width="{$left_width}" border="0" cellpadding="0" cellspacing="0">

        <tr>

          <td valign="top">  

{foreach name=aussen item=box_data from=$1box_box}

<p>{eval var=$box_data.BOXES}</p>//執行左區塊字串

{/foreach}

          </td>

     </tr>

</table>

</td>{/if}//左區塊結束

          <td width="{$center_width}" valign="top">

<table width="{$center_width}" style="padding-left:8px;" border="0" cellpadding="0" cellspacing="0">

        <tr>

          <td class="main"><p>{$greeting}</p>{$main_content}</td>//中央區塊,與首頁問候語

        </tr>

     </table>

     </td>{if $rbox_box}//右區塊開始,如果右區塊有值

          <td valign="top">    

<table width="{$right_width}" style="padding-left:8px" border="0" cellpadding="0" cellspacing="0">

  <tr>

    <td valign="top">

{foreach name=aussen item=box_data from=$rbox_box}

<p>{eval var=$box_data.BOXES}</p>//執行右區塊字串

{/foreach}    </td>

  </tr>

  </table>

  </td>{/if}  //右區塊結束

        </tr>

      </table>

</td>

     <td width="20" bgcolor="#FFFFFF">&nbsp;</td>

    <td width="20" bgcolor="#000000">&nbsp;</td>

</tr>

</table>

<table width="100%"  border="0" cellpadding="2" cellspacing="0" bgcolor="#000000">

        <tr>

          <td class="poweredby"><div align="center">{#text_footer#}<br> {$BANNER} </div></td>//版權宣告與廣告

         </tr>

      </table>

  </td>

         </tr>

      </table>

</body>

</html>

在程式編輯器中看到的樣子如下(圖6-20):

(圖6-20)

獨立區塊

為何要設獨立區塊呢?原因是除了左跟右以外可以多一個選擇放置區塊的地方,當然獨立區塊不限制一定是細長型的,更改區塊的佈景檔就會影響區塊高度,所以針對放置在獨立區塊的程式作佈景修改就變成必須的,舉例templates/佈景檔名稱/boxes/box_content.html(服務台)區塊來說一般左右區塊佈景檔都有放置區塊說明的頭(Header)折下一行後才是內容如(圖6-21):

(圖6-21)

如此便會有一個高度產生,並隨著內容增加而越來越高,如果打算將區塊模組設成獨立區塊需考量內容所造成區塊高度的影響,或是將向下延伸的內容改成左右延伸,所以盡可能考慮將不會增加內容的區塊放置在獨立區塊中,例如搜尋、快速購買、語系、貨幣、會員登入..等等。下列是語系區塊templates/佈景檔名稱/boxes/ box_languages.html(圖6-22)

(圖6-22)

上圖中(圖6-22){config_load file="$language/lang_$language.conf" section="boxes"}這段拉進語言boxes區段的程式,因為沒有區塊頭的標示,所以是可以省略的。

其他應用

當程式利用資料庫控管區塊時,好處是對於不懂程式的朋友可以簡單的作版面的配置,但相對於懂程式或是美工的朋友或許就會造成困擾,這也就是oldpa長期研究open source的困擾,常常會有顧此失彼的情況產生,不管如何還是盡可能將一些狀況解釋清楚。

如果今天的區塊配置不符期待或不符使用時如何?除了獨立區塊以外還需要有其他獨立於預設的區塊時該怎麼作呢?這時就會建議將該區塊以傳統的方式來放置,接著就來談談這個步驟。

假設因為LOGO很大佔了很多右邊的位置,而想要將最新消息移到LOGO右旁邊來顯示(圖6-23):

(圖6-23)

l        步驟一

首先進入後台「系統設定」>>「區塊配置」(圖6-24):

(圖6-24)

找出box_news.php將「主要狀態」綠燈狀態更改成紅燈(將其關閉不使用),可以看到最上方新聞跑馬燈區塊已經消失。

l        步驟二
開啟templates/佈景檔名稱/source/boxes.php

---------------------------------------------------------------------------------------*/略

if($rbox->RecordCount()>0){ 

$rbox_content=array();

    while (!$rbox->EOF){

   include(DIR_WS_BOXES . $rbox->fields['layout_box_name']);   

   $rbox_content[]=array('BOXES' => '{$'.str_replace('.php', '', $rbox->fields['layout_box_name']).'}');  

   $rbox->MoveNext();

  }

}

require(DIR_WS_BOXES . 'box_news.php'); //加入此行,這是之前版本拉進區塊程式執行的敘述。

$smarty->assign('rbox_box',$rbox_content); 

$smarty->assign('1box_box',$lbox_content); 

$smarty->assign('sbox_box',$sbox_content); 

$smarty->assign('tpl_path','templates/'.CURRENT_TEMPLATE.'/');   

---------------------------------------------------------------------------------------*/略

如果有其他想宣告獨立的區塊可以依序增加(後台「版面配置)要記得關閉),新聞跑馬燈smarty指派的參數為檔名box_news.php去掉.php,所以必須將{$box_news}丟到templates/佈景檔名稱/index.html去顯示。

l        步驟三

開啟templates/佈景檔名稱/index.html找出:

---------------------------------------------------------------------------------------*/略

<table width="100%" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="100%"><a href="{$default}"><img src="images/{$logo}" width="{$logo_width}" height="{$logo_height}" border="0"></a></td>

  </tr>

</table>---------------------------------------------------------------------------------------*/略

這段程式是LOGO的所在位置,預設twe佈景的LOGO是整張以圖片方式顯示並加入回到首頁連結,如果要再加入新聞跑馬燈區塊,必須將LOGO圖片以背景的方式呈現,程式更改如下:

  <table width="100%" border="0" cellspacing="0" cellpadding="0">

  <tr>

    <td width="{$logo_width}" height="{$logo_height}" background="images/{$logo}" border="0" align="right">{$box_news}</td>

  </tr>

</table>

加入了{$box_news}於LOGO背景圖上並置右對齊(圖6-25)結果如下:

(圖6-25)

為何要關閉後台「系統設定」>>「區塊配置」>>box_news.php?因為這樣才不會重複拉進區塊,除非想讓同一區塊出現在不同位置時可以不用關閉,只需將該區塊變數獨立放在欲顯示的區段中,就能同時顯示。

中央區塊其他運用

如果中央區塊也不符合使用,方法與boxes相類似,接下來講解做法,開啟includes/center_modules.php:

<?php

/* -----------------------------------------------------------------------------------------

   $Id: center_modules.php,v 1.3 2004/08/12 09:19:32 oldpa Exp $  

   TWE-Commerce - community made shopping

   http://www.oldpa.com.tw

   Copyright (c) 2003 TWE-Commerce

   -----------------------------------------------------------------------------------------

   based on:

   (c) 2000-2001 The Exchange Project  (earlier name of osCommerce)

   (c) 2002-2003 osCommercebased on original files from OSCommerce CVS 2.2 2002/08/28 02:14:35 www.oscommerce.com

   (c) 2003  nextcommerce (center_modules.php,v 1.5 2003/08/13); www.nextcommerce.org

   (c) 2003  xt-commerce  www.xt-commerce.com

   Released under the GNU General Public License

   ---------------------------------------------------------------------------------------*/define('DIR_WS_CENTER_MODULES', DIR_WS_MODULES .'center_modules/');

$module_smarty= new Smarty;

$module_smarty->assign('tpl_path','templates/'.CURRENT_TEMPLATE.'/');

$center_center='';

$center_right='';

$center_left='';

$center_left_box = $db->Execute("select layout_box_name from layout_boxes

                                        where layout_box_status  = '1'

                                        and layout_box_location = '2'

                                     and layout_template ='".CURRENT_TEMPLATE."'

                                     and layout_box_status_single !='1'

                                        order by layout_box_sort_order ASC");

if($center_left_box->RecordCount()>0){  

$center_left=array();

$rows = 0;   

    while (!$center_left_box->EOF){

$rows++;

   $width = (int)(100 / $rows) . '%';   

   include(DIR_WS_CENTER_MODULES . $center_left_box->fields['layout_box_name']);   

   $center_left[]=array('WIDTH' =>$width, 'BOXES' => '{$'.str_replace('.php', '', $center_left_box->fields['layout_box_name']).'}');  

   $center_left_box->MoveNext();

  }

}

$center_right_box = $db->Execute("select layout_box_name from layout_boxes

                                        where layout_box_status  = '1'

                                        and layout_box_location = '4'

                                     and layout_template ='".CURRENT_TEMPLATE."'

                                     and layout_box_status_single !='1'

                                        order by layout_box_sort_order ASC");

if($center_right_box->RecordCount()>0){ 

$rows = 0;   

$lbox_content=array();

    while (!$center_right_box->EOF){

      $rows++;

   $width = (int)(100 / $rows) . '%';

   include(DIR_WS_CENTER_MODULES . $center_right_box->fields['layout_box_name']);   

   $center_right[]=array('WIDTH' =>$width,

                         'BOXES' => '{$'.str_replace('.php', '', $center_right_box->fields['layout_box_name']).'}');  

   $center_right_box->MoveNext();

  }

}

$center_box = $db->Execute("select layout_box_name from layout_boxes

                                        where layout_box_status  = '1'

                                        and layout_box_location = '3'

                                     and layout_template ='".CURRENT_TEMPLATE."'

                                     and layout_box_status_single !='1'

                                        order by layout_box_sort_order ASC");

if($center_box->RecordCount()>0){   

$rbox_content=array();

    while (!$center_box->EOF){

   include(DIR_WS_CENTER_MODULES . $center_box->fields['layout_box_name']);   

   $center_center[]=array('BOXES' => '{$'.str_replace('.php', '', $center_box->fields['layout_box_name']).'}');  

   $center_box->MoveNext();

  }

}

$default_smarty->assign('center_left',$center_left); 

$default_smarty->assign('center_center',$center_center); 

$default_smarty->assign('center_right',$center_right); 

?>

將程式取代成:

<?php

/* -----------------------------------------------------------------------------------------

   $Id: center_modules.php,v 1.3 2004/08/12 09:19:32 oldpa Exp $  

   TWE-Commerce - community made shopping

   http://www.oldpa.com.tw

   Copyright (c) 2003 TWE-Commerce

   -----------------------------------------------------------------------------------------

   based on:

   (c) 2000-2001 The Exchange Project  (earlier name of osCommerce)

   (c) 2002-2003 osCommercebased on original files from OSCommerce CVS 2.2 2002/08/28 02:14:35 www.oscommerce.com

   (c) 2003  nextcommerce (center_modules.php,v 1.5 2003/08/13); www.nextcommerce.org

   (c) 2003  xt-commerce  www.xt-commerce.com

   Released under the GNU General Public License

   ---------------------------------------------------------------------------------------*/

define('DIR_WS_CENTER_MODULES', DIR_WS_MODULES .'center_modules/');

include(DIR_WS_CENTER_MODULES . 'center_news.php');

include(DIR_WS_CENTER_MODULES . 'new_products.php');

include(DIR_WS_CENTER_MODULES . 'products_best.php');

include(DIR_WS_CENTER_MODULES . 'products_featured.php');

include(DIR_WS_CENTER_MODULES . 'shop_content.php');

include(DIR_WS_CENTER_MODULES . 'specials_center.php');

include(DIR_WS_CENTER_MODULES . 'specials_center.php');

?>

而佈景檔templates/佈景檔名稱/module/main_content.html裡只需用{$center_news }{$ new_products.php }{$ products_best.php }{$ products_featured.php }{$ shop_content.php }{$ specials_center.php }{$ specials_center.php }將這些區塊變數用HTML碼依自己想呈現的順序編排即可,那也可以參考先前版本的templates/佈景檔名稱/module/main_content.html將其中區塊變數置換掉,Twecommerce3.02版增加了插入自定區塊功能。

綜合以上的做法後,欲宣告獨立的區塊已經依需求放置到該位置,也就是說如果覺得目前資料庫管理的方式不滿意或不符所需,仍然可以使用之前版本的方式來製作,只差別在變數寫法不同。

看過一些朋友的網站配置變動非常大,大到完全看不出有Twecommerce的影子,當有這樣打算的時候,建議可以恢復舊的方式會比較容易發揮。

最後的結論各位應該可以看出Twecommerce3.0更動佈景的核心主要還是站在不懂程式的朋友立場上,希望能造福一般不懂程式的USER,讓介面操作更友善。

程式像這樣子的變動oldpa到最後一定是毀譽參半,工程師套版的CASE少了、美工工作也少了、後續調整的服務也少了,但是預設佈景格式用的人多了、千篇一律的網站多了,但是至少希望是使用Twecommerce者更多,這才能達到一個平衡。