Script de contact .css et html

Fermé
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017 - Modifié par leito666 le 8/05/2016 à 04:17
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017 - 2 août 2016 à 06:51
Bonjour ,
pour les besoins de mon site , j'ai customisé rapidement un script

( script utilisé -> https://www.sitepoint.com/style-web-forms-css/ )

pour finalement obtenir

.CSS

body {
background: grey
}

#contact input[type="text"],
#contact input[type="email"],
#contact input[type="subject"],
#contact textarea,
#contact button[type="Envoyer"] {
margin: auto 35%;
font: 400 12px/16px "Open Sans", Helvetica, Arial, sans-serif;
}

form {
position: relative;
width: 50%;
height: 100%;
margin: 4% 10%;
font-family: Tahoma, Geneva, sans-serif;
text-decoration: none;
font-style: italic;
font-weight: bold;
color: orange;
font-size: 14px;
line-height: 24px;
background: -webkit-linear-gradient(bottom, black, grey 75%);
background: -moz-linear-gradient(bottom, black, grey 75%);
background: linear-gradient(bottom, black, grey 75%);
border-radius: 14px;
padding: 6%;
border: 1px solid white;
border: inset 1px solid #333;
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
}


.HTML


<form id="contact">
<div>
<h1>Contact :</h1>
<div>

<label>
<span>Nom</span><input id="name" type="text" name="name" />
</label>
</div>

<div>
<label>
<span>Email</span><input id="email" type="email" name="email" /></label>
</div>

<div>
<label>
<span>Sujet</span><input id="subject" type="subject" name="subject" />
</label>
</div>

<div>
<label>
<span>Message</span><textarea id="feedback" name="feedback"></textarea>
</label>
</div>
<input type="button" value="Envoyer" />
</div>
</form>


( pour tester -> http://codepen.io/pen/ )

Le code correspond à mes attentes ,mais mon problème est d'intégrer mon adresse mail dans un des scripts pour la réception des messages .

Sachant que je peux utiliser uniquement .css et .html comment faire svp ?
Merci
A voir également:

11 réponses

leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par leito666 le 10/05/2016 à 00:43
Bonjour , je reviens avec une autre tentative... ( petit UP ;)
Il me semble que mon script est " relativement correct " mais sur mon blog toujours aucun résultat

le code .html

<html>
<body>

<br>

<?php
$from = "webmaster@domaine.ext";
$to = "vous@domaine.ext";

$subject = "Test fonction mail() de PHP";
$email = NULL;
$message = NULL;

if (!empty($_POST['email'])) {
$email = $_POST['email'] ;
}

if ($email && !empty($_POST['message'])) {
$message = "Message envoyé par $email :\n" . $_POST['message'];
}

if ($email && $message) {
$headers = 'MIME-Version: 1.0' . "\r\n";
$headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";

$headers .= 'From: Webmaster' . "\r\n";

if (!mail($to, $subject, $message, $headers)){
echo "Erreur: Impossible d'envoyer le mail";
} else {
echo "Envoi réussi";
}
}

else {
echo "Erreur: vous devez spécifier une adresse email valide et un texte\n";
}

$text = <font face="Arial"><h1> Texte en php ( avec .CSS )</h1><h1>dans .HTML ( $text )</h1></font>
<?>

<form action="form2mail.php" method="post">Entrez votre adresse mail:
<input type="text" name="email">

<br>

<br> Message:
<br>
<textarea name="message" rows="8" cols="50"></textarea>

<br>

<input type="submit" value="Envoyer le mail">
</form>

<br>

</body>
</html>


le code .css

h1 {
font-size: 1.8em;
color: green;
font-weight: bold;
text-align: center;
}


( pour tester -> http://codepen.io/pen/ )

..je ne vois pas d'erreur..( et connais trop peu .php )
comment faire fonctionner mon adresse mail svp ?
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
15 mai 2016 à 07:01
HELP ..
je viens de tester un autre script ... toujours pour faire fonctionner ma page " Contact " sur Blogger ( avec ou sans .php à partir du moment où cela fonctionne ...

sources --> https://www.bloggerplugins.org/2013/05/create-separate-contact-page-for-blogger.html

.HTML

<html>

<body>

<script>

// mon id sur Blogger
var blogId = '*******************';

var contactFormMessageSendingMsg ='Envoi ...';
var contactFormMessageSentMsg = 'Votre message a été envoyé.';
var contactFormMessageNotSentMsg = 'Le message n'a pas pu être envoyé. Réessayer.. ';
var contactFormEmptyMessageMsg ='le message ne peut être vide.';
var contactFormInvalidEmailMsg = 'Un email valide est nécessaire.'

var widgetLoaded=false;

function sendEmailMsg() {
if(widgetLoaded== false) {
_WidgetManager._RegisterWidget('_ContactFormView', new _WidgetInfo('ContactForm1', 'sidebar', null, document.getElementById('ContactForm1'), {'contactFormMessageSendingMsg': contactFormMessageSendingMsg , 'contactFormMessageSentMsg': contactFormMessageSentMsg , 'contactFormMessageNotSentMsg': contactFormMessageNotSentMsg , 'contactFormInvalidEmailMsg': contactFormInvalidEmailMsg , 'contactFormEmptyMessageMsg': contactFormEmptyMessageMsg , 'title': 'Contact Form', 'blogId': blogId, 'contactFormNameMsg': 'Name', 'contactFormEmailMsg': 'Email', 'contactFormMessageMsg': 'Message', 'contactFormSendMsg': 'Send', 'submitUrl': 'https://www.blogger.com/contact-form.do'}, 'displayModeFull'));

widgetLoaded=true;
document.getElementById('ContactForm1_contact-form-submit').click();
}
return true;
}
</script>

<form name='contact-form'>
<div>Nom : </div>
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' type='text' value='' />
<div>Email: <em>(nécessaire)</em></div>
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' type='text' value='' />
<div>Message: <em>(nécessaire)</em></div>
<textarea class='contact-form-email-message' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<p></p>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' type='button' value='Send' onclick="sendEmailMsg()" />
<div style='text-align: center; max-width: 450px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>

</body>

</html>




( pour tester-> http://codepen.io/pen/ )
0
dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021 1 451
15 mai 2016 à 07:14
Bonjour,

Il faut utiliser du PHP, ce n'est pas possible avec seulement du HTML.
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par leito666 le 15/05/2016 à 08:32
bonjour dugenou ,
J'utilisse .php dans mon 2ème exemple -- > https://forums.commentcamarche.net/forum/affich-33491031-script-de-contact-css-et-html?login=1#1
.. mon script .php fonctionne dedans .html mais aucun résultat avec mon blog ...une idée svp ?

.php dans Blogger est-il possible avec ou sans un hébergeur ?

..si oui ( sans hébergeur ) , comment ?
..si oui ( avec hébergeur ) où le trouver pour mon fichier .php ?

merci
0
dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021 1 451 > leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
15 mai 2016 à 08:22
Il faudrait déjà être sûr que Blogger accepte du PHP, je n'en suis pas certain.
Comme je te l'ai dit dans un autre post, il existe un gadget "Formulaire de contact" pour Blogger.
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017 > dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021
Modifié par leito666 le 15/05/2016 à 08:54
il me semble pas que ce soit possible justement ...
( sauf si il est intégré dans du .html )

Le problème avec le gadget est qu'il apparaît partout ( j'ai déjà testé .. ) et moi j’utilise des pages " virtuel " ( quand on clique sur un bouton il n'y a pas de chargement de page dans l'onglet mais l'adresse change quand même ) ..et j'en ai besoin que sur une seul page ..

tout ce passe avec un seul article ( .html +.css ) ,
Il n'y a "aucune page" ..

mon blog --> http://blackpanthersnapi.blogspot.com/
( en cours de création..)
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
15 mai 2016 à 10:08
j'avais une autre idée mais je ne sais pas si il est éventuellement possible d'héberger sur un site le script .php , pour pouvoir l'utiliser avec Blogger ..?
( ..et si oui ..où ? )

Merci encor Dugenou :)
0
dugenou Messages postés 6087 Date d'inscription mercredi 19 janvier 2005 Statut Contributeur Dernière intervention 30 juillet 2021 1 451 > leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
15 mai 2016 à 10:20
Je ne sais pas si c'est possible chez Blogger, tu peux essayer d'insérer une page en utilisant, soit une iframe, soit la balise object.
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
27 juin 2016 à 00:17
Bonjour :)

je reviens avec une autre tentative ( plus le logiciel " BlueFish " )

sources pour le script contact avec .php--> http://www.freecontactform.com/email_form.php

mais même après avoir modifié :
$EmailFrom = "chriscoyier@gmail.com";
$EmailTo = "CHANGE-THIS@YOUR-DOMAIN.com";


en
$EmailFrom = "mon@mail.fr";
$EmailTo = "domain@mail.fr";

...

( ..et après enregistrement )
la page s'affiche correctement mais impossible d'envoyer un message ..une fenêtre s'ouvre et me demande d'ouvrir ( ou d'enregistrer ) " contactengine.php "

http://img15.hostingpics.net/pics/314600Capturedu20160626233450.png

est-ce normal ( sachant que j'utilise "Bluefish" ) ..?
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
jordane45 Messages postés 38319 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 30 novembre 2024 4 706
27 juin 2016 à 02:11
Bonsoir,

Vu l'url qui apparait dans ton navigateur ........ oui.... c'est normal !
Pour fonctionner... le php a besoin d'un serveur......
Vu que tu travailles en LOCAL sur ton ordi ... tu dois installer un logiciel comme WAMP ou XAMPP ou EASYPHP ou sur mac.. tu as par exemple : MAMP.

Une fois le logiciel installé et pret à fonctionner ( l'icone doit être verte et/ou les services APACHE et MYSQL lancés) ... tu pourras passer par l'url : LOCALHOST
(bien entendu tu auras au préalable placé les fichiers de ton site dans le répertoire adéquat (www sous wamp et easyphp, htdocs pour xampp ...etc....)
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par leito666 le 27/06/2016 à 04:30
re ,je viens d'installé LAMPP ( XAMPP sur Ubuntu )

mais quand je le lance

$ sudo lampp start
Starting XAMPP for Linux 1.4.12...
XAMPP: Another web server daemon is already running.
XAMPP: Starting MySQL...
XAMPP: Starting ProFTPD...
nohup: redirection de la sortie d'erreur standard vers la sortie standard
XAMPP for Linux started.

..et puis rien

( ..j'ai aussi FileZilla , qui est à l’arrêt...au moins en mode graphique.. )
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par leito666 le 3/07/2016 à 20:34
j'ai laisser tomber XAMPP ..il y a manifestement beaucoup de problème ..

j'ai donc installé mysql phpmyadmin
( libjs-jquery-ui-docs / libmcrypt-dev / mcrypt recommandé par le terminal .. )

et bonne nouvelle ça marche...mais mcrypt semble probablement pas être configuré

http://img15.hostingpics.net/pics/854758Capturedu20160629142636.png
<< Il manque l'extension mcrypt . Veuillez vérifier votre configuration PHP . >>


__ j'ai réussi à éditer le fichier
sudo nano /etc/php5/mods-available/mcrypt.ini

http://img15.hostingpics.net/pics/832432Capturedu20160630034858.png


Après j'ai relancé Apache
sudo /etc/init.d/apache2 restart

http://img15.hostingpics.net/pics/778801Capturedu20160630035052.png


__ J'ai aussi créer le fichier test.php
gksudo nautilus

dans var/www/html
clique droit " nouveau document " ( donc avec les droits )

édition du document avec :

<?php
phpinfo();
?>


après avoir enregistré j'ai fais " localhost/test.php " dans le navigateur
http://img15.hostingpics.net/pics/150675Capturedu20160630123928.png


mais le problème reste le même ..
http://img15.hostingpics.net/pics/834425Capturedu20160630035202.png
<< Il manque l'extension mcrypt . Veuillez vérifier votre configuration PHP . >>

une idée s'il vous plaît ?
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
10 juil. 2016 à 02:36
la réponse à ma dernière question de ce sujet :
https://forums.commentcamarche.net/forum/affich-33687554-phpmyadmin-il-manque-l-extension-mcrypt#8


Je dois maintanant trouver comment faire fonctionner un simple formulaire de contact
..plus précisément ,où dois-je le mettre ?

sinon pour les sources des scripts de " formulare contact " avec un code .html puis .php --> http://www.freecontactform.com/email_form.php

Je dois bien changer les lignes :

$EmailFrom = "chriscoyier@gmail.com";
$EmailTo = "CHANGE-THIS@YOUR-DOMAIN.com";

en :

$EmailFrom = "monadress@mail.fr";
$EmailTo = "mondomain@mail.fr";

..???
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par leito666 le 13/07/2016 à 14:00
Bonjour à tous ,

Je reviens vers vous avec d'autres questions :D
Après quelques tutos je suis de nouveau bloqué..

donc petit récapitulatif :
installation phpmyadmin , php5-mcrypt ....etc
jusqu'à là tout est ok

dans phpmyadmin j'ai réussi comment créer une base de données ( avec interclassement " uft8_general_ci " )

Puis j'ai fais une table ( nomé " clients " ) pour " identifier " les futures membres . Ces informations vont uniquement servir au formulaire de contact

Ma table a cinq colonnes ( en prévision ) :

_ idClient int(11) AUTO_INCREMENT
_ emailClient varchar(255) utf8_general_ci
_ pseudoClient varchar(20) utf8_general_ci
_ passwordClient text utf8_general_ci
_ infoClient date


infoClient ( "date" ) devrai me servir ( enfin j’espère... ) à pouvoir renseigner sur le profil la date d'inscription .
donc si j'ai fait une boulette merci de m'le dire :)
http://img15.hostingpics.net/pics/678167Capturedu20160713124441.png

Puis je me suis penché sur un petit code que j'ai placé dans
le dossier " var/www/html "

Dans un premier temps j'ai supprimé " test.php "

et j'ai remplacé par " formulaire_de_contact.php "
<?php
$action=$_REQUEST['action'];
if ($action=="") /* display the contact form */
{
?>
<form action="" method="POST" enctype="multipart/form-data">
<input type="hidden" name="action" value="submit">
Your name:<br>
<input name="name" type="text" value="" size="30"/><br>
Your email:<br>
<input name="email" type="text" value="" size="30"/><br>
Your message:<br>
<textarea name="message" rows="7" cols="30"></textarea><br>
<input type="submit" value="Send email"/>
</form>
<?php
}
else /* send the submitted data */
{
$name=$_REQUEST['name'];
$email=$_REQUEST['email'];
$message=$_REQUEST['message'];
if (($name=="")||($email=="")||($message==""))
{
echo "All fields are required, please fill <a href=\"\">the form</a> again.";
}
else{
$from="From: $name<$email>\r\nReturn-path: $email";
$subject="Message sent using your contact form";
mail("mon@mail.fr", $subject, $message, $from);
echo "Email sent!";
}
}
?>

( NE PAS OUBLIER DE CHANGER L'ADRESSE .. et indiquer l'adresse pour recevoir les mail )
mail("mon@mail.fr"......... 



puis dans mon navigateur
localhost/formulaire_de_contact.php

http://img15.hostingpics.net/pics/817411Capturedu20160713131535.png

Après l'avoir complété le message est bien envoyé
http://img15.hostingpics.net/pics/980630Capturedu20160713131710.png
..mais ma boite mail reste vide..

je me demande si c'est parce-que je suis en local..? si oui comment faire autrement..?
et surtout où mettre ce code ? dans phpmyadmin ? dans une table ? dans une colonne ?

j'ai un hébergeur pour mon site que j'ai commencé a mettre en ligne grâce à Filzilla ( avec du .html et du .css ) ..mais manifestement quand j'envoi le script ( php ) le site ignore le fichier
( sûrement car " formulaire_de_contact.php " est non spécifié dans mon script .html ..? )

bref je n'arrive pas à recevoir de mail.. une idée s'il vous plaît ?



Ps: impossible de renommer le titre du sujet ..
( " formulaire de contact " serai plus approprié ,merci )
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par leito666 le 17/07/2016 à 20:32
problème à moitié résolu :)

J'ai installé Postfix
https://www.digitalocean.com/community/tutorials/how-to-install-and-configure-postfix-as-a-send-only-smtp-server-on-ubuntu-14-04

Aucun problème pour l'envoi des mail avec le terminal ..

echo "Contenue-du-mail" | mail -s "subject " monadresse@mail.fr

ou
echo "Contenue-du-mail" | mail -s "subject " root


ou avec le navigateur " localhost/formulaire_de_contact.php " je reçoit mes mail
( dans les spam.. )

mais je ne sais pas comment rendre le code " formulaire_de_contact.php " effectif avec mon hébergeur .
Actuellement j'utilise .html5 et .css3 ( reponsive ) mais comment permettre le script .php d'être pris en compte dans mon site ?

en claire j'essaye de comprendre .. comment permettre le(s) code(s) php d'être reconnu pour mon code ("principal") html ?

<head>
<link href="script.css" media="screen,all" rel="stylesheet" type="text/css"></link>
<!-- ??? ="code1.php" ??? -->
<!-- ??? ="code2.php" ??? -->
<!-- ??? ="code3.php" ??? -->
</head>


pour pouvoir enfin envoyer mon script " formulaire_de_contact.php " dans mon hebergeur ( avec Filezilla ) et que celui ci puisse fonctionner dans mon site hébergé comme avec localhost ou le terminal .
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par leito666 le 1/08/2016 à 23:18
Question toujours sans réponse..

Comme çà peut-être ? :

<head>
<link href="script.css" media="all" rel="stylesheet" type="text/css"></link>
<?php include("code1.php"); ?>
<?php include("code2.php"); ?>
<?php include("code3.php"); ?>
</head>


( pour permettre les scripts php ( "code1.php" , "code2.php" , "code3.php" ) d'être reconnu pour mon code html .. )
0
leito666 Messages postés 74 Date d'inscription mercredi 18 avril 2012 Statut Membre Dernière intervention 15 octobre 2017
Modifié par bg62 le 4/08/2016 à 19:15
Comme çà peut-être ? :

..oui ^^

En local ( avec une adresse mail valide.. ) je reçoit les mails émis ,
mais pas avec mon site


Les scripts du Formulaire de contact :

index.html
<html>
<head>
<?php include("index.php"); ?>
</head>
</html>


index.php
<?php
$action=$_REQUEST['action'];
if ($action=="") /* display the contact form */
{
?>
<form action="" method="POST" enctype="multipart/form-data">
<input type="hidden" name="action" value="submit">
Your name:<br>
<input name="name" type="text" value="" size="30"/><br>
Your email:<br>
<input name="email" type="text" value="" size="30"/><br>
Your message:<br>
<textarea name="message" rows="7" cols="30"></textarea><br>
<input type="submit" value="Send email"/>
</form>
<?php
}
else /* send the submitted data */
{
$name=$_REQUEST['name'];
$email=$_REQUEST['email'];
$message=$_REQUEST['message'];
if (($name=="")||($email=="")||($message==""))
{
echo "All fields are required, please fill <a href=\"\">the form</a> again.";
}
else{
$from="From: $name<$email>\r\nReturn-path: $email";
$subject="Message sent using your contact form";
mail("MONADRESSE@MAIL.FR", $subject, $message, $from);
echo "Email sent!";
}
}
?>



Une idée svp ?
0