CSS - index.html emailformulier werkt niet

bron · 2 nov 2018

Je verwijst naar mailer.php, en die heeft blijkbaar geen layout.
Ikzelf raad aan om het hele script met zowel formulier als afhandeling in één bestand te hebben.

Oplossingen
1. In mailer.php heb ik onderaan een minimale html template gezet. Femke98, je kan jouw template in de de <body> van deze 'lege' html zetten.
2. Voorstel van php4u (alles in 1 bestand) maar het geeft bij method="post" een irritante melding als je de pagina ververst (F5), zie plaatje, en daardoor dubbele emails.
3. Bij een one-page website is Ajax Send dé oplossisng. Hierbij wordt in de achtergrond het formulier naar mailer.php gestuurd en die geeft na het versturen van de email het resultaat terug aan index.php. Je blijft dus altijd op index.php en krijgt geen lege pagina te zien. Ik zal morgen even kijken.

Linkjes zijn op elke pagina op elke website toegestaan. Linkjes zijn voor Google een goede manier om te achterhalen hoe je webiste in elkaar steekt. Google kan dit ook op andere manieren achterhalen, bijvoorbeeld met een sitemap.xml of sitemap pagina. In ieder geval zijn linkjes op een website belangrijk. In dit geval kan Google het linkje niet vinden omdat Google de pagina 'mailer.php' niet kan vinden.

Aar · 3 nov 2018

Ajax is inderdaad een vriendelijke methode. Maar om terug te komen op puntje 2 van Bron.
Als de mail succesvol verstuurd is kan je daarin beter redirecten met een location-header() naar een GET request, zoals ?status=verzonden.

Als iemand op 'back' drukt komt diegene weer terug op het formulier, en wordt de verzendingspoging niet herhaald, omdat de POST-request na de vorige doorsturing verdwenen is.

femke98 · 3 nov 2018

Waarom zou je niet mogen linken? Apart...? Bugje hier?

Ooit hier een rood bericht gezien bovenaan een topic dat je geen linken meer mocht plaatsen in verband met de privacy.
Jammer dat ik er geen screenshot van gemaakt heb.

link is dus: http://wptest123.nl

De 4 menu's hebben geen aparte naam in de browser (dus geen wptst123.nl/contact) omdat het een one-page template is.

1. In mailer.php heb ik onderaan een minimale html template gezet. Femke98, je kan jouw template in de de <body> van deze 'lege' html zetten.

Het hele gebeuren? Dus de inhoud van index.html moet ik daarin zetten?

Heb even gekeken naar dat ajax gebeuren, maar dat is echt boven mijn pet.
https://blog.teamtreehouse.com/create-ajax-contact-form

Tjee, wist niet dat een simpel contactform zoveel zou uithalen zeg. Een plug-in in WP is toch makkelijker hahahahaha!

femke98 · 3 nov 2018

Oké, weer wat verder.

Mijn index.html in de <body> gezet en zie daar, ik vul het formulier in en verzend het. Dan kom ik gelijk terug naar de website, maar zonder melding dat het is verzonden.

Klik ik op F5 om te verversen krijg ik dit te zien:

Nu kan je wel alles doen op de website zonder te verversen, maar wilde dat toch even uitproberen.
We zijn er dus bijna!!

Edit: zag deze topic: https://www.helpmij.nl/forum/showth...ontact-formulier-bericht-als-het-is-verzonden
Kan ik dit niet gebruiken?

Aar · 3 nov 2018

Ja, dat gaat via AJAX, en is een mooie oplossing.

bron · 3 nov 2018

De oplossing van php4u uitgewerkt waarbij PHPMailer en html gescheiden zijn.

In 'mailer.php' het volgende:
- alle html onder de ?> weghalen.
- onderaan dit vervangen door deze code:

Code:

        // verstuur de email en controleer op fouten
        if (!$mail->send()) {
            $msg = '500';
        } else {
            $msg = '200';
        }
    } else {
        $msg .= '400';
    }
} else {
    $msg .= '400';
}

// redirect naar index.php met get status
header("Location: index.php?status=" . $msg);
exit();

?>

en in 'index.php' zet je ergens in de buurt van het formulier het resultaat

Code:

<p><?php
if (isset($_GET["status"])) {
  if ($_GET["status"] == "200")     echo "Bericht is met success verzonden.";
  elseif ($_GET["status"] == "400") echo "Eén of meer velden onjuist ingevuld.";
  elseif ($_GET["status"] == "500") echo "Door een storing geen bericht verstuurd.";
} 
?></p>

Nadeel is bij deze oplossing dat de resultaat melding bij het verversen blijft staan omdat de ?status=... in de adresbalk blijft staan.
Dit is wel op te vangen met Javascript, bijvoorbeeld door te kijken of de formuliervelden leeg zijn, maar ik denk dat een ajax oplossing netter is.

De ajax oplossing kom ik op terug.

femke98 · 3 nov 2018

Wat zijn jullie toch lief!!

Maar wat een gedoe! Ik zat te denken, is het niet veel makkelijker als ik een subdomein aanmaak en daar WP opzet en daar een contactform op maak? En dan het menu Contact laten doorlinken?

bron · 4 nov 2018

In de bijlage jouw template met email verzending via ajax.
Na het verzenden wordt het resultaat boven het contactformulier getoond.
In 'mailer.php' staan de gegevens voor smtp van versio. Controleer de andere gegevens ook even.
Noot: misschien vereist versio dat je $mail->setFrom verandert in een emailadres van je eigen domein.,

Net als de vorige keer nu ook weer de juiste bestanden in mapje 'src' en in mapje 'language' kopieren.

Heb ook de header foto in het midden gezet

Laat het even weten als je een vraag hebt.

bron · 4 nov 2018

Maar wat een gedoe! Ik zat te denken, is het niet veel makkelijker als ik een subdomein aanmaak en daar WP opzet en daar een contactform op maak? En dan het menu Contact laten doorlinken?

Een browser vindt dit niet fijn want het hoofddomein is https en het subdomein is http. Ik ga er vanuit dat je standaard SSL hebt.

femke98 · 4 nov 2018

Heb ook de header foto in het midden gezet

Je bent ijverig geweest maar iets te overijverig

(hahaha, moet opeens aan die reclame denken van die shampoo waar moeders iets te veel boost of glans krijgen of te veel gaan stralen !! In dit geval dus iets te overijverig wordt! Sorry hiervoor.....

komt opeens in mij op hahahaha.
)
Want de header (logo) moet niet in het midden, die gaat namelijk van rechts naar links als je op de homepage bent en je klikt een nieuw menu item. Daarna blijft hij links staan en gaat weer terug als je naar home gaat.
Dat is juist zo leuk!

Even kijken hoe je dat gedaan hebt, dan kan ik dat er weer uithalen.

Voor de rest ga ik er even voor zitten. Mijn dank is al groot, maar zal groter zijn als het allemaal gaat werken.

femke98 · 4 nov 2018

Yes, ik heb een vraag.

Ik heb alles gedaan wat je zei dat ik moest doen, maar krijg dit als ik het form invul:

Mail komt wel aan!

bron · 4 nov 2018

Want de header (logo) moet niet in het midden

Ah, ik had mijn browser te smal staan (smaller dan 1475px), dan gebeurt er dit en dat had ik aangepast zonder op het schuiven te letten

Even kijken hoe je dat gedaan hebt

Boven bij <style> dit aanpassen, of gewoon deze 2 weghalen.
/* .logo-holder { .... } */
/* .logo-holder a img { .... } */

De index.php is dat een vervanging voor de index.html

Ja, index.php is jouw template, aangevuld met een paar kleine dingen

Of moet die index.html ook dezelfde inhoudt krijgen als de index.php

Nee, index.html gewoon weghalen van de website (of je noemt 'm index.html.vervallen ofzo).

maar krijg dit als ik het form invul {"name": "200", ..... }

Zie jouw plaatje. Het formulier is goed ingevuld (elk veld 200 = validatie OK). Je hebt de email ontvangen (score 200 = email verstuurd).
- Heb je 'index.html' verwijdered of van naam veranderd?
- Heb je 'jquery.ajax.mailer.js' geupload in de map waar index.php staat?

Ik zal als ik antwoord heb op deze 2 vragen even kijken waarom dit gebeurt, bij mij heb ik het lokaal op m'n pc getest en dat werkt.
We zijn op weg. Email komt binnen en je hebt geen lege pagina meer. Nog een klein hebbeltje weghalen.

femke98 · 4 nov 2018

Boven bij <style> dit aanpassen, of gewoon deze 2 weghalen.
/* .logo-holder { .... } */
/* .logo-holder a img { .... } */

Het logo is al veranderd, ik zag hoe je het had gedaan. Dus dat is in orde.

Heb je 'index.html' verwijdered of van naam veranderd?
Heb je 'jquery.ajax.mailer.js' geupload in de map waar index.php staat?

De index.html heb ik van naam veranderd, omdat ik er al achter kwam dat deze niet hoeft. Hij heeft nu indexoud.html
Maar ook voor deze naamsverandering kreeg ik deze melding in de browser (lege pagina verder) en in de browser stond wptest123.nl/mailer.php
Ik krijg dus een nieuwe lege pagina (zonder opmaak website) met die melding.

De jquery.ajax heb ik gezet waar ook de index.php staat.
Zie screenshot

bron · 4 nov 2018

Maar ook voor deze naamsverandering kreeg ik deze melding in de browser (lege pagina verder)

- Controleer nog een keer de mapindeling hieronder
- Laat andere bestanden in de root niet eindigen op .html of .php
- Als dit klopt ga je naar www.wptest123.nl en ververs je de pagina met Ctrl + F5 (misschien Ctrl + R bij Firefox)

Code:

root
 |
 +--PHPMailer--+--language (zelf bestanden in kopieren)
 |             +--src (zelf bestanden in kopieren)
 +--index.php
 +--jquery.ajax.mailer.js
 +--mailer.php

Aar · 4 nov 2018

bron zei:
Een browser vindt dit niet fijn want het hoofddomein is https en het subdomein is http. Ik ga er vanuit dat je standaard SSL hebt.

Je kan bij de meeste hostings ook een apart certificaat aanmaken voor een subdomein.

Een wildcard certificaat is nog handiger, maar in de praktijk toch lastiger te realiseren.

bron · 4 nov 2018

Ik heb net een berichtje op je website verstuurd en alles werkt OK. Ik krijg de melding "Uw bericht is verstuurd"

bron · 4 nov 2018

Je kan bij de meeste hostings ook een apart certificaat aanmaken voor een subdomein

Ah, wist ik niet. Zelf heb ik geen subdomein en het nog nooit in het control panel nagezocht. Is het dan gewoonlijk inbegrepen in de prijs van het hosting pakket?

bron · 4 nov 2018

@femke, ik denk dat je zelf het foutje van mij in index.php gevonden hebt

Code:

<script src="http://www.home.lan/abc/ajaxmail/jquery.ajax.mailer.js"></script>

moet dit zijn

<script src="jquery.ajax.mailer.js"></script>

Sorry, na een tijdje zie je letters dansen

Aar · 4 nov 2018

bron zei:
Ah, wist ik niet. Zelf heb ik geen subdomein en het nog nooit in het control panel nagezocht. Is het dan gewoonlijk inbegrepen in de prijs van het hosting pakket?

Dat ligt eraan. Als je Let's Encrypt is wat velen aanbieden, dan is het altijd gratis.

bron · 4 nov 2018

Als je Let's Encrypt is wat velen aanbieden, dan is het altijd gratis.

Even gekeken in m'n control panel. Daar kan ik kiezen tussen gratis Let's Encrypt (heb ik in gebruik), betaald Comodo ssl (standaard of wildcard of extended), of eigen ssl/tls certificates. Let's Encrypt en Comodo zijn one-button installers.

Dit vinkje staat aan bij Let's Encrypt:
[x] Include a "www" subdomain for the domain and each selected alias (e.g. www.example.nl)

Volgens Help betekent dit:
You can secure Plesk and the mail server, as well as any hosted domains, subdomains, and domain aliases.

Duidelijkheid voor mij, thanx.

CSS - index.html emailformulier werkt niet

Moderator

Inventaris

Meubilair

Meubilair

Inventaris

Moderator

Meubilair

Moderator

Bijlagen

Moderator

Meubilair

Meubilair

Moderator

Meubilair

Moderator

Inventaris

Moderator

Moderator

Moderator

Inventaris

Moderator

Wij waarderen jouw privacy