2 Thema. Kontaktformular + TimeLine Ende

Rule of Logic

Tagchen,

Ich habe 2 Probleme.

Nr.1) wäre das mein Kontaktformular den Geist aufgegeben hat. Ich bekomme keine Emails mehr auf der angegeben Email Adresse.

Meine Frage wäre dann: Brauch ich einen Mail-Server dafür?

Nr2.) wäre das ich es nicht hin bekomme das meine TimeLine auf der Seite immer den Strich weiter zieht und ich eben am Ende keinen mehr haben möchte, da dann eben die TimeLine aufhören soll.

Vorab vielen Dank für die Hilfe,

Lg Rule

Arne Drews

Warum postest Du die relevanten Dinge nicht hier rein, anstatt einen Anhang zu präsentieren?

Es fallen einige Helfer hier aus, die ähnlich wie ich keine Anhänge runterladen.

Rule of Logic

HTML

<section id="about">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading text-uppercase">News</h2>
<h3 class="section-subheading text-muted">Hier wird &WCF_AMPERSANDüber alle Neuigkeiten / Events berichtet.</h3>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<ul class="timeline">

<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/tod66.png" alt="">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>25.08.2018</h4>
<h4 class="subheading">Erneutes Kill-Event</h4>
</div>
<div class="timeline-body">
<p class="text-muted"> Am kommenden Samstag, den 25.08.18 wird es ein weiteres Kill-Event geben, bei dem Ihr die Person sein m&WCF_AMPERSANDüsst, die die meisten Kills macht. Ihr werdet an dem Tag mit jeweils zwei anderen Usern in einen Channel gemovet, wo das Event dann beginnt, wobei Ihr vorerst in dem Event-Warteraum erscheinen m&WCF_AMPERSANDüsst, wenn Ihr Lust habt mitzumachen. Wie bei jedem Event gibt es f&WCF_AMPERSANDür die ersten 3 Pl&WCF_AMPERSANDätze wieder diverse Pr&WCF_AMPERSANDämien wie z. B. VIP+ usw. Weitere Informationen gibt es in der Channelbeschreibung des Channels "Event -> Samstag 25.08.18 Uhr KILLEVENT".   </p>
</div>
</div>
</li>


<li class="timeline-inverted">
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/score1.png" alt="YouTuber">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>10.08.2018</h4>
<h4 class="subheading">Punktestand</h4>
</div>
<div class="timeline-body">
<p class="text-muted"> Ab heute dem 10.08.18 k&WCF_AMPERSANDönnt Ihr Euren Score bei dem Weekend Event einsehen. Der Punktestand jedes Spielers wird im Laufe des Tages dauerhaft geupdated, sofern Ihr Euch auf dem TeamSpeak befindet, also keine Sorge, sofern Dein Score nicht direkt mit Deinen Wins/Kills &WCF_AMPERSANDübereinstimmen sollte. Klicke <a href="http://www.fortnite-ts3.com/weekend.php">HIER</a> um dein Score einzusehen. </p>
</div>
</div>
</li>

<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/weekend.png" alt="">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>09.08.2018</h4>
<h4 class="subheading">Weekend Event</h4>
</div>
<div class="timeline-body">
<p class="text-muted"> Neues Special Event
Am 10.08.18 findet ein neues Event, welches mehrere Tage lang andauert, auf unserem Teamspeak statt. Teilnahmebedingungen und Informationen findest du <a href="http://www.fortnite-ts3.com/weekend.html">HIER</a></p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/youtube.png" alt="YouTuber">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>17.07.2018</h4>
<h4 class="subheading">Neue Promotion</h4>
</div>
<div class="timeline-body">
<p class="text-muted"> Heute ist der YouTuber <a href="https://www.youtube.com/channel/UC4X1GLByRY4GVPaEEJTy6Og">ERROX</a> unserer Promotion beigetreten. Wir hoffen auf eine gute gemeinsame Zeit mit vielen tollen Community Events und mehr! </p>
</div>
</div>
</li>
<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/Fortnitecheck.png" alt="">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>16.07.2018</h4>
<h4 class="subheading">Fortnitecheck.de</h4>
</div>
<div class="timeline-body">
<p class="text-muted"> Ab heute k&WCF_AMPERSANDönnt ihr &WCF_AMPERSANDüber der Webseite <a href="http://Fortnitecheck.de/">Fortnitecheck.de</a> eure Punkte checken, um zu sehen wv. Punkte ihr ben&WCF_AMPERSANDötigt um auf die Banner Toplist zu gelangen. Voraussetzung: Ihr m&WCF_AMPERSANDüsst eingerankt werden [hierf&WCF_AMPERSANDür ben&WCF_AMPERSANDötigt ihr jeweils in Solo, Duo und Squad 15 Matches.</a></p>
</div>
</div>
</li>

<li class="timeline-inverted">
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/topplayer.png" alt="TopPlayers">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>14.07.2018</h4>
<h4 class="subheading">Top Players</h4>
</div>
<div class="timeline-body">
<p class="text-muted"> Ab jetzt werden die besten Spieler des TeamSpeak3 Servers oben rechts im Banner erw&WCF_AMPERSANDähnt. [Voraussetzung zum ein ranken: 15 Matches in Solo, Duo und Squad.] Zudem k&WCF_AMPERSANDönnen die Spieler Ihre Punktzahl einsehen, um zu wissen wie viele Punkte sie ben&WCF_AMPERSANDötigen, um ein Platz aufzusteigen. </p>
</div>
</div>
</li>
<li>
<div class="timeline-image">
<img class="rounded-circle img-fluid" src="img/about/%C3%BCberleben.png" alt="">
</div>
<div class="timeline-panel">
<div class="timeline-heading">
<h4>07.07.2018</h4>
<h4 class="subheading">1vs1 Event</h4>
</div>
<div class="timeline-body">
<p class="text-muted"> Am 07.07.2018 findet ein einzigartiges Event statt! Das erste mal bei uns gibt es ein 1 vs 1 Event. Zu Gewinnen gibt es unter anderem V-Bucks, VIP-R&WCF_AMPERSANDänge und vieles mehr. Weitere Informationen findest du <a href=1vs1.html>hier.</a></p>
</div>
</div>
</li>

</ul>
</div>
</div>
</div>
</section>

Alles anzeigen

das wäre die Timeline [HTML-Datei]

CSS

// Styling for the timeline section
.timeline {
position: relative;
padding: 0;
list-style: none;
&:before {
position: absolute;
top: 0;
bottom: 0;
left: 40px;
width: 2px;
margin-left: -1.5px;
content: '';
background-color: $gray-200;
}
> li {
position: relative;
min-height: 50px;
margin-bottom: 50px;
&:after,
&:before {
display: table;
content: ' ';
}
&:after {
clear: both;
}
.timeline-panel {
position: relative;
float: right;
width: 100%;
padding: 0 20px 0 100px;
text-align: left;
&:before {
right: auto;
left: -15px;
border-right-width: 15px;
border-left-width: 0;
}
&:after {
right: auto;
left: -14px;
border-right-width: 14px;
border-left-width: 0;
}
}
.timeline-image {
position: absolute;
z-index: 100;
left: 0;
width: 80px;
height: 80px;
margin-left: 0;
text-align: center;
color: white;
border: 7px solid $gray-200;
border-radius: 100%;
background-color: $primary;
h4 {
font-size: 10px;
line-height: 14px;
margin-top: 12px;
}
}
&.timeline-inverted > .timeline-panel {
float: right;
padding: 0 20px 0 100px;
text-align: left;
&:before {
right: auto;
left: -15px;
border-right-width: 15px;
border-left-width: 0;
}
&:after {
right: auto;
left: -14px;
border-right-width: 14px;
border-left-width: 0;
}
}
&:last-child {
margin-bottom: 0;
}
}
.timeline-heading {
h4 {
margin-top: 0;
color: inherit;
&.subheading {
text-transform: none;
}
}
}
.timeline-body {
> ul,
> p {
margin-bottom: 0;
}
}
}
@media(min-width:768px) {
.timeline {
&:before {
left: 50%;
}
> li {
min-height: 100px;
margin-bottom: 100px;
.timeline-panel {
float: left;
width: 41%;
padding: 0 20px 20px 30px;
text-align: right;
}
.timeline-image {
left: 50%;
width: 100px;
height: 100px;
margin-left: -50px;
h4 {
font-size: 13px;
line-height: 18px;
margin-top: 16px;
}
}
&.timeline-inverted > .timeline-panel {
float: right;
padding: 0 30px 20px 20px;
text-align: left;
}
}
}
}
@media(min-width:992px) {
.timeline {
> li {
min-height: 150px;
.timeline-panel {
padding: 0 20px 20px;
}
.timeline-image {
width: 150px;
height: 150px;
margin-left: -75px;
h4 {
font-size: 18px;
line-height: 26px;
margin-top: 30px;
}
}
&.timeline-inverted > .timeline-panel {
padding: 0 20px 20px;
}
}
}
}
@media(min-width:1200px) {
.timeline {
> li {
min-height: 170px;
.timeline-panel {
padding: 0 20px 20px 100px;
}
.timeline-image {
width: 170px;
height: 170px;
margin-left: -85px;
h4 {
margin-top: 40px;
}
}
&.timeline-inverted > .timeline-panel {
padding: 0 100px 20px 20px;
}
}
}
}

Alles anzeigen

Css-Datei der Timeline

---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Problem 2:

HTML

<!-- Contact -->
<section id="contact">
<div class="container">
<div class="row">
<div class="col-lg-12 text-center">
<h2 class="section-heading text-uppercase">Kontakt</h2>
<h3 class="section-subheading text-muted">F&WCF_AMPERSANDülle das Formular aus um mit uns in Kontakt zu treten.</h3>
</div>
</div>
<div class="row">
<div class="col-lg-12">
<form id="contactForm" name="sentMessage" novalidate>
<div class="row">
<div class="col-md-6">
<div class="form-group">
<input class="form-control" id="name" type="text" placeholder="Name *" required data-validation-required-message="Bitte teile uns dein Namen mit.">
<p class="help-block text-danger"></p>
</div>
<div class="form-group">
<input class="form-control" id="email" type="email" placeholder="Email *" required data-validation-required-message="Bitte teile uns deine Email Adresse mit.">
<p class="help-block text-danger"></p>
</div>
</div>
<div class="col-md-6">
<div class="form-group">
<textarea class="form-control" id="message" placeholder="Deine Nachricht *" required data-validation-required-message="Bitte fülle deine Nachricht aus."></textarea>
<p class="help-block text-danger"></p>
</div>
</div>
<div class="clearfix"></div>
<div class="col-lg-12 text-center">
<div id="success"></div>
<button id="sendMessageButton" class="btn btn-primary btn-xl text-uppercase" type="submit">Nachricht Senden</button>
</div>
</div>
</form>
</div>
</div>
</div>
</section>

Alles anzeigen

HTML Kontakt Datei

PHP

<?php
// Check for empty fields
if(empty($_POST['name'])      
empty($_POST['email'])     
empty($_POST['phone'])     
empty($_POST['message'])   
!filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))
{
echo "No arguments Provided!";
return false;
}

$name = strip_tags(htmlspecialchars($_POST['name']));
$email_address = strip_tags(htmlspecialchars($_POST['email']));
$phone = strip_tags(htmlspecialchars($_POST['phone']));
$message = strip_tags(htmlspecialchars($_POST['message']));

// Create the email and send the message
$to = 'info@fortnite-ts3.com'; // Add your email address inbetween the '' replacing [email='yourname@yourdomain.com'][/email] - This is where the form will send a message to.
$email_subject = "Website Contact Form:  $name";
$email_body = "You have received a new message from your website contact form.\n\n"."Here are the details:\n\nName: $name\n\nEmail: $email_address\n\nPhone: $phone\n\nMessage:\n$message";
$headers = "From: [email='noreply@yourdomain.com'][/email]\n"; // This is the email address the generated message will be from. We recommend using something like [email='noreply@yourdomain.com'][/email].
$headers .= "Reply-To: $email_address";
mail($to,$email_subject,$email_body,$headers);
return true;
?>

Alles anzeigen

PHP Kontakt Datei

Rule of Logic

Zitat von Rule of Logic

Tagchen,

Ich habe 2 Probleme.

Nr.1) wäre das mein Kontaktformular den Geist aufgegeben hat. Ich bekomme keine Emails mehr auf der angegeben Email Adresse.

Meine Frage wäre dann: Brauch ich einen Mail-Server dafür?

Nr2.) wäre das ich es nicht hin bekomme das meine TimeLine auf der Seite immer den Strich weiter zieht und ich eben am Ende keinen mehr haben möchte, da dann eben die TimeLine aufhören soll.

Vorab vielen Dank für die Hilfe,

Lg Rule

Alles anzeigen

steht oben

Arne Drews

Zu 1: Nutze eine Mailer-Klasse, anstatt mail(), bspw. PHPMailer ( Tutorial: hier )

Stef

Hey,

Rule of Logic : Bitte zukünftig deinen Code in die entsprechenden Code Tags einfügen. Diese findest du in der Navbar diesen Texteditors, das dritte von rechts (</>). Vielen Dank.

Das Thema wurde nun in das PHP-Abteil verschoben. Dort passt es am besten hin.

Wir haben ein Tutorial für ein Kontakformular erstellt. Schau mal hier: Kontaktformular Tutorial

Grüße,

Stef

Jetzt mitmachen!

Tags