## The Shortcode

If you follow my posts here on Wptuts+, you know that I absolutely love WordPress' Shortcode API.

I'm going to divide the shortcode into 3 sections to be able to explain it better, but let's not forget to open and close the shortcode function first:

### Attributes of Our Shortcode

We need to set a few attributes in order to stay flexible while still being lightweight. Here's ten:

### The return of the Shortcode

This last bit is pretty simple: Show the success message if the e-mail is sent, or the e-mail form and the error message (if there is one). Here's the code:

We're not showing the form again if the e-mail is sent, but if you want to show it anyways, you could use this simple line instead:

## The CSS

Of course, the code by itself wouldn't look great. With some make-up, CSS, we can make our form prettier. Add these lines of CSS code into your style.css file of your theme:

If you did everything right, you will see something similar to the image below:

Congratulations, you just built your own contact form shortcode!

## Conclusion

This simple contact form is adequate for most websites but if you want to add more fields to it, you just need to edit the form and add the $form_data['name_of_the_new_field'] variables into the $email_message variable (and maybe add the field's name to the \$required_fields array.

If you have any ideas on how to improve this code or show your website pages where you used it, please share your comment with us below!