1. 홈
  2. 질의 응답
  3. 일반적인 WordPress 페이지에 양식을 추가하는 방법은 무엇입니까?

일반적인 WordPress 페이지에 양식을 추가하는 방법은 무엇입니까?

2014-12-25 3 views

답변

0

, 차라리 사용자 지정 양식을하는 것보다매우 빠른 솔루션입니다 널리 워드 프레스 user.Using 플러그인에서을 사용하는 Contact Form 7에게 추천 할 것입니다. (문의 양식 7 능력을 가지고 기억 다국어 양식 생성).

1 단계 : 페이지 템플릿

만들기 당신이 가지고있는 테마 가고 싶은 경우

는 그러나 내장 형태, 당신은 이 단계 아래에 따라야합니다

첫 번째 단계는 페이지 템플릿 을 만드는 것입니다. 이렇게하려면 코드 page.php을 page-contact.php이라는 새 파일에 복사하십시오.

contact.php 파일의 시작 부분에 메모를 추가하여 WordPress에서 파일을 page template으로 처리해야합니다. 여기 코드는 다음과 같습니다

<?php 
    /* 
    Template Name: Contact 
    */ 
    ?>

귀하의 contact.php 파일은 다음과 같아야합니다

<?php 
    /* 
    Template Name: Contact 
    */ 
    ?> 

    <?php get_header() ?> 

     <div id="container"> 
      <div id="content"> 
       <?php the_post() ?> 
       <div id="post-<?php the_ID() ?>" class="post"> 
        <div class="entry-content"> 
        </div><!-- .entry-content -> 
       </div><!-- .post--> 
      </div><!-- #content --> 
     </div><!-- #container --> 

    <?php get_sidebar() ?> 
    <?php get_footer() ?>

2 단계 : 이제 형태

를 구축, 우리가 간단한 문의 양식을 작성해야 . entry-content div 내에 다음 코드를 붙여 넣기 만하면됩니다. 우리의 양식이 꽤 단정 HTML 코드 하드

<form action="<?php the_permalink(); ?>" id="contactForm" method="post"> 
     <ul> 
      <li> 
       <label for="contactName">Name:</label> 
       <input type="text" name="contactName" id="contactName" value="" /> 
      </li> 
      <li> 
       <label for="email">Email</label> 
       <input type="text" name="email" id="email" value="" /> 
      </li> 
      <li> 
       <label for="commentsText">Message:</label> 
       <textarea name="comments" id="commentsText" rows="20" cols="30"></textarea> 
      </li> 
      <li> 
       <button type="submit">Send email</button> 
      </li> 
     </ul> 
     <input type="hidden" name="submitted" id="submitted" value="true" /> 
    </form>

아무것도. 참고 입력 유형 = "숨김"line 19에 추가 : 나중에 양식이 제출되었는지 확인하는 데 사용됩니다.

3 단계 :

우리의 양식을 처리하는 데이터 처리 및 오류 꽤 좋아 보인다,하지만 어떤 이메일을 보내하지 않기 때문에 바로는 아주 쓸모입니다. 우리가해야 할 일은 양식이 제출되었는지 확인한 다음 필드가 올바르게 채워 졌는지 확인하는 것입니다.

필드가 올바르게 채워지면 블로그 관리자 이메일을 보내고 이메일을 보내드립니다. 그렇지 않으면 전자 메일이 전송되지 않고 사용자에게 오류가 표시됩니다.

<?php 
    if(isset($_POST['submitted'])) { 
     if(trim($_POST['contactName']) === '') { 
      $nameError = 'Please enter your name.'; 
      $hasError = true; 
     } else { 
      $name = trim($_POST['contactName']); 
     } 

     if(trim($_POST['email']) === '') { 
      $emailError = 'Please enter your email address.'; 
      $hasError = true; 
     } else if (!preg_match("/^[[:alnum:]][a-z0-9_.-]*@[a-z0-9.-]+\.[a-z]{2,4}$/i", trim($_POST['email']))) { 
      $emailError = 'You entered an invalid email address.'; 
      $hasError = true; 
     } else { 
      $email = trim($_POST['email']); 
     } 

     if(trim($_POST['comments']) === '') { 
      $commentError = 'Please enter a message.'; 
      $hasError = true; 
     } else { 
      if(function_exists('stripslashes')) { 
       $comments = stripslashes(trim($_POST['comments'])); 
      } else { 
       $comments = trim($_POST['comments']); 
      } 
     } 

     if(!isset($hasError)) { 
      $emailTo = get_option('tz_email'); 
      if (!isset($emailTo) || ($emailTo == '')){ 
       $emailTo = get_option('admin_email'); 
      } 
      $subject = '[PHP Snippets] From '.$name; 
      $body = "Name: $name \n\nEmail: $email \n\nComments: $comments"; 
      $headers = 'From: '.$name.' <'.$emailTo.'>' . "\r\n" . 'Reply-To: ' . $email; 

      wp_mail($emailTo, $subject, $body, $headers); 
      $emailSent = true; 
     } 

    } ?>

내가 여기 일이었다 한 무엇 단순히 양식을 제출하고 정확하게 작성되었는지 확인하기 :

기능) 페이지 템플릿의 선언과 get_header (사이에 다음 코드를 붙여 넣습니다.빈 필드 또는 잘못된 전자 메일 주소과 같은 오류가 발생하면 메시지가 반환되고 양식이 제출되지 않습니다.

이제 관련 필드 아래에 error messages을 표시해야합니다 (예 : "이름을 입력하십시오."). 아래에서 "그대로"사용할 수있는 완전한 양식 페이지 템플리트를 찾을 수 있습니다.

<?php 
    /* 
    Template Name: Contact 
    */ 
    ?> 

    <?php 
    if(isset($_POST['submitted'])) { 
     if(trim($_POST['contactName']) === '') { 
      $nameError = 'Please enter your name.'; 
      $hasError = true; 
     } else { 
      $name = trim($_POST['contactName']); 
     } 

     if(trim($_POST['email']) === '') { 
      $emailError = 'Please enter your email address.'; 
      $hasError = true; 
     } else if (!preg_match("/^[[:alnum:]][a-z0-9_.-]*@[a-z0-9.-]+\.[a-z]{2,4}$/i", trim($_POST['email']))) { 
      $emailError = 'You entered an invalid email address.'; 
      $hasError = true; 
     } else { 
      $email = trim($_POST['email']); 
     } 

     if(trim($_POST['comments']) === '') { 
      $commentError = 'Please enter a message.'; 
      $hasError = true; 
     } else { 
      if(function_exists('stripslashes')) { 
       $comments = stripslashes(trim($_POST['comments'])); 
      } else { 
       $comments = trim($_POST['comments']); 
      } 
     } 

     if(!isset($hasError)) { 
      $emailTo = get_option('tz_email'); 
      if (!isset($emailTo) || ($emailTo == '')){ 
       $emailTo = get_option('admin_email'); 
      } 
      $subject = '[PHP Snippets] From '.$name; 
      $body = "Name: $name \n\nEmail: $email \n\nComments: $comments"; 
      $headers = 'From: '.$name.' <'.$emailTo.'>' . "\r\n" . 'Reply-To: ' . $email; 

      wp_mail($emailTo, $subject, $body, $headers); 
      $emailSent = true; 
     } 

    } ?> 
    <?php get_header(); ?> 
     <div id="container"> 
      <div id="content"> 

       <?php if (have_posts()) : while (have_posts()) : the_post(); ?> 
       <div <?php post_class() ?> id="post-<?php the_ID(); ?>"> 
        <h1 class="entry-title"><?php the_title(); ?></h1> 
         <div class="entry-content"> 
          <?php if(isset($emailSent) && $emailSent == true) { ?> 
           <div class="thanks"> 
            <p>Thanks, your email was sent successfully.</p> 
           </div> 
          <?php } else { ?> 
           <?php the_content(); ?> 
           <?php if(isset($hasError) || isset($captchaError)) { ?> 
            <p class="error">Sorry, an error occured.<p> 
           <?php } ?> 

          <form action="<?php the_permalink(); ?>" id="contactForm" method="post"> 
           <ul class="contactform"> 
           <li> 
            <label for="contactName">Name:</label> 
            <input type="text" name="contactName" id="contactName" value="<?php if(isset($_POST['contactName'])) echo $_POST['contactName'];?>" class="required requiredField" /> 
            <?php if($nameError != '') { ?> 
             <span class="error"><?=$nameError;?></span> 
            <?php } ?> 
           </li> 

           <li> 
            <label for="email">Email</label> 
            <input type="text" name="email" id="email" value="<?php if(isset($_POST['email'])) echo $_POST['email'];?>" class="required requiredField email" /> 
            <?php if($emailError != '') { ?> 
             <span class="error"><?=$emailError;?></span> 
            <?php } ?> 
           </li> 

           <li><label for="commentsText">Message:</label> 
            <textarea name="comments" id="commentsText" rows="20" cols="30" class="required requiredField"><?php if(isset($_POST['comments'])) { if(function_exists('stripslashes')) { echo stripslashes($_POST['comments']); } else { echo $_POST['comments']; } } ?></textarea> 
            <?php if($commentError != '') { ?> 
             <span class="error"><?=$commentError;?></span> 
            <?php } ?> 
           </li> 

           <li> 
            <input type="submit">Send email</input> 
           </li> 
          </ul> 
          <input type="hidden" name="submitted" id="submitted" value="true" /> 
         </form> 
        <?php } ?> 
        </div><!-- .entry-content --> 
       </div><!-- .post --> 

        <?php endwhile; endif; ?> 
      </div><!-- #content --> 
     </div><!-- #container --> 

    <?php get_sidebar(); ?> 
    <?php get_footer(); ?>

여기에 jQuery Validation을 추가하여 필드의 유효성을 검사 할 수도 있습니다.

참조 :이 How to create built in form for your contact theme

출처

2014-12-25 06:45:25

1

당신이 양식을 추가하려면하지, 당신은 사용 할 수 문의 양식 7
당신이 당신은 만들 필요 데이터베이스 연결로 형성하려면 사용자 정의 페이지 템플리트. 당신이 어떤 플러그인을 찾는 경우

출처

2014-12-25 06:31:06

+0

내가 문의 양식 7 일에 찾고 있어요 좋아, 내가 DB 연결을 필요 없어요 – Vikram

관련 문제

 관련 문제