History of function_biticon

Version 13

function_biticon

Created by: hiran, Last modification: 16 Jan 2007 (12:40 UTC) by hiran
biticon is availible to smarty templates to support two things:
  • Icon themes - biticon allows icons to be overidden in the same way that smarty allows templates to be over ridden. This allows a site to mix and match themes with icon sets for a more customized look with less work.
  • Better support of WAI accessibility for the handicapped - biticon automatically generates any additional HTML needed to enable accessibility devices to function.

biticon is used in your templates to replace the hard coded image tags that are used for icons through out Tiki, very similar to an image tag in usage.

The image file used for the icon is selected by searching a defined set of folders including the current icon theme from the admin-general panel, the current site theme, and a default set of core Tiki icons. Each icon is treated seperately, so icon themes or site themes can overide only the individual icons they want to change. Tikicon will automatically fall back to the defaults if there is no override.

Search Path


This is the search path used by biticon. The 1st match found is used.

    1. <bit_theme_path>/styles/<icon style="">/icons/<ipackage>/<ipath>/<iname>.*
    2. <bit_theme_path>/styles/<site style="">/icons/<ipackage>/<ipath>/<iname>
    3. <bit_root_path>/<ipackage>/icons/<ipath>/<iname>.*
    4. <bit_theme_path>/styles/default/icons/<ipackage>/<ipath>/<iname>.*

If the file is not found in any of these locations an image tage with a src of broken.<ipackage>/<iname> will be output.

Parameters

ipackageThis indicates which package is home to this icon. General purpous shared icons like delete, trash, smileys, ect come from the kernel package. This also allows us to have a seperate "nextPage" icon for forums, one for image galleries, and one for wiki.required
inameThis is the base name of the icon that you want to use. Notice that there is no extension like .png, .gif, ect. This is intentional and biticon will allow any type of image to be used and find the correct file for you. It will also generate correctly formed HTML for that file class.required
iexplainThis is equivelent to the alt attribute in an img tag. This will generate the alt tag in the page, but will also be used to correctly generate HTML to allow screen readers and other accessibility devices for the physically challenged to function correctly. additionally it will add the same value to the title attribute, giving the user a hover tooltipoptional
ipathhere you can specify a folder within the ipackage. Note: ipath requires a trailing '/' to work correctlyoptional
iforceyou can specify how the icon is displayed. options include: ;icon: This will force the use of an icon regardless of the setting in the themes manager. It can be useful in menus and the like, where showing the iexplain text can be disruptive. ;icon_text: This will force the display of the iexplain text alongside the icon. Useful in particular situations where you are too lazy to add the text next to the icon manuallyoptional


note: to use variables within parameters you will have to 'escape' the variables with '`'


These are the only four attributes specific to biticon. Any other attributes, such as class above, are pased through to the HTML tag unaltered.

Sample


<?php
{biticon ipackage="blogs" iname="admin" iexplain="Configure blog settings" class="somecssclass"}
?>


If you want to use variables within biticon parameters, use this notation:

<?php
{biticon ipackage="users" ipath="flags/" iname="`$userPrefs.flag`" iexplain="`$userPrefs.flag`"}
?>


If your flag icons are stored in users/icons/flags, use this:

<?php
{biticon ipackage="users" ipath="flags/" iname="some_flag" iexplain="some_country"}
?>


It works much like the template override system that allows themes. So the above command might generate:

if the icon theme is loveandkisses and it overides that icon.

<?php
<img src="themes\styles\loveandkisses\icons\blogs\admin.png" alt="="Configure blog settings" class="somecssclass">
?>


if the site theme is classicarcade and it overides that icon.

<?php
<img src="themes\styles\classicarcade\icons\blogs\admin.gif" alt="="Configure blog settings" class="somecssclass">
?>


if the neithier the icon theme or site theme override the admin icons.

<?php
<img src="blogs\icons\admin.jpg" alt="="Configure blog settings" class="somecssclass">
?>


See also

  • Smarty Functions</iname></ipackage></iname></ipath></ipackage></bit_theme_path></iname></ipath></ipackage></bit_root_path></iname></ipath></ipackage></site></bit_theme_path></iname></ipath></ipackage></icon></bit_theme_path>
Page History
Date/CommentUserIPVersion
05 Aug 2008 (04:25 UTC)
clean-up
laetzer85.178.11.15517
Current • Source
hiran85.233.40.19216
View • Compare • Difference • Source
hiran85.233.40.19215
View • Compare • Difference • Source
hiran85.233.40.19214
View • Compare • Difference • Source
hiran85.233.40.19213
View • Compare • Difference • Source
hiran85.233.40.19212
View • Compare • Difference • Source
hiran85.233.40.19211
View • Compare • Difference • Source
hiran85.233.40.19210
View • Compare • Difference • Source
xing194.152.164.459
View • Compare • Difference • Source
xing194.152.164.458
View • Compare • Difference • Source
spiderr66.93.240.2047
View • Compare • Difference • Source
xing83.64.18.1226
View • Compare • Difference • Source
xing62.99.189.1305
View • Compare • Difference • Source
xing62.99.189.1304
View • Compare • Difference • Source
btodoroff66.206.174.733
View • Compare • Difference • Source