HOME 回計算中心首頁 Login
2009年第4期
簡訊
完成「本院98年度微軟教育版軟體大量授權」續約採購案
大量資料儲存系統擴充採購案完成點收
續訂Global BIP等3資料庫
歡迎參加「Cisco BCMSN」課程
「網路影音服務」新增2場活動內容
中心動態
中心紀事(97年7-12月)
資訊技術
Joomla系統的快速擴充套件Jumi
 
資訊技術 >
上一篇 | 返回電子報
 
Joomla系統的快速擴充套件Jumi
 
張錦堂

前言

 Joomla是近年來熱門的開放原始碼網站內容管理系統之一,簡潔的使用介面及小巧便利的系統架構是吸引眾多使用者的重要因素。除了系統內定的功能外,還可以使用元件、模組及插件等擴充套件增加系統功能,這些擴充套件可以由Joomla網站上的擴充套件清單中搜尋取用。

 假如這些現成的套件,還不足以符合您的需求的話,可以依照Joomla擴充套件開發架構,撰寫所需的功能。雖然開發的架構很容易學習及使用,但是經常只是需要製作一個因為Joomla系統的限制,而無法達到的簡單功能,例如在某個網頁中自訂CSS樣式、加入Javascript碼,或是執行一小段程式碼,這些都會被系統所濾除而無法達到。

 Jumi擴充套件提供在Joomla網頁中,以簡便的方式加入您自訂的CSS、HTML、PHP及Javascript碼。這些自訂碼可以是由檔案、資料庫中的一筆資料或是直接在後端管理介面中寫入等方式提供。配合Joomla系統的顯示方式,可以使用Jumi模組(module)顯示在模組位置上,或是使用Jumi插件(plugin)顯示在Joomla文章內,或是在Joomla環境下使用Jumi 元件(component)撰寫自訂的應用程式網頁。

Jumi擴充套件安裝程序

1.尚未安裝Joomla系統的使用者,請由Joomla官方網站(http://www.joomla.org/)下載並依據說明安裝。

2.請到http://jumi.vedeme.cz/ 網站下載供Joomla 1.5使用的Jumi安裝檔,例如jumi_pack_2.0.1_for_J1.5.zip

3.登入您的Joomla網站後端後,選擇Extensions/Install/Uninstall功能進行安裝,如【圖1】。


圖1 選擇Joomla套件安裝功能

4.在「Package File:」欄位,選擇下載的zip檔,按「Upload File & Install」項目,進行安裝,如【圖2】。


圖2 安裝Joomla套件

5.安裝好了之後,就可以在元件(Components)選單中看到Jumi應用程式了。另外在Extensions選單中的Module Manager及Plugin Manager中,可以看到jumi的module及plugin,只要勾選「Enabled」就可以使用了。

Jumi模組(Module)的設定及使用方法

 在網頁中主要內容之外的區塊,可以使用模組(Module)來進行各別的控制。例如網頁右側的一個區塊顯示最新消息,另一個區塊顯示活動圖片。

 Jumi模組的使用方法如下:

1.選擇或新增一個jumi模組後,輸入「Title」欄的內容、勾選「Enabled」欄為Yes,及選擇「Position」欄的顯示位置。

2.在右側的「Module Parameters」大類中,「Notepad」欄可以寫供自己參考的備忘或說明。「Code written」欄是用來撰寫您的自訂碼的,可以寫HTML及PHP碼,其中也可包含CSS及Javascript碼。「Source of code」欄是用來指定已經撰寫好的PHP程式檔檔名。在「Advanced Parameters」大類中,「Default Absolute Jumi Path」需填寫自行撰寫的程式檔放置的系統路徑,如【圖3】。


圖3 Jumi模組參數設定

 例如在「Code written」欄中寫入下列程式碼,就可以在網頁中區塊的位置內顯示「Hello World」字串。

 <?php
  echo “Hello World”;
 ?>

 
Jumi元件(Component)的設定及使用方法

 在Joomla中可以使用元件(Component)撰寫應用程式,在網頁中主要內容區顯示資料。Jumi元件提供網站建構者快速的撰寫元件。應用的例子,譬如讀取員工資料庫,在網頁中顯示員工名錄列表。

 在Joomla後端系統選擇Components/Jumi元件,進入Jumi應用程式管理畫面,如【圖4】。


圖4 選擇Jumi元件

 管理畫面中列出已建立的Jumi應用程式,透過這個介面可以撰寫自訂碼,儲存於資料庫中,或是指定儲存於系統的程式檔。

 點選「New」新增一個Jumi應用程式,在「Title」欄輸入程式標題,以便管理時用。在「Alias」輸入這個Jumi程式的別名。在「Custom Script:」欄輸入自訂碼,可以是HTML、Javascript以及PHP碼。假如有預存在系統的程式檔,可以在「Pathname:」欄中,填入檔名。假如有參數要傳入這個程式,可以在「Custom Script:」欄中,使用$jumi[]定義各個參數的值,如【圖5】。


圖5 定義Jumi應用程式各參數值

 Jumi系統中有2個內建的應用程式例子:「Hello Jumi!」及「Blogspot」,可以在前端使用http://localhost/index.php?option=com_jumi&fileid=1的方式執行第1個例子。其中option參數com_jumi是指定使用jumi元件,fileid是指定jumi應用程式的ID碼,這個值可以在管理畫面的應用程式列表中的ID欄查到,如【圖6】。

 
圖6 Jumi應用程式的ID值

 點選「Hello Jumi!」的例子,就可以看到其中的程式碼,因為是在Joomla的環境下執行,所以除了PHP的函數之外,Joomla系統的函數也可以使用。另一個例子「Blogspot」是執行在系統中的預存程式components/com_jumi/files/blogger.php,藉由Google Blog API讀取在http://www.blogger.com網站所建立的部落格內容。只要修改在「Custom Script:」欄程式碼中的$blogId變數值,就可以將指定的部落格內容顯示在Joomla系統所建的網站中。

Jumi插件(Plugin)的設定及使用方法

 在Joomla系統的文章網頁內容中,可利用Jumi插件取用自訂的程式碼顯示資料。這些自訂程式碼可以是預存在系統的程式檔,或是經由Jumi後端管理而儲存在資料庫中的程式碼。使用的例子,譬如在內容中顯示共用的資料碼。

 使用前的設定方法為,在Joomla後端系統選擇Extensions / Plugin Manager,尋找到Jumi插件後,點選「Enabled」啟動該功能,如【圖7】。

 
圖7 啟動Jumi插件功能

 在Jumi插件的參數設定畫面中,「Default Absolute Jumi Path」請設定為預存程式檔的系統目錄,例如:/var/www/html/joomla/jumi。「Hide Jumi code」,設為「No」則會正常解譯Jumi碼;設為「Yes」,則不會執行Jumi插入碼,且插入碼會被隱藏,不會顯示在前端的網頁中,如【圖8】。

 
圖8 Jumi插件的參數設定畫面

 在運用時,只要在文章內容中使用下列Jumi插件的語法,就會被Jumi解譯執行,並將程式的輸出,併入網頁內容中:

{jumi   [程式檔名]   [參數1]   [參數2] …}

 例如:{jumi  [codes/hello.php]},為執行在codes目錄中的hello.php程式檔。例如:{jumi  [*1]},為執行預存於資料庫Jumi元件資料表中ID為1的的程式碼。例如:{jumi area calc [test.php] width[4] height[6]},為執行test.php檔,並傳入4及6為參數,其中的area、calc、width及height僅為使用者註解用。

小結

 以上簡單的介紹Jumi套件的安裝及基本使用方法,只要在其中搭配PHP語法、資料庫、Javascript、CSS及HTML碼,就可以快速的在Joomla中進行各種運用了!

參考資料

1. Jumi套件主網站 http://jumi.vedeme.cz/

2. Jumi Snippets http://edo.webmaster.am/jumi

3. Concise guide to Jumi
http://jumi.vedeme.cz/index.php?option=com_content&view=article&id=39&Itemid=37




上一篇 | 返回電子報
 
 本電子報所有文字、圖片版權為中央研究院所有 。 電子報出版系統由中央研究院計算中心開發。