Skip to content

Instantly share code, notes, and snippets.

@dlucero23
Created March 9, 2019 08:13
Show Gist options
  • Save dlucero23/cacf5f4d6698b8c1d140410a107f3b21 to your computer and use it in GitHub Desktop.
Save dlucero23/cacf5f4d6698b8c1d140410a107f3b21 to your computer and use it in GitHub Desktop.
replace the submit input of a specific gravity form with a custom, extensively stylable button. This one is styled within Pro Theme, was inspired by this documentation: https://docs.gravityforms.com/gform_submit_button/#1-change-input-to-button-
// 03. Change All Gravity Forms Buttons to Branded Button
// =============================================================================
add_filter( 'gform_submit_button_1', 'form_submit_button', 10, 2 );
function form_submit_button( $button, $form ) {
return "
<button class='button gform_button e21-23 x-anchor x-anchor-button' id='gform_submit_button_{$form['id']}' tabindex='0' style='outline: currentcolor none medium;'>
<span class='x-anchor-content'>
<span class='x-graphic' aria-hidden='true'>
<i class='x-icon x-graphic-icon x-graphic-primary' aria-hidden='true' data-x-icon-s=''></i>
</span>
<span class='x-anchor-text'>Submit</span>
</span>
</button>
";
}
/* These styles are supplementary, incomplete */
.button, [type="submit"] {
padding: 0.363em 1.125em 0.613em;
font-family: "Poppins", sans-serif;
font-weight: 700;
}
.button.e21-23.x-anchor, [type="submit"].e21-23.x-anchor-content {
font-size: 1.08rem;
text-shadow: none;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment