eBooks-verkaufen-Workshop Teil 3: Verkaufsseiten mit WordPress erstellen

In diesem Workshop zeige ich Ihnen, wie Sie Landingpages auf der Basis von WordPress-Seiten-Templates erstellen können.

Seiten sind im Gegensatz zu den Artikeln, die in chronologischer Reihenfolge auf dem Blog angezeigt werden, für feste Inhalte wie z.B. Impressum, Über mich, u.s.w. vorgesehen und unabhängig vom Erstelldatum über die Menü-Navigation stets zugänglich. Über die Seiten-Funktion kann man aber auch hervorragend Landingpages erstellen, indem man eigene Templates verwendet.

Für die Darstellung der Seiten greift WordPress automatisch auf das Seiten-Template page.php zurück, welches sich im Ordner wp-content/themes/ des verwendeten Themes befindet.

Das Template enhält die Struktur für das Aussehen der Seite: Den Kopfbereich, die CSS-Formatierungsangaben, den Inhaltsbereich, die Sidebar und der Footer. Zur Verdeutlichung nachfolgend ein Screenshot aus dem Standard-Seitentemplate page.php des Themes „Twenty Ten“ mit Anmerkungen zu den einzelnen Elementen:

(1): Über die Variable get_header () wird die Datei header.php eingebunden, die die Struktur, Title-Angaben und HTML-Formatierungen für den Kopfbereich enthält.

(2): Hier wird die Formatierung des Inhaltsbereiches per CSS über Container (DIV) festgelegt, basierend auf der Stylesheet-Datei „style.css“ des Template- Ordners.

(3): Die im Seiten-Editor eingegeben Titel und Inhalte werden hier über Variablen ausgelesen und ausgegeben.

(4): Über <?php comments_template( “, true ); ?> werden Kommentare ausgegeben, sofern die Funktion im Seiten-Editor aktiviert ist.

(5): Über <?php get_sidebar(); ?> wird die Navigations-Seitenleiste eingebunden ,über <?php get_footer(); ?> der Fußbereich.

Das Theme TwentyTen beinhaltet auch noch ein weiteres Seiten-Template „one column, no sidebar“ (Seiteninhalt wird in voller Breite ohne Seiten-Navigation dargestellt), das rechts im Seiten-Editor über Attribute – Template ausgewählt werden kann. In diesem Dropdown-Menü befinden sich auch alle weiteren angelegten Templates, die der Seite zugewiesen werden können.

Bei dem Seiten-Template „one column, no sidebar“ wurde lediglich die Seiten-Navigation (Variable <?php get_sidebar(); ?>) entfernt und eine andere Stylesheet-Angabe (div-Container) für die Darstellung in voller Breite eingefügt.

Um ein eigenes Seiten-Template zu verwenden, gibt es verschiedene Möglichkeiten. Man kann z.B. die page.php als Vorlage nehmen, umbenennen (z.B. verkaufsseite.php) und dann die einzelnen Elemente für die eigenen Zwecke individuell anpassen, für eine Verkaufsseite/Landingpage z.B. durch Entfernen ablenkender Elemente wie Navigation, Sidebar, Footer, u.s.w.

Im ersten Schritt muß dazu in der Datei in der ersten Zeile ein PHP-Kommentar eingefügt werden, aus dem WordPress den Namen des Templates ausliest. Dieser lautet wie folgt: <?php /* Template Name: XYZ*/ ?> XYZ steht dabei für den Namen des Templates. Die Datei muß im gleichen Verzeichnis wie page.php abgelegt sein und kann dann später über den Namen im Seiten-Editor unter Attribute ausgewählt werden.

Auf dieser Grundlage kann man sich die Vorlage mit etwas HTML-Kenntnissen auch nach eigenen Vorstellungen aufbauen. Auf diese Weise lassen sich z.B. auch vorhandene HTML-Verkaufsseiten-Templates verwenden. Als Beispiel habe ich mal ein Muster einer Verkaufsseiten-Vorlage für WordPress-Seiten erstellt:

(1) Der Befehl <?php /* Template Name:  verkaufsseite*/ ?> gibt an, daß die Vorlage „verkaufsseite“ heißt.

(2) Der Kopfbereich enhält die Angaben für den Titel, der durch den Befehl: <title><?php if (is_home()) { bloginfo(’name‘); ?><?php } elseif (is_category() || is_page() ||is_single()) { ?> <?php } ?><?php wp_title(“); ?></title> dynamisch ausgelesen wird.

Der Pfad zu der Stylesheet-Datei wird über <link href=“<?php bloginfo(‚template_directory‘); ?>/verkaufsseite/style.css“ rel=“stylesheet“ type=“text/css“ /> festgelegt (in diesem Beispiel liegt die Datei „style.css“ im Verzeichnis „verkaufsseite“).  Der Befehl <?php bloginfo(‚template_directory‘); ?> fragt das aktuell verwendete Template-Verzeichnis ab.

(3) Der Body-Bereich enthält die Formatierungsangaben für die Seiten-Struktur.

(4) Die PHP-Befehle, die den Inhalt ausgegeben, den der Benutzer im Seiten-Editor eingibt.

(5) Ein fester Footer-Bereich, der die Links zu AGB, Impressum, etc. enthält.

Mehr Infos zu Seiten-Template gibt es auf der WordPress-Codex-Seite auch unter https://codex.wordpress.org/Pages#Page_Templates

In dem Video zeige ich Ihnen, wie Sie mit WordPress ein Seiten-Template für eine Landingpage erstellen. Dafür stelle ich eine Verkaufsseiten-Vorlage bereit (siehe auch Screenshot oben), die Sie sich auf der Workshop-Seite herunterladen und verwenden können.

Kommentare

Schreiben Sie einen Kommentar zu Florian Antworten abbrechen

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

  1. Hallo Sandra,

    wieder ein toller, interessanter und informativer Blogpost.
    Das video dazu ist ebenfalls sehr gelungen. Deine Geschwindigkeit ist vielleicht für Einsteiger und Anfänger etwas zu eilig gewählt. Ich würde mich auch leichter tun, wenn Du etwas langsamer vorangehen würdest. Das Thema interessiert mich sehr. Wollte mir die Verkaufsseiten-Vorlage auf der Workshop-Seite runterladen, habe aber leider kein Password dazu. Wie kann ich an dieses Password kommen? Wäre Dir für eine entsprechende Info sehr dankbar.

    Freue mich schon auf Deine nächsten Artikel.

    Ich danke Dir schon jetzt für Deine Rückinfo und wünsche Dir noch einen schönen Abend.

    Liebe Grüße
    Ralph

  2. Hallo Ralph,

    vielen Dank für dein Feedback. Das Passwort für die Workshop-Seite findest du in meinem Newsletter von gestern. Falls nicht mehr vorhanden, sende mir einfach kurz eine Email an info@sc-dm.de, ich schick´es dir dann nochmal rüber.

    Viele Grüsse,
    Sandra

  3. Hallo Sandra,

    ich wollte mich nochmals bedanken für Deine detailierten Beschreibungen und Videos – werde mich die nächsten Tage mal ans umsetzen machen.

    Liebe Grüße
    Josef-A.

  4. Hallo Frau Christiansen,
    vielen Dank für diese ausführliche Erklärung. Ich bin seit langem Affiliate und auch Kunde von Herrn Brandmüller und freue mich sehr das Sie seine Projekte weiterführen und ausbauen.
    Gerne werde ich die Artikel auf Ihrem Blog, respektive Ihren Webseiten weiter verfolgen.
    Schönes Wochenende aus Speyer
    Mathias Gierens

  5. Wow – ich bin begeistert.
    Wirklich schade das ich erst jetzt gerade über diesen sehr interessanten Beitrag gestolpert bin.
    Das muss ich gleich mal bookmarken – klasse Artikel.

  6. Danke Sandra für die Tolle Anleitung. Leider hat das Script nicht genau das gemacht was ich wollte und so kam es wie es kommen musste: Ich habe eine normale Landingpage mit einem WYSIWYG Web Builder gebaut. Der Vorteil liegt für mich in der wesentlich einfacheren Handhabung und in der gestalterischen freiheit. Aber in WordPress eingebunden greiften die Seo-Maßnahmen natürlich viel besser, weil die Seite nicht aus dem gesamtkonstrukt herausgelöst ist.

    Liebe Grüße

    Philipp
    https://www.telefonverkauftraining.de