WordPress.org

Forums

Contact Form 7
[resolved] How can I add placeholder to Form element? (15 posts)

  1. vaanyaa
    Member
    Posted 2 years ago #

    Hi.
    Can I add placeholder to some form element, or contact form 7 don't have this functionality?

    http://wordpress.org/extend/plugins/contact-form-7/

  2. Takayuki Miyoshi
    Member
    Plugin Author

    Posted 2 years ago #

    What do you mean by "placeholder"? Could you be more specific?

  3. vaanyaa
    Member
    Posted 2 years ago #

    I need form element like this:
    <input type="text" name="text" placeholder="text" />

  4. vaanyaa
    Member
    Posted 2 years ago #

    I add regex that get placeholder to modules/text.php file.
    elseif ( preg_match( '/^placeholder:([a-zA-Zа-яёА-ЯЁ_]+)$/u', $option, $matches ) ) {
    
                        $placeholder_att = $matches[1];
    
    		}

    and

    if ( '' !== $placeholder_att )
    
    		$atts .= sprintf( ' placeholder="%s"', $placeholder_att );

    In english all work fint, but now I have problem with russian symbols. If I type placeholder value on russian, element does not appear at all

  5. Takayuki Miyoshi
    Member
    Plugin Author

    Posted 2 years ago #

    HTML5 placeholder attribute will be supported by the next version or next next version of Contact Form 7. For the meantime, use watermark option instead.

    Example:
    [text* your-name watermark "Write your name here"]

    Text Fields | Contact Form 7

  6. vaanyaa
    Member
    Posted 2 years ago #

    Thanks

  7. bubi
    Member
    Posted 2 years ago #

    Hello Takayuki Miyoshi,

    Any news on support for placeholder attribute? With HTML5 forms becoming more and more popular there is increasing demand on this option.
    Regards; Luka

  8. marky_uk
    Member
    Posted 2 years ago #

    Hi there!

    I've got the same request here - using placeholders instead of watermarks for HTML5 compliancy :-)

    M

  9. webvitaly
    Member
    Posted 2 years ago #

    I also have request about support of the 'placeholder' param

  10. Bill Weye
    Member
    Posted 2 years ago #

    I'd love me some placeholder, please :)

  11. missstyles
    Member
    Posted 2 years ago #

    I've been looking for this over the past few days also and decided to take matters into my own hands!

    In the plug in folder go to

    modules > text.php (for email input and regular text input)

    change line

    $html = '<input type="text" name="' . $name . '" value="' . esc_attr( $value ) . '"' . $atts . ' />';

    to

    $html = '<input type="text" name="' . $name . '" placeholder="' . esc_attr( $value ) . '"' . $atts . ' />';

    For Placeholders on Text area

    modules > textarea.php

    line 76 add

    if ( $class_att )
    $atts .= ' placeholder="' . trim( $value ) . '"';

    and on line 95 change this:

    $html = '<textarea name="' . $name . '"' . $atts . '>' . esc_textarea( $value ) . '</textarea>';

    to this

    $html = '<textarea name="' . $name . '"' . $atts . '></textarea>';

    It will make every "value" you enter in the backend a placeholder so if you solely just need placeholder it works a dream! must be careful not to update the plug in though so isn't long term ideal!

    Hope that helps some people I've been searching for a solution for days!

  12. eridani
    Member
    Posted 2 years ago #

    @missstyles That worked flawlessly. You are my new hero!!!

  13. Tirumal
    Member
    Posted 2 years ago #

    Here is a better solution to add place holder to contact form 7 without editing the plugin itself.

  14. Danis
    Member
    Posted 2 years ago #

    Contactform 7's latest version now supports placeholders. No need for hacking anymore.

  15. missstyles
    Member
    Posted 2 years ago #

    Unfortunately it seems that they're not quite a html5 placeholder, still some form of javascript is attached which makes them work - if you try to use them outside of the wordpress folder, which I've needed to do recently - it still doesn't work despite the input on the field being placeholder="placeholder text".

    I think its just a renamed watermark feature that was there before but is more reliable as that often didn't work

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Contact Form 7
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic