Contact form 7

Kody przydatne do użycia w mailu formularza:

  • [_post_title] tytuł strony na jakiej znajduje się formularz
  • [_site_url] – link do głównej strony
  • [_url] – link do strony z jakiej został wysłany formularz
  • [response] – pozwala na dodanie w dowolnym miejscu boxu z odpowiedzą formularza

Więcej tagów.

usuniecie dodanego pliku do formularza w cf7:

function reset_form_element (e) {
    e.wrap('<form>').parent('form').trigger('reset');
    e.unwrap();
}
 
$('#fileupload').after('<span id="reset">Reset file input</span>');
 
$('#reset').on ('click', function (e) {
 
    reset_form_element( $('#fileupload') );
 
});

checkbox jako akceptacja warunków by można było wysłac formularz:


[acceptance acceptance-666] I agree to the processing of my personal data in accordance with the Personal Data Protection Act for the purpose of sending commercial information. Providing data is voluntary. I have been informed that I have the right to access my data, the possibility of correcting it, and requesting its cessation. The administrator of personal data is ... [/acceptance]

radio button wymagany poprzez default:


[radio default:2 "Dining" "Accomodation" "Reservations" "Events&amp;nbsp;+&amp;nbsp;Meetings"]

Contact form 7 – style w sass:


  input[type="text"], input[type="email"], textarea, input[type="tel"]{
      background-color: #fff;
      border: solid 1px $color_border_gray;
      color: $color_text;
      font-size: 14px;
      @include font_base_light;
      border-radius: 0 !important;
      box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,1) !important;
      @include transition( all 0.3s ease-in-out );
      text-align: center;
      &amp;:focus, &amp;.focus {
        border-color: $color_accent1;
      }
  }
  input[type="text"], input[type="email"], input[type="tel"]{
    height: 34px;
    line-height: 34px;
    width: 100%;
    max-width: 360px;
    padding: 0 10px;
  }
  textarea{
    overflow: auto;
    resize: none;
    width: 100%;
    height: 142px;
    padding: 15px;
  }

  input[type="submit"]{
    display: inline-block;
    text-align: center;
    width: 100%;
    max-width: 264px;
    height: 34px;
    line-height: 34px;
    background-color: $color_link;
    color: #fff;
    border: solid 1px $color_link;
    font-size: 14px;
    @include font_base_bold;
    cursor: pointer;
    margin: 0;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
    -webkit-appearance: button;
    *overflow: visible;
    &amp;:hover{
      background-color: $color_active;
      border-color: $color_active;
    }
  }

#websection  {
  span.wpcf7-not-valid-tip {
      color: #e20a87 !important;
      display: block;
      font-size: 13px !important;
      float: right;
  }
  div.wpcf7-response-output {
    float: left;
    margin: 10px 0 20px;
    min-height: 10px;
    width: 100% !important;
    padding: 10px 15px !important;
    text-align:center;
  }
  div.wpcf7-validation-errors, div.wpcf7-display-none {
      border: 1px solid #e20a87 !important;
  }
  div.wpcf7-mail-sent-ok{
      border: 1px solid #09849f !important;
  }
}


::-webkit-input-placeholder {
    color: rgba($color_text, 0.5);
    @include font_base_light;
}

:-moz-placeholder {
    color: rgba($color_text, 0.5);
    @include font_base_light;
}

::-moz-placeholder {
    color: rgba($color_text, 0.5);
    @include font_base_light;
}

:-ms-input-placeholder {
    color: rgba($color_text, 0.5);
    @include font_base_light;
}


/* page contact form */
#websection .wpcf7-form {
  margin: 20px 0;
  .field-form {
    width: 100%;
    input {
      width: 100%;
      text-align: left;
      font-size: 16px;
      margin: 10px 0;
      &amp;[type="submit"] {
        width: 100%;
        text-align: center;
        float: right;
      }
    }
    textarea {
      margin: 10px 0;
      text-align: left;
    }
    p {
      text-align: left;
      margin: 0;
    }
    .f_captcha {
      input {
        width: 60%;
        float: right;
      }
    }

  }
}

https://stackoverflow.com/questions/17323586/sending-variables-from-wordpress-contact-form-7-submission-to-success-page

multi step form

conditionals fields

Wordpress

Hope this helps and happy coding :)

Zobacz jeszcze

pobranie menu z jego nazwą

aby pobrać menu wraz z nagłówkiem gdzie zamieścimy jego nazwę używamy kodu: <?php if(get_field('add_sidebar_menu')): ?> <div...

touch zamiast hover

$('a').on('click touchend', function(e) { var el = $(this); var link = el.attr('href'); window.location = link; }); $(document).ready(function() {...