Applying <p:commandButton> style to <p:commandLink> because I basically need <p:commandButton target="_blank">

Question

Does anyone know how to put the same styles from the commandbutton to all commandlinks?

I want that all links appear like this (overriding links styles and using the button styles):

A normal button:

A hovered button:

A pressed button:

My current primefaces theme is start

Answer 1

As per the comments, just stick to <p:commandButton> and use an alternate solution to solve the initial functional requirement of the need to open the PDF file download in a new window without explicitly setting the <h:form target> (which would affect all of form's command buttons/links).

<p:commandButton ... ajax="false" onclick="form.target='_blank'">

This ends up in less CSS pain.

Answer 2

You can use style sheets used in command button for command link.

  <p:commandLink style="padding: .3em 1em;" styleClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only ui-button-text ui-c" ajax="false" value="Download as Excel" download="#{salaryCycleController.current}.xls" onclick="return ExcellentExport.excel(this, 'tbl', 'Sheet1');" ></p:commandLink>

I was compelled to use p:commandLink as p:commandButton did not support the download attribute.