How to style and add icon in Contact Form 7

CF7 with icon

First download Contact Form 7 and install in your WordPress dashboard. Also we need to download the Fontawesome for this to work. You need the fonts and css added in your theme as well.

 

Now create a contact form using the contact form 7 plugin and copy and paste this html.

 

then open your style.css and copy paste this code.

 

Here is a sample contact form 7 with icon

Contact Form 7 with icon
Contact Form 7 with icon

  • Hello, i believe that i saw you visited my blog thus i got here to go back the favor?.I am trying
    to to find issues to improve my website!I suppose its adequate to use some of your ideas!!

  • Dana

    Is there any way to REMOVE icons that are in Contact Form 7? I can’t find anywhere on WordPress to change that, even though I can change the Custom Styles.

    • Drew

      If you use the html code I teach. remove the tag with class icon.