CODEWITHSUNDEEP
jsfprimefaces
D. Bermudez
D. Bermudez

Reputation: 217

JSF navigate to external url using image button

Simple question (using JSF 2.0 and primefaces 2.2.1):

I need to create a button or link that will take me to an external url (i.e. www.facebook.com) and I need that button to look like the facebook icon instead of having the literal word. How can I do this? Thank you.

Upvotes: 2

Views: 9882

Answers (1)

BalusC
BalusC

Reputation: 1109874

You basically want to end up with the following in the JSF-generated HTML code:

<a><img /></a>

There are several ways how to achieve this in JSF.

  1. Just do it:

    <a href="http://www.facebook.com">
  <img src="#{request.contextPath}/resources/images/facebook.png" />
</a>

  2. Use <h:graphicImage>:

    <a href="http://www.facebook.com">
  <h:graphicImage name="images/facebook.png" />
</a>

  3. Eventually, with <h:outputLink>:

    <h:outputLink value="http://www.facebook.com">
  <h:graphicImage name="images/facebook.png" />
</h:outputLink>

What way to choose depends on whether you really need it to be a JSF component. E.g. in order to be able to grab/manupulate it in backing bean, and/or to re-render by ajax, etc.

Upvotes: 6

Related Questions