May 252014
 

Fast Secure Contact Form Label Inside Field helps you display the labels inside the fields to create a custom form.

Last Updated: February 26, 2017

Latest News: I have fixed a broken link.

Fast Secure Contact Form Label Inside Field Setup

Step 1 ) Go to Settings -> FS Contact Form -> Fields and select the fields you want to edit. See images below.

The following image displays the field that will be changed. The Label name Name: and also the Save Changes button which you need to click on when you finish editing the field or the form.

fast-secure-contact-form-field-settings

Step 2 ) The following image lets you know that the field you are currently working on is a text type field.

fast-secure-contact-form-field-type

Step 3 ) In the following image you will enter a Default name. For this field I entered Name and I also selected Required field option.

Info: You can enter any field name you wish. 

fast-secure-contact-form-default

Step 4 ) In the following image you will select Hide label and also Default as placeholder options.

fast-secure-contact-form-hide-label

Step 5 ) The following image displays your labels inside the fields. That is how simple it is to create this form.

fast-secure-contact-form-labels-inside-field

Click on the following link Two Columns Layout to continue with the next tutorial.

I will be updating this tutorial from time to time so keep coming back for the latest. If you have any questions please let me know.

Enjoy

Go Back To WordPress Fast Secure Contact Form Plugin List:

Manuel Ballesta RuizManuel Ballesta Ruiz is a web developer, Blogger and WordPress Enthusiast.

  3 Responses to “Fast Secure Contact Form Label Inside Field”

  1. I need to change the color of the placeholder text. I have changed the color of the fields and now you can’t see the color of the placeholder.
    Also I have made the form two columned and I would like to get rid of the white line between the Welcome Introduction and the Fields.

    • Hi Karen, thank you for your question. It is going to be a bit challenging because you have a background image. What you can try on one field first is to remove the background-color and add opacity: 0.18 !important;. Play around with the opacity value until you find what you want.

      Let me know if you need more help.

      • Hi Karen, disregard my previous solution, because if you set field text color to white then the opacity will make it invisible. Unless you change the text color to a different color then you might be able to use the opacity value.

        If it doesn’t work then you might have to remove the inline text placeholder altogether. If not it will be very challenging to make it work.

        Regards

 Leave a Reply

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

(required)

(required)