Neulich wurde ich per Email gefragt, wie man eine „Sales Page“, bzw. eine Landing Page mit dem Thesis Theme erstellen kann. Da meine Zeit aber arg begrenzt war, komme ich erst jetzt dazu, ein Tutorial zu diesem Thema zu verfassen.
Wozu eine Sales Page?
Eine Sales Page kann man nutzen um Produkte zu präsentieren, ohne die vielleicht störenden Bloginhalte anzuzeigen. Der Besucher konzentriert sich auf das Produkt und hat keine Möglichkeit im Blog hin-und her zu wuseln. Die Seite ist speziell auf den Verkauf ausgrichtet.
In meinem Blog gibt es bisher drei verkaufsseiten, mehr oder minder optimiert, aber alle nur mit einem Grundgerüst des Thesis Themes. Es gibt zwei Wege eine solche Seite zu realisieren.
Der CSS Weg
CSS ist die Sprache, mit der wir das aussehen unserer Seite gestalten. Farben, Formen, Boxen und vieles mehr kann man mit CSS machen. Und es gibt einen Befehl, der solche Elemente auch ausblenden kann. Wenn man die Klassen kennt, die Thesis verwendet kann man sie einfach ausblenden.
Schreiben wir also eine einfache Klasse, die unsere Sales Page „nackig“ macht:
.salesletter #footer { padding-bottom: 0; border-top: 0em; }
.salesletter #footer { display: none; }
.salesletter #sidebars { display: none; border: none; }
.salesletter #tabs {display:none;}
.salesletter #content_box { background:none; }
.salesletter .comments_closed { display: none; }
.salesletter #header #logo { display: none; }
.salesletter #header #tagline { display: none; }
.salesletter #content { margin: 0 auto; float: none; }
Die Klasse salesletter wird nun dazu benutzt um diverse Elemente einfach auszublenden. So könnte man den kompletten Header zu Beispiel wie folgt ausblenden:
Jetzt bleibt nur noch die Frage, wie man diese Klasse einer einzelnen Seite zuweisen kann. Das ist mit Thesis auch nicht besonders schwer, denn es gibt bei der Erstellung der Seite eine Option, die sich „CSS CLASS“ nennt.
Zu finden ist sie unter dem Artikel, im Bearbeitungsmodus. Dort trägt man nun einfach die Klasse ein, in unserem Fall „salesletter“.
Der PHP Weg
Der zweite Weg führt direkt über einen Eingriff in die custom_functions.php. Dort erstellen wir zunächst eine Funktion, die den Titel einer Seite unterdrückt. Der Titel der Seite wird anderfalls angezeigt, was unter Umständen nicht besonders schön auf einer „Sales Page“ aussieht. Folgende Funktion wird dazu verwendet:
return (is_page(array('2621','4416','4605','4899'))) ? false : true;
}
add_filter('thesis_show_headline_area', 'suppress_title');
In der Funktion wird ein array definiert, dass die Ids der Seiten enthält, auf denen der Titel unterdrückt werden soll. Wie Du diese Id´s finden kannst, erkläre ich am Ende dieses Artikels.
Der Titel ist aber vielleicht nicht das einzige, dass ausgeblendet werden soll. Wir benötigen nun noch eine weitere Funktion, welche die einzelnen Bestandteile der Seite ausblendet. Ich habe das wie folgt gelöst:
if (is_page(array('2621','4416','4605','4899'))) {
add_filter('thesis_show_header', 'custom_remove_defaults');
add_filter('thesis_show_sidebars', 'no_sidebars');
add_filter('thesis_show_footer', 'custom_remove_defaults');
remove_action('thesis_hook_after_header', 'my_navmenu');
remove_action('thesis_hook_footer','widgetized_footer');
remove_action('thesis_hook_footer','widgetized_footer1');
add_action('thesis_hook_after_header', 'spacer');
remove_action('thesis_hook_header', 'header_widget', '1');
remove_action('thesis_hook_before_content','show_crumbs');
remove_action('thesis_hook_before_footer', 'my_footer');
add_action('thesis_hook_before_content', 'bloglink');
}
}
add_action('template_redirect','blogverdiener_sales_page');
Auch hier kommt wieder das Array zum Einsatz, das über die ID der Seite herausfindet, welche Seite nun eine „Sales Page“ ist. Anschließend werden drei filter aufgerufen, welche die Standards im Thesis Theme entfernen:
add_filter('thesis_show_sidebars', 'no_sidebars');
add_filter('thesis_show_footer', 'custom_remove_defaults');
Ich denke es ist erkennbar, dass es sich dabei um den Header, die Sidebars und den Footer des Themes handelt. Anschließend blende ich in meiner Funktion noch die einzelnen Funktionen aus, die ich selber erstellt habe um mein Theme zu erweitern. Zum Beispiel den Widgetized Footer.
Wenn man eigene Funktionen nutzt, dann muss man diese natürlich auch bis zu einem gewissen Grad entfernen. Was angezeigt werden soll, lässt man natürlich bestehen.
Beispiele
Mein Blog beinhaltet aktuell drei Verkaufseiten. Die erste ist eine komplett „nackte“ Version meines Blogs, ohne Header, Footer oder Sidebar. Über diese Seite Verkaufe ich mein Ebook. Die anderen beiden Seiten haben einen Header und einen extra angelegten Link, mit dem der Besucher zurück zum Blog finden kann. Dabei handelt es sich um die Seiten „Artikel Spinning Wizard“ und „Dragon Naturally Speaking“. Beides tolle Programme, die ich wie auch mein Ebook nur wärmstens empfehlen kann.
Sales Page mit dem Thesis Theme – Fazit
Es ist also nicht wirklich schwer eine Sales Page mit dem Thesis Theme zu erstellen, wenn man sich ein paar Gedanken zu diesem Thema macht. Der CSS Teil stammt im Übrigen nicht von mir, sondern von howtomakemyblog.com, aber die Funktionen sind so schon fertig, da ist kopieren leichter, als das Rad neu zu erfinden. Ich denke der Autor freut sich über ein Like!
Natürlich werde ich auch nächste Woche wieder ein Tutorial zum Thesis Theme veröffentlichen. Solange bis das neue Thesis Theme 2.0 zu haben ist. Ich hoffe das dann wieder mehr möglich ist, so dass diese Reihe noch ewig weiter gehen kann. Bleib dran und abonniere mein RSS-Feed.

Geld verdienen mit Social Media
Geld verdienen mit Texten





















