WordPress.org

Ready to get started?Download WordPress

Forums

Change Jetpack contact form output (2 posts)

  1. Mattakle
    Member
    Posted 1 year ago #

    Hi.

    Is it possible to change the html output of the contact form?

    I would love to override the output function so that I may remove and add some html to change the look of form as I cannot do this by css. I want to add classes and remove things like the labels. Is this possible?

    I've been attempting to override functions in my theme's function.php file but have not managed it.

    Thanks in advance

  2. Deborah
    Member
    Posted 1 year ago #

    Hi there, You can customize the field labels or hide them by targeting them directly with CSS. You shouldn't need to add any additional classes. If you'd like to provide a link to your site, I'll be happy to help with specific details.

    Here's an example of how you could target the label for the name field to change it to red text:

    #contact-form-12 label.name {
    color: red;
    }

    In my example the contact form ID is contact-form-12. On your own site you'll need to make sure to change the number there to match your own contact form's assigned number.

    Also, you can add this custom CSS directly to the custom style sheet included as a feature of Jetpack. This will keep it separate from your site's own theme so that it won't get over-written if there's an update to your theme. You can find this style sheet by going to Appearance -> Edit CSS. There's more information about this feature here:

    http://jetpack.me/support/custom-css/

    Let me know if I can be any further help :-)

Topic Closed

This topic has been closed to new replies.

About this Topic