Change Submit Button Image in Forms That Use Layout Templates

When you use a custom layout template with forms and landing pages, you can insert an image for the submit button. Add custom CSS to the layout template that’s associated with either the form or the landing page it’s embedded on.

Required Editions

User Permissions Needed
To edit a form:	Account Engagement Administrator or Marketing role

Open the Forms page.
- In Account Engagement, select Marketing | Forms | Forms.
- In the Lightning app, select Content | Forms.
Open the form you want to edit, and click Edit form.
On the Look and Feel tab, remove the text in the Submit Button field.
To display text on top of the image, leave or edit the text in the field.
Save your form.
Open the layout template that’s associated with the form or landing page, and edit it.

On the Layout tab, paste this code inside the <head> tag.

<style type="text/css">
  form.form p.submit input {
  margin: 0;
  padding: 0;
  text-align: right;
  border: none;
  background: url(https://www.example.com/example.gif) no-repeat left top;
  width:100px;
  height:100px;
  cursor: pointer; }
</style>

Replace the example URL with the URL of the image that you want to use.
Edit width and height attributes to match the image’s size.
Save your layout template.