J3.x

Difference between revisions of "Joomla Standard Icomoon Fonts/it"

From Joomla! Documentation

(Created page with "== Come utilizzarli ==")
(Created page with "I font Icon possono essere richiamati con un <tt><span class="icon-''name-of-icon''"></tt> tag e uno {space}. es")
Line 5: Line 5:
 
== Come utilizzarli ==
 
== Come utilizzarli ==
  
Icon fonts can be called with a <tt><span class="icon-''name-of-icon''"&gt;</tt> tag and a {space}. eg
+
I font Icon possono essere richiamati con un <tt><span class="icon-''name-of-icon''"&gt;</tt> tag e uno {space}. es
  
 
<pre>
 
<pre>

Revision as of 09:50, 3 June 2016

Other languages:
Deutsch • ‎English • ‎Nederlands • ‎español • ‎français • ‎italiano • ‎русский • ‎فارسی • ‎中文(台灣)‎ • ‎日本語
Joomla! 
≥ 3.0.0

Da Joomla 3.0.0, il CMS Joomla! presenta il proprio Set di Font Icomoon. Questi fonts sono disponibili di default nei template "Protostar" (Frontend), "Isis" (Amministrazione) e "Hathor" (Amministrazione).

Come utilizzarli

I font Icon possono essere richiamati con un <span class="icon-name-of-icon"> tag e uno {space}. es

<span class="icon-joomla"> </span>

Will show the Joomla! icon:  

Font Size

Because the icons are fonts, you can control the size of them with an added class or style= statement. Of course you will have to define the class in your .css or .less stylesheet file.

<span class="icon-joomla large-icon"> </span>
<span class="icon-joomla" style="font-size:24px;"> </span>

Here is the resized Joomla! icon:  

Available Icomoon Icons

This is the complete list, including the alternative names to call the icon. The alternatives are separated by a '/' below.

   joomla
   address
   apply / edit / pencil
   archive / drawer-2
   arrow-down-2
   arrow-down-3
   arrow-down-4
   arrow-first
   arrow-last
   arrow-left-2
   arrow-left-3
   arrow-left-4
   arrow-right-2
   arrow-right-3
   arrow-right-4
   arrow-up-2
   arrow-up-3
   arrow-up-4
   attachment / paperclip / flag-2
   backward-2 / reply
   backward-circle
   ban-circle / minus-circle
   bars
   basket
   book
   bookmark
   bookmark-2
   box-add
   box-remove
   briefcase
   broadcast / connection / wifi
   brush
   calendar
   calendar-2
   calendar-3
   camera
   camera-2 / video
   cancel-circle
   cart
   chart
   checkbox-partial
   checkbox-unchecked
   checkedout / lock / locked
   checkin / checkbox / checkbox-checked
   checkmark-2
   checkmark-circle
   chevron-down / downarrow / arrow-down
   chevron-left / leftarrow / arrow-left
   chevron-right / rightarrow / arrow-right
   chevron-up / uparrow / arrow-up
   circle
   clock
   cogs
   comment / comments
   comments-2
   compass
   contract
   contract-2
   credit
   credit-2
   cube
   dashboard
   database
   delete / remove / cancel-2
   download
   enter
   envelope / mail
   envelope-opened / mail-2
   equalizer
   exit
   expand
   expand-2
   expired
   eye-close / eye-blocked / eye-2
   eye-open / eye
   featured / default / star
   feed
   file
   file-2
   file-add / file-plus
   file-check
   file-minus
   file-remove
   filter
   first
   flag
   flag-3
   folder-3
   folder-close / folder-2
   folder-minus
   folder-open / folder
   folder-plus
   folder-plus-2
   folder-remove
   forward-2
   forward-circle
   grid / grid-view
   grid-2 / grid-view-2
   health
   heart
   heart-2
   home
   home-2
   info
   info-2 / info-circle
   key
   lamp
   last
   lightning / flash
   link
   list / list-view
   list-2
   location
   loop
   menu
   menu-2
   menu-3
   minus / not-ok
   minus-sign / minus-2
   mobile
   move
   music
   new / plus
   next / forward
   notification
   notification-2 / notification-circle
   options / cog
   out-2 / new-tab
   out-3 / new-tab-2
   palette / color-palette
   paragraph-center
   paragraph-justify
   paragraph-left
   paragraph-right
   pause
   pause-circle
   pencil-2
   pending / warning
   phone
   phone-2
   picture / image
   pictures / images
   pie
   pin / pushpin
   play
   play-2 / video-2 / youtube
   play-circle
   plus-circle
   power-cord
   previous / backward
   print / printer
   publish / save / ok / checkmark
   purge / trash
   puzzle
   question / question-sign / help
   question-2 / question-circle
   quote / quotes-left
   quote-2 / quotes-right
   quote-3 / bubble-quote
   radio-checked / generic
   radio-unchecked
   save-copy / copy
   save-new / plus-2
   scissors
   screen
   screwdriver / tools
   search
   share / redo
   share-alt / out
   shield
   shuffle
  signup
   smiley / smiley-happy
   smiley-2 / smiley-happy-2
   smiley-neutral
   smiley-neutral-2
   smiley-sad
   smiley-sad-2
   square
   stack
   star-2
   stop
   stop-circle
   support
   switch
   tablet
   tag
   tag-2
   tags
   tags-2
   thumbs-down
   thumbs-up
   tree
   tree-2
   unarchive / drawer
   unblock / refresh / redo-2
   undo
   undo-2
   unfeatured / asterisk / star-empty
   unlock
   unpublish / cancel
   upload
   user
   users
   vcard
   wand
   warning-2 / warning-circle
   wrench
   zoom-in
   zoom-out

Including in Your Template

This section is incomplete.

To include the Icomoon fonts in your template you will have to add the css stylesheet (/media/jui/css/icomoon.css) or include it in your .less file when you generate the .css stylesheet(s).

$doc = JFactory::getDocument();
$doc->addStyleSheet($this->baseurl.'/media/jui/css/icomoon.css');