How to add Primeicon to p:tab?

Post Reply
JeeDev_User
Posts: 83
Joined: 26 Sep 2019, 11:02

15 Jan 2021, 16:07

Hi,

Wondering, is there a way to use one of Primeicon's:
https://www.primefaces.org/rain/icons.xhtml
as image displaying on the p:tab ?

Something like that:

Code: Select all

  <p:tabView > 
          <p:tab icon="path_to_primeicon_or_whatever" ...>
OR:

Code: Select all

  <p:tabView > 
          <p:tab >
           <f:facet name="title">
               <p:graphicImage value="path_to_primeicon_or_whatever"/>
            </f:facet>          
          </p:tab>

stolp
Posts: 121
Joined: 21 Aug 2018, 16:05

15 Jan 2021, 17:42

The following should work:

Code: Select all

<p:tabView > 
    <p:tab >
        <f:facet name="title">
            </p:tab><i class="pi pi-check"></i>
        </f:facet>
    </p:tab>
<p:tabView>
To enable PrimeIcons simply add the CSS to your page with the following line:

Code: Select all

<h:outputStylesheet name="primeicons/primeicons.css" library="primefaces" /> 
This is no longer needed with PrimeFaces 10 or may already be included with the theme you are using.

JeeDev_User
Posts: 83
Joined: 26 Sep 2019, 11:02

15 Jan 2021, 18:46

Hey @stolp,
Thanks a lot! :D

mert.sincan
Posts: 4637
Joined: 29 Jun 2013, 12:38

29 Jan 2021, 01:31

Thanks a lot, @stolp ;)

Best Regards,

Post Reply

Return to “Rain - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest