WordPress Website Tutorial 2017

Ein neues Website Tutorial zum Jahresende 2017 –

In diesem Video lernst du Schritt für Schritt wie du eine Website mit WordPress aufbaust. Dieses mal am Beispiel an einer echten, existierenden Website: Mein Blog www.jonasschindler.de

Die Version der Website die ich in diesem Video erstelle findet ihr unter: tutorial.jonasschindler.de

Inhalt des Videos:
1. Neue Subdomain anlegen 3:11
2. WordPress Installieren 4:45
3. Impreza Theme Installieren 9:20
4. Impreza Theme aktivieren 15:24
5. Wartungsmodus Aktivieren 21:45
6. WordPress Grundeinstellungen 23:55
7. Impreza Theme Optionen 26:25
8. Website Header gestalten 28:37
9. Website Footer gestalten 49:50
10. Kontakt Formular hinzufügen 56:09
11. Startseite aufbauen 1:10:30

Der HTML und CSS Code für das CF7 Footer Formular

Formular Code – Diesen Code unter Formulare (Contact Form 7) einfügen:

<div class=“row“>
<div class=“col-md-6″>
[text* your-name placeholder „Name“]
</div>
<div class=“col-md-6″>
[email* your-email placeholder „E-Mail Adresse“]
</div>
</div>
[textarea your-message minlength:10 maxlength:300 placeholder „Nachricht“]
[count your-message down]
<p>[submit „Senden“]</p>

Diesen Code unter Impreza Theme Optionen => Individueller Code einfügen:

(ist nicht vollständig notwendig, aber der Vollständigkeit halber…)

/* Bootstrap */

@media (min-width: 992px) {
.col, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
float: left;
}
.col-md-12 {
width: 100%;
}
.col-md-11 {
width: 91.66666667%;
}
.col-md-10 {
width: 83.33333333%;
}
.col-md-9 {
width: 75%;
}
.col-md-8 {
width: 66.66666667%;
}
.col-md-7 {
width: 58.33333333%;
}
.col-md-6 {
width: 50%;
}
.col-md-6 input[name=’your-name‘]{
width: 98%;
}
.col-md-5 {
width: 41.66666667%;
}
.col-md-4 {
width: 33.33333333%;
}
.col-md-offset-6 {
margin-left: 50%;
}
}