Overview
Would you like to customize the save and resume link? Using a small CSS snippet, you can easily convert the text link that appears when the Save and Resume addon is enabled to appear like a button. Let’s get started!
Adding the CSS snippet
For the purpose of this documentation, we’re going to presume you’ve already created your form and enabled the Save and Resume addon.
However, should you need any assistance with enabling this addon for your form, please check out this helpful guide.
Once your form is created and the addon is enabled, simply add this CSS to your site and customize the colors, the font-family, font-size, etc., however you wish.
If you need help in how and where to add CSS snippets to your site, please check out this tutorial.
Styling for all forms
a.wpforms-save-resume-button {
padding: 10px;
text-decoration: none !important;
background-color: #e27730;
border-radius: 3px;
color: #ffffff !important;
font-family: 'Roboto' !important;
font-size: 17px !important;
border: 1px solid #e27730;
transition: all 0.3s ease-out;
}
a.wpforms-save-resume-button:hover {
color: #e27730 !important;
background-color: #ffffff;
}
Styling for specific forms
If you only wanted to apply this change to a specific form, use this CSS instead.
form#wpforms-form-999 a.wpforms-save-resume-button {
padding: 10px;
text-decoration: none !important;
background-color: #e27730;
border-radius: 3px;
color: #ffffff !important;
font-family: 'Roboto' !important;
font-size: 17px !important;
border: 1px solid #e27730;
transition: all 0.3s ease-out;
}
form#wpforms-form-999 a.wpforms-save-resume-button:hover {
color: #e27730 !important;
background-color: #ffffff;
}
Please note that you will need to update the form ID in your CSS from 999 to match your own form ID. If you need any help in finding your form ID, please review this helpful guide.
And now when you view the form, you can immediately see the difference!
Would you like to also customize the email subject line for this addon when notifications are sent? Take a look at our tutorial on How to Change the Email Subject on Save and Resume Email Notifications.