Vertiefungswissen anzeigenVertiefungswissen verbergenUser Interface Plugins
Note as of ILIAS 6 using UI Components by just ovewritting templates as shown bellow should be avoided if possible. Checkout Global Screen Extension to checkout if there better alternatives. If you still require the methods bellow, note that some templates have been removed/moved to new location. Mainly the following components have been introduced along with new templates:
- Standard Layout, template file: src/UI/templates/default/Layout/tpl.standardpage.html, the frame of the DOM for the complete ILIAS page. Also checkout the according less variable under section Layout (UI Layout Page).
- Meta Bar template file: src/UI/templates/default/MainControls/tpl.metabar.html, the Bar on the top holding Notification, Search User Avatar, etc. Also checkout the according metabar less variables.
- Main Bar template directory: src/UI/templates/default/MainControls/tpl.mainbar.html, the Bar on the left holding triggers for opening the slates for accessing Repository, Dasbhoard etc. Content. Also checkout the according mainbar less variables.
- Footer src/UI/templates/default/MainControls/tpl.footer.html, Footer at the bottom of the page.
This plugin slot has been published as stable with ILIAS 4.2. The goal of the user interface plugin slot is to allow simple modifications of standard components of the ILIAS user interface.
Please make sure that you have read the general plugin implementation documentation.
This slot is defined by the UIComponent Service of ILIAS and named "UserInterfaceHook". This means all plugins have to be installed into directories at:
Customizing/global/plugins/Services/UIComponent/UserInterfaceHook/<Plugin_Name>
The ID of the UIComponent Service is "ui", the ID of the slot is "uihk". These are used as prefixes together with your plugin id for database tables and for language variable identifiers:
DB Table / Language VariablePrefixes: ui_uihk_<Plugin_ID>_
Plugin Directory Structure
A user interface plugin has the following minimum file/directory structure. If needed templates/sql/lang directories and files may be used (see general plugin documentation).
<PluginName> (Directory) classes (Directory) class.il<PluginName>Plugin.php class.il<PluginName>UIHookGUI.php plugin.php |
Plugin Files
At the end of this page you will find an example implementation. We walk through the files of this implementation. The name of the plugin is "UIExample", so its location will be at:
Customizing/global/plugins/Services/UIComponent/UserInterfaceHook/UIExample
plugin.php
All plugins must include a plugin.php file.
<?php // alphanumerical ID of the plugin; never change this $id = "uiexample"; // code version; must be changed for all code changes $version = "0.0.1"; // ilias min and max version; must always reflect the versions that should // run with the plugin $ilias_min_version = "4.2.0"; $ilias_max_version = "4.2.999"; // optional, but useful: Add one or more responsible persons and a contact email $responsible = "Alexander Killing"; $responsible_mail = "alex.killing@gmx.de"; ?> |
classes/class.il<PluginName>Plugin.php
<?php include_once("./Services/UIComponent/classes/class.ilUserInterfaceHookPlugin.php"); /** * Example user interface plugin * * @author Alex Killing <alex.killing@gmx.de> * @version $Id$ * */ class ilUIExamplePlugin extends ilUserInterfaceHookPlugin { function getPluginName() { return "UIExample"; } } ?> |
The implementation of the plugin class is quite easy. It must be derived from ilUserInterfaceHookPlugin
. Most likely you will only have to replace the two occurrences of "UIExample" by your plugin name in the code above.
classes/class.il<PluginName>UIHookGUI.php
This class must be derived from ilUIHookPluginGUI
. You may overwrite two methods that allow to modify the user interface:
- getHTML: Allows to prepend/append/replace the HTML of the output of various UI components.
- modifyGUI: Allows to modify user interface objects before they generate their output.
The example implementation lists all components that can be modified:
- Main Menu Entries
- Locator
- Personal Desktop Overview Scren (left, right, center column)
- Tabs
<?php /* Copyright (c) 1998-2010 ILIAS open source, Extended GPL, see docs/LICENSE */ include_once("./Services/UIComponent/classes/class.ilUIHookPluginGUI.php"); /** * User interface hook class * * @author Alex Killing <alex.killing@gmx.de> * @version $Id$ * @ingroup ServicesUIComponent */ class ilUIExampleUIHookGUI extends ilUIHookPluginGUI { /** * Modify HTML output of GUI elements. Modifications modes are: * - ilUIHookPluginGUI::KEEP (No modification) * - ilUIHookPluginGUI::REPLACE (Replace default HTML with your HTML) * - ilUIHookPluginGUI::APPEND (Append your HTML to the default HTML) * - ilUIHookPluginGUI::PREPEND (Prepend your HTML to the default HTML) * * @param string $a_comp component * @param string $a_part string that identifies the part of the UI that is handled * @param string $a_par array of parameters (depend on $a_comp and $a_part) * * @return array array with entries "mode" => modification mode, "html" => your html */ function getHTML($a_comp, $a_part, $a_par = array()) { // do not show the search part of the main menu // $a_par["main_menu_gui"] if ($a_comp == "Services/MainMenu" && $a_part == "main_menu_search") { // $a_par["main_menu_gui"] is ilMainMenu object // $a_par["main_menu_search_gui"] is ilMainMenuSearchGUI object return array("mode" => ilUIHookPluginGUI::REPLACE, "html" => ""); } // add something to the main menu entries if ($a_comp == "Services/MainMenu" && $a_part == "main_menu_list_entries") { // $a_par["main_menu_gui"] is ilMainMenu object return array("mode" => ilUIHookPluginGUI::APPEND, "html" => " <a class='MMInactive' href='http://www.ilias.de' target='_blank'>ILIAS Home Page</a>"); } // add something to locator if ($a_comp == "Services/Locator" && $a_part == "main_locator") { // $a_par["locator_gui"] is ilLocatorGUI object return array("mode" => ilUIHookPluginGUI::APPEND, "html" => " » My Locator"); } // add things to the personal desktop overview if ($a_comp == "Services/PersonalDesktop" && $a_part == "left_column") { // $a_par["personal_desktop_gui"] is ilPersonalDesktopGUI object return array("mode" => ilUIHookPluginGUI::PREPEND, "html" => "Prepend to left"); } // add things to the personal desktop overview if ($a_comp == "Services/PersonalDesktop" && $a_part == "right_column") { // $a_par["personal_desktop_gui"] is ilPersonalDesktopGUI object return array("mode" => ilUIHookPluginGUI::APPEND, "html" => "Append to right"); } // add things to the personal desktop overview if ($a_comp == "Services/PersonalDesktop" && $a_part == "center_column") { // $a_par["personal_desktop_gui"] is ilPersonalDesktopGUI object return array("mode" => ilUIHookPluginGUI::PREPEND, "html" => "Prepend to center"); } return array("mode" => ilUIHookPluginGUI::KEEP, "html" => ""); } /** * Modify GUI objects, before they generate ouput * * @param string $a_comp component * @param string $a_part string that identifies the part of the UI that is handled * @param string $a_par array of parameters (depend on $a_comp and $a_part) */ function modifyGUI($a_comp, $a_part, $a_par = array()) { // currently only implemented for $ilTabsGUI // tabs hook // note that you currently do not get information in $a_comp // here. So you need to use general GET/POST information // like $_GET["baseClass"], $ilCtrl->getCmdClass/getCmd // to determine the context. if ($a_part == "tabs") { // $a_par["tabs"] is ilTabsGUI object // add a tab (always) $a_par["tabs"]->addTab("test", "test", "test"); } } } ?> |
Download Full Example
Last Modified: 21 Jun 2011
Please report any bugs to our bug tracker.