O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Responsives Design mit WordPress

Book Description

Responsives Design ist der Schlüssel zu einem konsistenten und attraktiven Auftritt Ihrer WordPress-Website auf Desktop, Tablet und Smartphone. Wie Sie hierfür professionelle Themes und Plugins entwickeln, lernen Sie mit diesem Buch. Webexperte Joe Casabona zeigt Ihnen, wie Sie WordPress’ Features für Ihre Arbeit optimal nutzen, welche Konzepte Ihnen das Arbeiten erleichtern und welche Rezepte zu den besten Ergebnissen führen. Abschließend wenden Sie das Gelernte in fünf Tutorials an, in denen Sie responsive WordPress-Plugins und Theme-Komponenten programmieren und gestalten

Table of Contents

  1. Cover
  2. Titel
  3. Impressum
  4. Hingabe
  5. Danksagung
  6. Vorwort
  7. Einleitung
  8. 1 Was ist responsives Webdesign?
    1. 1.1 Die Ursprünge des responsiven Webdesigns
    2. 1.2 Breakpoints und Media Queries
      1. 1.2.1 em-basierte Breakpoints
      2. 1.2.2 Inhaltsbasierte Breakpoints
    3. 1.3 Die Geräte – aktueller Stand der Dinge
    4. 1.4 Denken Sie an die Verbindungsgeschwindigkeit
    5. 1.5 Zusammenfassung
      1. 1.5.1 Fragen
      2. 1.5.2 Antworten
  9. 2 Grundlagen der WordPress-Theme-Erstellung
    1. 2.1 Gestatten: unsere Website
    2. 2.2 Die Template-Struktur
      1. 2.2.1 style.css
      2. 2.2.2 functions.php
      3. 2.2.3 header.php und footer.php
      4. 2.2.4 index.php
    3. 2.3 Der Loop
      1. 2.3.1 Der Grundaufbau
      2. 2.3.2 Mehrfache Loops
    4. 2.4 Custom-Post-Types
    5. 2.5 Plugins und Shortcodes
      1. 2.5.1 Hooks, Actions und Filter
      2. 2.5.2 Shortcodes
    6. 2.6 Zusammenfassung
      1. 2.6.1 Fragen
      2. 2.6.2 Antworten
  10. 3 Ein responsives Theme erstellen – die richtige Basis
    1. 3.1 RWD-Techniken
      1. 3.1.1 Media Queries
      2. 3.1.2 RESS
      3. 3.1.3 wp_is_mobile()
      4. 3.1.4 JavaScript
    2. 3.2 Das responsive Layout hinzufügen
    3. 3.3 Die Standard-CSS-Klassen von WordPress
      1. 3.3.1 Kommentare und Widgets
      2. 3.3.2 Vermischte Styles
    4. 3.4 Zusammenfassung
      1. 3.4.1 Fragen
      2. 3.4.2 Antworten
  11. 4 Ihr responsives Theme – grundlegende Eigenschaften
    1. 4.1 Die Navigation im RWD
      1. 4.1.1 Beliebte Techniken kurz vorgestellt
      2. 4.1.2 Serverseitige Anpassung der Navigation
      3. 4.1.3 Überlegen Sie, was für Ihre Besucher das Beste ist
    2. 4.2 Vom richtigen Umgang mit Bildern
      1. 4.2.1 Wie in WordPress Bilder hochgeladen werden
      2. 4.2.2 picturefill.js einsetzen
      3. 4.2.3 Die Breite und Höhe bei Bildern überschreiben
    3. 4.3 Der richtige Umgang mit Widgets
      1. 4.3.1 Die Sidebar
      2. 4.3.2 Sidebar-Widgets
    4. 4.4 Zusammenfassung
      1. 4.4.1 Fragen
      2. 4.4.2 Antworten
  12. 5 Ihr responsives Theme – Blog-Eigenschaften
    1. 5.1 Behandlung von Kommentaren
      1. 5.1.1 Den Kommentarbereich gestalten
      2. 5.1.2 Paginierung
      3. 5.1.3 Inkrementelles Laden
      4. 5.1.4 Eine eigene Kommentarseite
    2. 5.2 Der richtige Umgang mit Archiven
      1. 5.2.1 Was man für eine bessere User Experience berücksichtigen sollte
      2. 5.2.2 Nach Datum sortierte Archive
      3. 5.2.3 Mit Tag-Wolken arbeiten
      4. 5.2.4 Die Suchleiste
      5. 5.2.5 Der richtige Umgang mit Plugins
    3. 5.3 Zusammenfassung
      1. 5.3.1 Fragen
      2. 5.3.2 Antworten
  13. 6 Responsive Theme-Frameworks
    1. 6.1 Einige Prinzipien der Wiederverwendung, die Sie sich merken sollten
      1. 6.1.1 Gerätetests
      2. 6.1.2 Definieren Sie Ihre Anforderungen
    2. 6.2 WordPress-Frameworks
      1. 6.2.1 Frameworks, Themes und Plugins finden
      2. 6.2.2 Warum sollten Sie ein kommerzielles Theme verwenden?
    3. 6.3 Beliebte WordPress-Frameworks
      1. 6.3.1 Bootstrap
      2. 6.3.2 Foundation
      3. 6.3.3 Unbedingt erwähnenswert: HTML5 Boilerplate
      4. 6.3.4 Thesis
      5. 6.3.5 Genesis
      6. 6.3.6 Underscore
      7. 6.3.7 Twenty Thirteen
      8. 6.3.8 Ein eigenes Theme-Framework entwickeln
    4. 6.4 Zusammenfassung
      1. 6.4.1 Fragen
      2. 6.4.2 Antworten
  14. 7 Techniken und Tutorials
    1. 7.1 Einleitung
      1. 7.1.1 Im Fokus: CPTs und CSS
    2. 7.2 Eine responsive Fotogalerie in WordPress
      1. 7.2.1 Eine Galerie aus neuen Bildern erstellen
      2. 7.2.2 Den CSS-Code ändern
      3. 7.2.3 Einschränkungen
    3. 7.3 Eine responsive WordPress-Karte mit Google Maps
      1. 7.3.1 Den Shortcode erstellen
    4. 7.4 Ein responsiver Bilder-Slider in WordPress
      1. 7.4.1 Definition des Plugins und der Variablen
      2. 7.4.2 Die Slider-Skripte einbinden
      3. 7.4.3 Shortcode und Template-Tag
      4. 7.4.4 Den Custom-Post-Type erstellen
    5. 7.5 Ein responsives Kontaktformular in WordPress
    6. 7.6 Eine responsive Produktseite in WordPress
      1. 7.6.1 Shortcode und Template-Tag
      2. 7.6.2 Den Custom-Post-Type erstellen
    7. 7.7 Zusammenfassung
      1. 7.7.1 Fragen
      2. 7.7.2 Antworten
  15. A Quellen
    1. A.1 Ein paar Worte zum Abschluss
    2. A.2 Bücher
    3. A.3 Treffen und Konferenzen
      1. A.3.1 Meetup.com
      2. A.3.2 WordCamp Central
      3. A.3.3 An Event Apart
      4. A.3.4 Webinale
      5. A.3.5 Beyond Tellerrand
    4. A.4 Links
      1. A.4.1 Websites
      2. A.4.2 Podcasts
  16. Index