index.php - Startseite

Wenn Sie eine Internetseite aufrufen sucht der Browser immer zuerst die index.php.
Hier legen Sie den Aufbau der Startseite fest.

Header einbinden
Auf der Startseite (home) soll oben der Titel und das Menü erscheinen.
Sie rufen die header.php auf

<?php get_header(); ?>

 

 

 


index.php - Liste mit neuesten Beiträgen anzeigen

Dies geschieht mit Hilfe eine While-Schleife (Loop)
Dies geschieht mit  have_posts() und  the_post()
Hier der Link zur While-Schleife (Loop) von WordPress

<?php while ( have posts() ) : the_post(); ?>

<!-- Ab hier die Beiträge anzeigen  -->

<!--  Schleife beenden  -->
<?php endwhile; ?>

Mitteilung, wenn keine Beiträge existieren
Nur dieser Bereich der Loop-Schleife wird ausgeführt, wenn keine Beiträge vorhanden sind.
Sollten Beiträge gefunden werden, wird dieser Bereich der Loop-Schleife übersprungen.

<?php else : ?>
    <p>Es gibt keine Beiträge!</p>
<?php endif; ?>


Ausgabe aller Beiträge

Den Code platzieren Sie zwischen folgendem Code

<?php while ( have posts() ) : the_post(); ?>
....

<?php endwhile; ?>


The Loop - Alle Beiträge anzeigen lassen

<!--  Ist wenigstens ein Beitrage vorhanden?  -->
<?php if ( have_posts() ) : ?>

     <!-- Jetzt alle Beiträge nacheinander ausgeben  -->
     <?php while ( have posts() ) : the_post(); ?>

          <!--  Hier den Beitrage anzeigen  -->
          .......

<!-- Mitteilung, wenn keine Beiträge existieren  -->
<?php else : ?>
    <p>Es gibt keine Beiträge!</p>
<?php endif; ?> 


Zwischenstand index.php



 

 

 

 


index.php - Links zum Umblättern

Hier treffen Sie Vorsorge für den Fall, dass Ihnen WordPress mehr Beiträge anzeigt, als auf eine Seite passen.
Unter  Einstellungen / Lesen / Blogseiten zeigen maximal  haben Sie festgelegt, wie viele Beiträge
auf einer Seite angezeigt werden sollen.



Beispiel für Links zum Umblättern

Wenn also mehr als 10 Beiträge angezeigt werden, hilft es Ihren Besuchern, wenn Sie zu allen Beiträgen
navigieren können.

  • Beschriftung der Links (möglichst aussagekräftig + "sprechend")
    in einfachen Anführungsstrichen

  • &rarr
    HTML-Code für einen nach rechts gerichteten Pfeil (z.B. Ältere Beiträge)

  • &larr
    HTML-Code für einen nach links gerichteten Pfeil (z.B. Neuere Beiträge)

  • &mid-dot
    Punkt als optisches Trennzeichen
    wird nur bei Bedarf angzeigt

Hier finden Sie weiteren HTML-Code (HTML-Entity)



Code für die Links zum umblättern
Der Code muss nach der Anzeige mit den Beiträgen in der index.php platziert werden,
nach dem Ende der Loop-Schleife.

<?php endwhile; ?>
    <p><?php post_nav_link(' &middot; ', '&larr; Neuere Beiträge', 'Ältere Beiträge &rarr; ') ?><(p>
<?php else : ?>
     <p>Es gibt keine Beiträge</p>
<?php endif; ?>
....

Andere flexiblere Möglichkeit

Ältere Beiträge
<!-- Gibt es neuere Beiträge  -->
<?php if ( get_next_posts_link() ) : ?>
   
    <!-- Wenn ja wird ein Link zu Älteren Beiträgen angezeigt  -->
    <?php next_posts_link('Ältere Beiträge'); ?>

<?php endif; ?>

Neuere Beiträge
<!-- Hat der Besucher schon umgeblättert und gibt es bereits vorherige neuere Beiträge -->
<?php if ( get_previous_posts_link() ) : ?>

    <!--  wenn ja wird ein Link zu Neueren Beiträgen angezeigt  -->
    <?php previous_posts_link( 'Neuere Beiträge' ) ); ?>

<?php endif; ?>



 


index.php - Einen der Beiträge ausgeben

Ein Beitrag besteht natürlich aus Text, aber auch aus Informationen,
wann veröffentlicht, wer war der Verfasser (Autor) usw.
Der Code für Beiträge wird eingerahmt von  <article> ... </article>
Alle Informationen außer Beitragstext und Kommentare werden zusätzlich
eingerahmt durch <header> ... </header>.

  • Beitrag-Überschrift
    <?php the_title(); ?>

  • Link zu diesem Beitrag (Permalink)
    <?php esc_url( the_permalink(); ) ?>

    esc_url
    Prüfung ob gültige Internetadresse

  • Tag für Überschrift des Beitrages inklusive Link zu diesem Beitrag
    <a href="/<?php esc_url(the_permalink()); ?><?php the_title(); ?</a>

  • Name des Verfassers (Autor)
    <?php the_author_posts_link(); ?>



  • Datum der Veröffentlichung
    <?php the_date(); ?>

    Datum-Format
    (möglichst wenig verwenden, da nachträgliche Änderung sehr schwer)
    wurde im Backend eingestellt unter  Einstellungen / Allgemein / Datumsformat
    <?php the_date('d.m.Y'); ?>  entspricht dem Datum z.B. 26.11.2018
    Link zu ausführlichen Formatierungen Datum + Uhrzeit

  • Kategorie (Link zu allen Beiträgen aus dieser Kategorie)
    <?php the_category(); ?>

  • Inhalt des Beitrages ausgeben
    <?php the_content('Weiterlesen ...'); ?>
    Es werden nur die ersten Zeilen angezeigt, mit Klick auf Weiterlesen
    wird dann der vollständige Beitrag angezeigt

  • Kommentare (wenn ja, wie viele Kommentare gibt es zur Zeit)
    <?php comments_popup_link('Kein Kommentar vorhanden', 'Ein Kommentar vorhanden',
    '% Kommentare vorhanden', '', 'Es werden keine Kommentare angezeigt'); ?>

    Es werden keine Kommentare angezeigt
    Im Beitrag wurde (oben) die Kommentarfunktion abgeschaltet.



Der Code für Ausgabe der Beiträge

<!--  Ist wenigstens ein Beitrage vorhanden?  -->
<?php if ( have_posts() ) : ?>

     <!-- Jetzt alle Beiträge nacheinander ausgeben  -->
     <?php while ( have posts() ) : the_post(); ?>

                <article>

                    <header>

                          <!-- <h1>-Tag für Überschrift des Beitrages inklusive Link zu diesem Beitrag  -->
                          <h1><a href="/<?php esc_url(the_permalink()); ?><?php the_title(); ?</a></h1>

                           <!-- Name des Verfassers (Autor)  -->
                           Der Beitrag wurde erstellt von <?php the_author_posts_link(); ?>
                            
                           <!--  Datum der Veröffentlichung  -->
                           am: <?php the_date(); ?> 

                           <!-- Kategorie (Link zu allen Beiträgen aus dieser Kategorie) -->
                           <?php the_category(); ?>
 
                     </header>

                    <!-- Inhalt des Beitrages ausgeben  -->
                    <?php the_content('Weiterlesen ...'); ?>

                     <!--  Informationen über Kommentare  --> 
                     <p>
                     <?php comments_popup_link('Kein Kommentar vorhanden', 'Ein Kommentar vorhanden',
                     '% Kommentare vorhanden', '', 'Es werden keine Kommentare angezeigt'); ?>
                     </p>

               </article>

      <?php endwhile; ?>         

<!--  Mitteilung, wenn keine Beiträge existieren  -->
<?php else : ?>

    <p>Es gibt keine Beiträge!</p>
<?php endif; ?>

 



Screen der vorläufigen index.php


index.php - Sidebar und Footer einbinden

Der Code für die Sidebar und den Footer befindet sich in den Dateien

  • sidebar.php
  • footer.php

Code, um beide Dateien einzubinden

<?php
   get_sidebar();
   get_footer();
?>