LinkButton is a link element that is rendered as a button and used as a navigation component based on GET requests targeting bookmarkable URLs.
<style>
body .ui-button.ui-linkbutton {
margin-right: 1rem;
}
</style>
<div class="card">
<p:linkButton outcome="productDetail" value="Bookmark">
<f:param name="productId" value="10"/>
</p:linkButton>
<p:linkButton outcome="productDetail" value="Bookmark new tab" target="_blank">
<f:param name="productId" value="10"/>
</p:linkButton>
<p:linkButton outcome="productDetail" value="With Icon" icon="pi pi-star">
<f:param name="productId" value="20"/>
</p:linkButton>
<p:linkButton outcome="productDetail" icon="pi pi-star" title="Icon Only">
<f:param name="productId" value="30"/>
</p:linkButton>
<p:linkButton outcome="productDetail" value="With Icon" disabled="true">
<f:param name="productId" value="40"/>
</p:linkButton>
<p:linkButton outcome="productDetail" value="Bookmark" icon="pi pi-star" disabled="true">
<f:param name="productId" value="50"/>
</p:linkButton>
<p:linkButton outcome="productDetail" icon="pi pi-star" disabled="true" title="Icon Only">
<f:param name="productId" value="60"/>
</p:linkButton>
<h5 id="sizes">Sizes</h5>
<p:linkButton outcome="productDetail" value="Small" size="small"/>
<p:linkButton outcome="productDetail" value="Normal"/>
<p:linkButton outcome="productDetail" value="Large" size="large" />
</div>