is er iemand die mij kan helpen met het implementeren van reCpatcha in HTML?
We willen je graag helpen.
Heb je al iets geprobeerd, en zo ja, wat precies?
Heb ooit een contactformulier laten maken en daar komt nu Spam op binnen;-((
Ben niet echt thuis in php. Heb het volgende geprobeerd:
website geregistreerd en API key gekregen
copy paste <script src='https://www.google.com/recaptcha/api.js'></script>; in de head
copy paste <div class="g-recaptcha" data-sitekey="data site key"></div> daar waar het reCaptcha blok moet komen. Na het laatste veld en voor de submit knop
Vergeet waarschijnlijk iets essentieels maar zie niet eens het " I'm not a robot" blok
Hier het contactformulier

<script type="text/javascript">
            function ajax(url,id) {																										
                var httpObj = false;																											
                    httpObj = window.XMLHttpRequest ? new window.XMLHttpRequest : (window.ActiveXObject ? new ActiveXObject("MSXML2.XMLHTTP"): null);
                    httpObj.onreadystatechange = function() {																		
                    if (httpObj.readyState == 4) {
                        if(id=="email"){
                            document.getElementById("imgemail").style.visibility=httpObj.responseText;
                            formCheck("email");
                        }
                        else {
                            document.getElementById(id).innerHTML = httpObj.responseText;
                        }
                        return;																											
                    }																														
                };																															
                httpObj.open('POST', url, true);																					
                httpObj.send(null);																										
            }
            
            function formCheck(id){
                if(id!="email"){
                    input = document.getElementById(id);
                    if(input.value != "") document.getElementById("img"+id).style.visibility='visible';
                    else document.getElementById("img"+id).style.visibility='hidden';	
                }
                if ((document.getElementById("naam").value != "") && 
                    
                    (document.getElementById("tel").value != "") && 
                    
                    (document.getElementById("imgemail").style.visibility != "hidden") &&
                    
                    (document.getElementById("bericht").value != "")
                   ) 
                    {
                        document.getElementById("knopje").disabled = false;
                        document.getElementById("melding").style.visibility = 'hidden';
                }
                else {
                    document.getElementById("knopje").disabled = true;
                    document.getElementById("melding").style.visibility = 'visible';
                }
            }
        </script>
        <script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-27721244-1']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>


<SCRIPT SRC='HTTPS://WWW.GOOGLE.COM/RECAPTCHA/API.JS'></SCRIPT> 


</head>

<body class="oneColFixCtrHdr">

<div id="container">

  <div id="header">
  <a href="index.html"><img src="images/plingwebdesign3.png"/><img src="images/Index.png" style="margin-bottom:2px" /></a>
  <a href="webdesign.html"><img src="images/Webdesign.png" style="margin-bottom:2px"/></a>
  <a href="portfolio.html"><img src="images/Portfolio.png" style="margin-bottom:2px"/></a>
  <a href="contact.php"><img src="images/Contact.png" style="margin-bottom:2px"/></a>

  </div>
<!-- end #header -->


  <div id="mainContent">
<div class="image_viewer"><img src="images/plinglogo2.png"/></div>
 
<!--<h1>Pling Contact</h1>-->
   
   <td width="200" valign="top"><dt><h1>Pling Contact</h1></dt>


<?php
if($_POST['verstuur']=='ja') {
$html_body = '
<table border="0" style="font-family:arial;font-size:15px;height:200px;" width="200">
<tr>
<td colspan="2"><p style="font-family:arial;font-size:15px;"><b>Contactformulier</b></p></td>
</tr>
<tr>
<td width="40%">Naam</td>
<td width="60%">'.$_POST['naam'].'</td>
</tr>
<tr>
<td width="40%">Telefoon nummer</td>
<td width="60%">'.$_POST['tel'].'</td>
</tr>
<tr>
<td width="40%">E-mailadres</td>
<td width="60%">'.$_POST['email'].'</td>
</tr>
<tr>
<td width="40%">Bericht</td>
<td width="60%">'.$_POST['bericht'].'</td>
</tr>
';
	
$to = "[email protected]";

$subject = "Contactformulier";

$mime_boundary = "----Pling Webdesign----".md5(time());

$headers =  "From: ".$_POST['Pling Webdesign']." <[email protected]>\n";
$headers .= "MIME-Version: 1.0\n";
$headers .= "Content-Type: multipart/alternative; boundary=\"$mime_boundary\"\n";

# -=-=-=- TEXT EMAIL PART

$message = "--$mime_boundary\n";
$message .= "Content-Type: text/plain; charset=UTF-8\n";
$message .= "Content-Transfer-Encoding: 8bit\n\n";

$message .= strip_tags($html_body);

# -=-=-=- HTML EMAIL PART

$message .= "--$mime_boundary\n";
$message .= "Content-Type: text/html; charset=UTF-8\n";
$message .= "Content-Transfer-Encoding: 8bit\n\n";

$message .= "<html>\n";
$message .= "<body>\n";
$message .= $html_body;
$message .= "</body>\n";
$message .= "</html>\n";

# -=-=-=- FINAL BOUNDARY

$message .= "--$mime_boundary--\n\n";

# -=-=-=- SEND MAIL
 
mail( $to, $subject, $message, $headers );
echo "<p>Ik neem zo snel mogelijk contact met u op.</p>";
} else {
	?>
    <!--Neem dan via onderstaand formulier contact op.-->
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
    <input type="hidden" name="verstuur" value="ja" />
    <div><label for="naam1" class="label" style="float:left; width:160px;color:#FFF;font-size:17px;margin-left:130px;">Uw (Bedrijfs-)Naam:</label><input type="text" name="naam" id="naam" onkeyup="formCheck(this.id)" onblur="formCheck(this.id)" maxlength="45" style="margin-left:10px;"/>&nbsp;&nbsp;<img src="images/vinkje.png" style="visibility:hidden;" height="15" id="imgnaam" width="15" alt="" /></div>
    
 
    <div><label for="tel" class="label" style="float:left; width:100px;color:#FFF;font-size:17px;margin-left:130px;">Tel nr.:</label><input type="text" name="tel" id="tel" onkeyup="formCheck(this.id)" onblur="formCheck(this.id)" maxlength="16" style="margin-left:70px;" />&nbsp;&nbsp;<img src="images/vinkje.png" style="visibility:hidden;" height="15" id="imgtel" width="15" alt="" /></div>
    
    <div><label for="email" class="label" style="float:left; width:100px;color:#FFF;font-size:17px;margin-left:130px;">E-mailadres:</label><input type="text" name="email" id="email" onkeyup="ajax('email.php?email='+this.value,this.id)" onblur="ajax('email.php?email='+this.value,this.id)" maxlength="45" style="margin-left:70px;" />&nbsp;&nbsp;<img src="images/vinkje.png" style="visibility:hidden;" height="15" id="imgemail" width="15" alt="" /></div>

    <div><label for="bericht" class="label" style="float:left; width:100px;color:#FFF;font-size:17px;margin-left:130px;">Bericht:</label><textarea name="bericht" id="bericht" onkeyup="formCheck(this.id)" onblur="formCheck(this.id)" style="margin-left:70px;" /></textarea>&nbsp;<img src="images/vinkje.png" style="visibility:hidden;" height="15" id="imgbericht" width="15" alt="" /></div>
    <br clear="all" />
    
 
       <DIV CLASS="G-RECAPTCHA" DATA-SITEKEY="hier de data sitekey"></DIV>   
        
    
    <p style="color: #f00;margin-left:140px;margin-top:-120px;" id="melding">Als alle velden ingevuld zijn, kan het formulier verzonden worden.</p>
  <input type="submit" value="Verzenden" name="knopje" id="knopje" disabled="disabled" style="margin-left:140px;" />
  
  
</form>


<? } ?>

                    
                    </td>
  </tr>
  
</table>
</div>

    
    
    
   


<!-- end #mainContent -->
    
    <div id="footer">
    <img src="images/naw2.png"/>
    
   </div>
    <!-- end #footer -->
    
<!-- end #container --></div>
</body>

</html>


Misschien even op lijn 166 de sitekey invullen?
Dat heb ik gedaan en dan gebeurd er niets.

[size=xsmall]Toevoeging op 25/03/2015 11:57:43:[/size]

Weet ook niet zo goed wat ik moet doen in stap 2: Server side integration
Waar volg je die stappen?

Reageren