EC-CUBE3.0에 reCAPTCHA 설치

1700 단어 EC-CUBE3PHP

EC-CUBE3.0에 reCAPTCHA 설치


하고 싶은 일


나는 로봇이 아니다."하고 싶어요.

컨디션


EC-CUBE3.0

이루어지다


프런트엔드 설치는 두 개뿐입니다.
- 관리 화면에서 블록 설정
관리 화면에 새 블록을 작성하십시오.
<!-- Google recaptcha -->
<script src='https://www.google.com/recaptcha/api.js' async defer></script>
<script>
  function validateRecaptcha(code){
    if(!!code){
      var form = document.querySelector(".recaptcha");
      form.removeAttribute('disabled');
    }
  }
</script>
작성된 블록을 레이아웃으로 설정하고 질의 테이블의 머리글 섹션에 설정합니다.
4
  • 컨설팅 테이블에 reCAPTCHA 부품을 포함합니다.
    
    ## 編集箇所
    src > Eccube > Resource > template > default > Contact > index.twig
    
    <div class="col-sm-offset-4 col-sm-4">
        <div class="g-recaptcha" data-callback="validateRecaptcha" data-sitekey="6LdkFCoUAAAAAOwtu-OYCfiFKLBz9_ED1KlsEiOA"></div>
    </div>
    
    
    <div id="top_box__confirm_button" class="btn_group col-sm-offset-4 col-sm-4">
      <p><button type="submit" class="recaptcha btn btn-primary btn-block" disabled>確認ページへ</button></p>
    </div>
    
    검사 전에 확인 단추를 누르지 않기 위해서, 초기 디스플레이에서disabled를 선택했습니다.
    이 소스 코드의 전문은 다음과 같다.
    병합 결과는 다음과 같습니다.
    이상
  • 좋은 웹페이지 즐겨찾기