History of function_biticon
{maketoc}
The function biticon is used in Smarty templates. It allows icons to be overidden in the same way as templates can be over ridden. This allows a site to mix and match themes with icon sets for a more customized look with less effort. Biticon generates all (accessible) HTML needed. It replaces hard coded image tags. The image file used for the icon is selected by searching a defined set of folders: the current icon theme set by the admin, the current custom style, a default set of core icons, and more. If the file is not found in any of these locations, the src-attribute of the image is set to "broken.path/icon".
! Parameters
||
ipackage|This indicates which package is home to this icon. General purpose shared icons like delete, trash, smileys, etc 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
iname|This 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
iexplain|This 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 tooltip|optional
ipath|here you can specify a folder within the ipackage. Note: ipath requires a trailing '/' to work correctly|optional
iforce|you 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 manually. [text] well, you can do this, but why do you use biticon at all?|optional
||
^ Other attributes, such as class, are passed through to the HTML tag unaltered. To use variables within parameters, escape the variables with back ticks '`'^
! Examples
{code}
{biticon ipackage="blogs" iname="admin" iexplain="Configure blog settings" class="somecssclass"}
{/code}
If you want to use variables within biticon parameters, use this notation:
{code}
{biticon ipackage="users" ipath="flags/" iname="`$userPrefs.flag`" iexplain="`$userPrefs.flag`"}
{/code}
If your flag icons are stored in users/icons/flags, use this:
{code}
{biticon ipackage="users" ipath="flags/" iname="some_flag" iexplain="some_country"}
{/code}
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.
{code}
<img src="themes/styles/loveandkisses/icons/blogs/admin.png" alt="Configure blog settings" class="somecssclass">
{/code}
if the site theme is classicarcade and it overides that icon.
{code}
<img src="themes/styles/classicarcade/icons/blogs/admin.gif" alt="Configure blog settings" class="somecssclass">
{/code}
if neither the icon theme or site theme override the admin icons.
{code}
<img src="blogs/icons/admin.jpg" alt="Configure blog settings" class="somecssclass">
{code}
The function biticon is used in Smarty templates. It allows icons to be overidden in the same way as templates can be over ridden. This allows a site to mix and match themes with icon sets for a more customized look with less effort. Biticon generates all (accessible) HTML needed. It replaces hard coded image tags. The image file used for the icon is selected by searching a defined set of folders: the current icon theme set by the admin, the current custom style, a default set of core icons, and more. If the file is not found in any of these locations, the src-attribute of the image is set to "broken.path/icon".
! Parameters
||
ipackage|This indicates which package is home to this icon. General purpose shared icons like delete, trash, smileys, etc 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
iname|This 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
iexplain|This 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 tooltip|optional
ipath|here you can specify a folder within the ipackage. Note: ipath requires a trailing '/' to work correctly|optional
iforce|you 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 manually. [text] well, you can do this, but why do you use biticon at all?|optional
||
^ Other attributes, such as class, are passed through to the HTML tag unaltered. To use variables within parameters, escape the variables with back ticks '`'^
! Examples
{code}
{biticon ipackage="blogs" iname="admin" iexplain="Configure blog settings" class="somecssclass"}
{/code}
If you want to use variables within biticon parameters, use this notation:
{code}
{biticon ipackage="users" ipath="flags/" iname="`$userPrefs.flag`" iexplain="`$userPrefs.flag`"}
{/code}
If your flag icons are stored in users/icons/flags, use this:
{code}
{biticon ipackage="users" ipath="flags/" iname="some_flag" iexplain="some_country"}
{/code}
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.
{code}
<img src="themes/styles/loveandkisses/icons/blogs/admin.png" alt="Configure blog settings" class="somecssclass">
{/code}
if the site theme is classicarcade and it overides that icon.
{code}
<img src="themes/styles/classicarcade/icons/blogs/admin.gif" alt="Configure blog settings" class="somecssclass">
{/code}
if neither the icon theme or site theme override the admin icons.
{code}
<img src="blogs/icons/admin.jpg" alt="Configure blog settings" class="somecssclass">
{code}