Contents

Tipps zur Bildergalerie Artikel-Formatvorlage in WordPress 3.1

Am Wochenende habe ich mich ein wenig mit den Möglichkeiten beschäftigt, die Bildergalerie Artikel-Formatvorlage in WordPress 3.1 umzusetzen. Und da es beim Post Format Bildergalerie doch einiges zu beachten gibt, möchte ich die wichtigsten Punkte zur Umsetzung hier kurz zusammen fassen.

1. Eine eigene Template-Datei für das Bildergalerie-Format

Wie ja bereits im Artikel „WordPress 3.1 Artikel Formatvorlagen im Theme einrichten – so funktioniert’s“ beschrieben, habe ich mich bei der Theme-Integration der Post Formats an der Vorlage im Toolbox-Theme orientiert. Daher habe ich für meine Bildergalerie die Template-Datei namens content-gallery.php angelegt. Mit Hilfe der eigenen Datei kann ich ganz leicht bestimmen, wie das Format der Bildergalerie auf der Startseite meines Blogs aussehen soll.

Am besten du kopierst einfach die content.php Datei deines Themes oder lädst dir das Free-Theme Toolbox herunter, denn dort ist bereits eine content-gallery.php Datei vorbereitet und du kannst dich an dieser Vorlage orientieren.

2. Die Galerie im Artikel einrichten und die Artikel-Formatvorlage wählen

Für die Bildergalerie lädst du jetzt erst deine Bilder über den Media-Uploadbereich im Admin ein, und dann nutzt du den gallery shortcode, um die Bildergalerie in den Artikel einzufügen.

Hast du bisher noch nicht mit der WordPress-eigenen Bildergalerie-Funktion gearbeitet, kannst du dir auch noch einmal den Artikel „Die Standard-Bildergalerie von WordPress nutzen“ durchlesen.

Außerdem musst du deinen Bildergalerie-Artikel natürlich auch noch als solchen markieren. Dazu sollst du bereits folgenden Code in der functions.php Datei deines Themes integriert haben.

Copy code
/** * Add support for the Aside and Gallery Post Formats */add_theme_support( 'post-formats', array( 'aside', 'gallery', 'link', 'quote', 'video', 'image', 'status', 'chat', 'audio' ) );

(Artikel-Formatvorlagen, die du nicht in deinem Theme verwenden möchtest, kannst du aus dem Codeschnipsel löschen).

Hast du den Codeschnipsel eingefügt, kannst du das Bildergalerie-Format jetzt im Artikel-Adminbereich über das Optionsfeld „Format“ auswählen.

Artikel-Formatvorlage Bildergalerie in WordPress

3. Ein Vorschaubild der Bildergalerie anzeigen

Um deine Bildergalerie-Artikel speziell zu gestalten, kannst du ein Vorschaubild der Galerie in der Artikel-Übersicht anzeigen.

Artikel-Formatvorlage Bildergalerie in WordPress
Ein Vorschaubild für die Bildergalerie Post Formats auf dem Elmstudio-Blog.

Dazu nutzt du die WordPress-Funktion wp_get_attachment_image. Mit folgendem Code in der content-gallery.php kannst du das Vorschaubild anzeigen:

Copy code
<?php$images = get_children( array( 'post_parent' => $post->ID, 'post_type' => 'attachment', 'post_mime_type' => 'image', 'orderby' => 'menu_order', 'order' => 'ASC', 'numberposts' => 999 ) );if ( $images ) :$total_images = count( $images );$image = array_shift( $images );$image_img_tag = wp_get_attachment_image( $image->ID, 'medium' );?><div class="gallery-thumb">	<a href="<?php the_permalink(); ?>"><?php echo $image_img_tag; ?></a></div><!-- end gallery-thumb -->

Im Codebeispiel habe ich die Bildergröße „medium“ für das Vorschaubild verwendet. Du könntest aber auch die Größen „thumbnail“ oder „large“ für dein eigenes Galerie-Vorschaubild nutzen. Die Maße von Thumbnail, Medium und Large bestimmst du übrigens im Adminbereich unter Einstellungen / Mediathek.

4. Anzahl aller Bilder anzeigen

Ein weiteres nettes Feature ist es, die Gesamtanzahl der Bilder in der Galerie auf der Startseite anzuzeigen. Dazu musst du neben dem oben genannten Code nur noch folgenden Absatz in die content-gallery.php einfügen (die Stelle, an der du die Angabe einfügen möchtest, kannst du natürlich selbst auswählen).

Copy code
<p class="pics-number"><strong><?php printf( _n( 'This gallery contains <a %1$s></strong>%2$s photo</a>.', 'This gallery contains <a %1$s></strong>%2$s photos</a>', $total_images, 'deinThemeName' ),						'href="' . get_permalink() . '" title="' . sprintf( esc_attr__( 'Permalink to %s', 'deinThemeName' ), the_title_attribute( 'echo=0' ) ) . '" rel="bookmark"',						number_format_i18n( $total_images )					); ?></p>

5. „Weiterlesen“ in „alle Bilder ansehen“ ändern

Da du ja eine eigene Template-Datei für deine Bildergalerie nutzt, bietet es sich an den Weiterlesen (Continue Reading) Link, für die Bildergalerie umzubenennen. Du könntest z.B. „Alle Bilder ansehen“ verwenden:

Copy code
<?php the_content( __( 'Alle Bilder ansehen &rarr;', 'deinThemeName' ) ); ?>

Ich hoffe diese Tipps können dir bei der Umsetzung deiner eigenen Gallery Post Formats ein wenig weiterhelfen. Fallen dir noch weitere Features ein, um die Bildergalerie-Artikel in WordPress 3.1 speziell zu gestalten? Über dein Feedback und weitere Tipps freue ich mich sehr!

Kategorien:

Gefällt dir, was wir hier machen? Dann abonniere unseren Newsletter oder YouTube-Kanal, das kostet dich nichts und hilft uns schon sehr. Wenn du einen Schritt weitergehen magst, lass unten ein kleines Dankeschön da. So bleibt Elmastudio für alle kostenlos, und wir schreiben weiter, wie seit 2009. Danke dir.Gefällt dir, was wir hier machen? Dann abonniere unseren YouTube-Kanal, das kostet dich nichts und hilft uns schon sehr. Wenn du einen Schritt weitergehen magst, lass unten ein kleines Dankeschön da. So bleibt Elmastudio für alle kostenlos, und wir schreiben weiter, wie seit 2009. Danke dir.

13 Kommentare

  1. wolf-dieter

    Hallo Ellen,

    wieder ein verständlicher und hilfreicher Beitrag, klasse. Ein Freund von mir hat ein spezielles Anliegen zum Thema Galerie, für das ich bislang keine Lösung gefunden haben. Er will eine Galerie, die alle Bilder der Mediathek anzeigt und automatisch die neu hochgeladen ebenfalls anzeigt. Hast Du eine Idee dazu? Danke.

    1. Ellen
      Author

      Antwort an wolf-dieter

      Hallo Wolf-Dieter,

      vielen Dank für dein Feedback zum Artikel. Spontan habe ich leider auch keine Lösung für die von dir beschriebene Funktion. Ich werde aber noch einmal recherchieren, und bescheid geben, sobald ich eine Lösung gefunden habe :-)

      Viel Grüße,
      Ellen

    2. Antwort an wolf-dieter

      1. Ellen
        Author

        Antwort an Chrissy

        Klasse, vielen Dank für diesen Tipp, Chrissy :-)

      2. wolf-dieter

        Antwort an Chrissy

        Hallo Ellen, hallo Chrissy,

        danke, das ging schnell und sieht gut aus. Ich werde es ausprobieren und aufs Ergebnis verweisen.

  2. Warum verwendest du nicht einfach die Funktion get_the_post_thumbnail ?

    1. Ellen
      Author

      Antwort an Bert

      Hallo Bert,

      vielen Dank für deinen Kommentar. In manchen Fällen kann es sein, dass ein Artikel überhaupt kein Thumbnail-Bild definiert hat, dafür aber eine WordPress-Bildergalerie über den Shortcode eingefügt ist. Das Bildergalerie-Thumbnail funktioniert also ganz unabhängig von den Artikel-Thumbnails.

      Viele Grüße,
      Ellen

  3. Patrick Schrödter

    Hallo Ellen,
    gibt es eine Möglichkeit, ohne Eingriffe in Datein, Alle meine, in der Mediathek befindlichen, Bilder als Seite (Galerie) anzeigen zu lassen? Hab schon echt alles versucht, jedoch nichts erreicht!….. bisher ist die Galerie Seite „blank“….

  4. Hallo Ellen,
    der Artikel ist jetzt schon etwas älter, hat mir aber bei der Erstellung meines Themes geholfen.
    Allerdings habe ich nicht nur ein Vorschaubild ausgegeben, sondern 4.
    Auf der Startseite sieht man dann 4 Bilder. :)
    Wenn es jemanden interessiert, hier mal der Code

    $attachment ):  ?>
     <dl class="gallery-item  „>
    <?php
        $i++; /* Zahl erhöhen */
        echo '‚;
        echo wp_get_attachment_image( $attachment_id, ‚thumbnail' );
        echo ‚‚;
        if ($i>4) break; /* Wurden 4 Bilder ausgegeben? Wenn ja, Schleife abbrechen */
        ?>

    mfg Andre

    1. Antwort an Andre

      Hoppla, hab was vergessen. Außerdem setzt WordPress hier Links, wo keine sein dürften? Hab mal Leerzeichen bei dem Link Element gemacht.

      $post->ID, ‚post_type' => ‚attachment', ‚post_mime_type' => ‚image', ‚orderby' => ‚menu_order', ‚order' => ‚ASC', 'numberposts' => 999 ) );
      $total_images = count( $images );
      $i=1;
      $j=1;
      if ( !empty($images) ) { ?>

      $attachment ): ?>

      <dl class="gallery-item „>

      <?php
      $i++;
      echo '‚; (Entfernt das Leerzeichen)
      echo wp_get_attachment_image( $attachment_id, ‚thumbnail' );
      echo ‚‚; (Entfernt das Leerzeichen)
      if ($i>4) break;
      ?>
    2. Antwort an Andre

      Tut mir Leid für noch einen Post.
      Hier jetzt einfach ein Foto vom Code:
      https://lh6.googleusercontent.com/-ksU1d2r3V44/TjwXrWzsCAI/AAAAAAAAAG8/SPTDZIvqYKU/code.png
      Vielleicht interessiert es ja jemanden

  5. Hallo,
    der Hinweis aus diesem Artikel ist in Yoko ja schon integriert, ich laufe aber gerade in ein anderes Problem (oder seh‘ vor lauter Bäumen den Wald nicht mehr). Ich rufe Galerie-Artikel über Kategorien auf und erhalte nicht nur ein Vorschaubild mit einem ersten Textteil, sondern den ganzen Text und die komplette Galerie. Wenn ich den Artikel auf Standard setze, verschwindet die Galerie in der Übersicht und längerer Text wird auch entsprechend gekürzt und mit „Weiterlesen“ versehen. Allerdings ist dann auch das Vorschaubild weg. Das hätte ich aber schon gern.

    Kann mir bitte wer über den Zaun helfen?

    Danke,
    Jochen

  6. Hallo Ellen, guter Beitrag und vieleicht die richtige adresse in meinem Fall da ich schon seid längerer Zeit versuche hinter einem Bild, mehrere Bilder zu verstecken. Im prinzip möchte ich eine Bilderwand erstellen auf der jedes einzelne Bild für ein eigenes Thema steht. Beim klick auf das Bild sollen dann direkt in z.B. einer lightbox die entsprechenden Bilder angezeigt werden. Ich habe irgendwann einmal sowas bei einem Portfolio WP Theme gesehen, doch leider finde ich diese seite nicht mehr, was allerdings bedeutet das es möglich ist. Ist dir vieleicht solch ein Prinzip bekannt bzw. kennst du ein passendes PlugIn?

    Lg Nenad

Schreibe einen Kommentar

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

Expand sidebarB
DEEN