Eigene Themes from Scratch Stefan Fröhlich.! WordCamp Berlin 2015

Größe: px

Ab Seite anzeigen:

Download "Eigene Themes from Scratch Stefan Fröhlich.! WordCamp Berlin 2015"

Eva Kerner
vor 8 Jahren
Abrufe

1 Eigene Themes from Scratch Stefan Fröhlich WordCamp Berlin 2015

2 Stefan Fröhlich 1984: Basic und 6510-Assembler mit C-64 seit 1995 freiberuflicher Entwickler seit 2012: WordPress anfangs Anpassung von Themes und Plugins nach kurzer Zeit ausschließlich Entwicklung kundenspezifischer Themes Administrator etlicher WP-Installationen

3 Wozu ein eigenes Theme?

4 Premium -Themes und Frameworks unnötige Funktionalität und Code wichtige Projektanforderungen fehlen ergänzende Plugins haben häufig dieselben Probleme: viele Optionen, aber nicht die erforderlichen

5 aufgeblähter Code viele CSS- und JS-Dateien

6 PageSpeed-Ergebnis Out of the box: eher unerfreulich Abhilfe: entsprechendes Hosting (Kosten/ Administration) oder Plugins (funktioniert oft nicht) oder Aufwand für Optimierung

7 Günstiger Preis, aber zusätzliche Kosten unnötige Features entfernen erforderliche Features implementieren Anpassungen an Design oder Corporate Identity des Kunden Bugfixing zusätzlicher Testaufwand durch Bugfixing und CSS-Anpassung

8 Sicherheit beliebte Themes haben auch beliebte Sicherheitslücken Sicherheitslücken der in das Theme integrierten Plugins Kein Problem, wenn regelmäßig alles aktualisiert wird, aber die Praxis sieht oft anders aus.

9 Eigenes Theme

10 Individuelles Design - nicht von der Stange

11 Genau die gewünschte Funktionalität - nicht zuviel, nicht zuwenig Übersichtliches Backend, das ebenfalls den Kundenwünschen entsprechend aufgebaut ist

12 Keine bekannten Sicherheitslücken Schlanker Code bessere Performance weniger CSS- und JS-Dateien

13 Anatomie eines Themes

14 Theme-Verzeichnis Neues, leeres Verzeichnis: /wp-content/themes/from_scratch

16 style.css /* LICENSE & DETAILS ================================================== Theme Name: Eigenes Theme from Scratch Theme URI: Description: Demo-Theme für WordCamp Berlin 2015 Version: 0.1 Author: Stefan Fröhlich Author URI: License: GNU General Public License v2 or later License URI: Tags: bla, blub Text Domain: from_scratch ================================================== */

18 index.php + screenshot.png <-- Gibt es mindestens einen Beitrag? --> <?php if ( have_posts() ) :?> <-- Dann alle Beiträge ausgeben: > /* DER LOOP */ <?php while ( have_posts() ) : the_post();?> <article> <header> <-- Überschrift --> <h1> <a href="<?php the_permalink();?>"> <?php the_title();?> </a> </h1> </header> <-- Inhalt --> <?php the_content();?> </article> <?php endwhile;?> <-- Falls es keine Inhalte gibt --> <?php else :?> <p><?php _e( 'Nothing Found', from_scratch' );?></p> <?php endif;?>

19 Header und Footer einbinden <?php get_header();?> <-- Gibt es mindestens einen Beitrag? --> <?php if ( have_posts() ) :?>... <?php else :?> <p><?php _e( 'Nothing Found', from_scratch' );?></p> <?php endif;?> <?php get_footer();?> Header: Alles, was vor dem Loop kommt, inklusive HTML-Header und Navigation Footer: Alles, was nach dem Loop kommt. Inklusive Footer und schließendes </body>-tag usw.

20 header.php <DOCTYPE html> <html> <head> <meta charset="<?php bloginfo( 'charset' );?>"> <meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="<?php echo get_stylesheet_uri();?>" type="text/css" /> <?php wp_head();?> </head> <body> <nav class="navigation" role="navigation"> <?php wp_nav_menu( array( 'theme_location' => 'mainmenu' ) );?> </nav>

21 footer.php <footer> <strong>footer:</strong> Unser eigenes Theme from Scratch </footer> </div> <?php wp_footer();?> </body> </html>

22 Weitere Template-Dateien sidebar.php: Darstellung der Seitenleiste(n) functions.php: Festlegen globaler Einstellungen, z.b. Skripts und Styles einbinden oder ausschließen front-page.php: Startseite für letzte Beiträge oder statische Seite home.php: Startseite für letzte Beiträge page.php: Template für die Darstellung von Seiten single.php: Template für einzelner Beiträge category.php, archive.php: Darstellung von Kategorieren / Archiven Weiterführende Links:

23 Alternative Seiten-Templates <?php /* * Template Name: Anderes Template */ get_header();?> <?php while ( have_posts() ) : the_post();?> <article> <header>

24 Weitere Komponenten

25 Erweiterung durch Custom Post Types und Taxonomien Erweiterung durch Custom Fields Wie gewohnt beliebige Plugins

26 Custom Post Types / Taxonomien Code bequemer mit beliebtes Plugin:

27 Custom Fields Code beliebtes Plugin: Advanced Custom Fields (Pro)

28 Tools für effizienten Workflow

29 Tools lokale Entwicklungsumgebung: Webserver + PHP + MySQL Automatisierung mit grunt Versionsverwaltung und Deployment mit git

30 Lokale Entwicklungsumgebung Apache / nginx + PHP + MySQL (Mac / Unix / Linux) MAMP: (Windows / Mac)

31 Automatisierung mit grunt

32 Flaticons designed by Freepik

33 Versionierung mit git Versionskontrolle mit git dringendst zu empfehlen für jedes Projekt öffentliche Projekte: vertrauliche Projekte: privates Repository, z.b. auf

34 Deployment mit git

35 Fragen? Vielen Dank und weiterhin viel Spaß auf dem WordCamp Berlin 2015 :-) Stefan Fröhlich

Ähnliche Dokumente

Custom Themes from Scratch Stefan Fröhlich. WordCamp Nürnberg 2016

Custom Themes from Scratch Stefan Fröhlich WordCamp Nürnberg 2016 Stefan Fröhlich seit 1995 freiberuflicher Entwickler seit 2012: WordPress zunächst Anpassung von Themes und Plugins (genau 2-Mal) Danach