Frisch notiert!

Die neusten Artikel aus unserem Blog.

WordPress Plugin Miniloops ganz einfach mit Shortcodes erweitern!

Zuletzt aktualisiert am 18/08/2016 von Adrian Lambertz
2 Kommentare
Wordpress
/ Wordpress / 2

Vor kurzem standen wir bei einer Webentwicklung vor einem Problem. Und zwar nutzten wir das WordPress Plugin „Miniloops“ (welches wir in einem anderen Posting ebenfalls vorgestellt haben) für eine spezielle Ausgabe verschiedener Artikel.

Wer schonmal mit Miniloops gearbeitet hat, weiss, was dieses mächtige Plugin kann. Dennoch sind wir da nun an eine Grenze gestoßen, die es zu durchbrechen galt. Im Prinzip ging es darum:

Es wurden Artikel aus einer Kategorie ausgelesen und das „Featured Image“ (Artikelbild) in der Auflistung als Thumb ausgegeben. Daneben war der Titel des Artikels und ein kleiner Anreisser mit einem „Weiterlesen“ Link. So weit, so gut, da wir in einem WP – PHP – Template arbeiteten und nicht in einem Widget, passten wir alle Parameter wie Kategorie, Reihenfolge etc. in den $args an und nutzen für die Ausgabe ein simples <ul><li> inklusive der [ml_image], [ml_title] und [excerpt] Tags. Ein wenig CSS und schon stand die Ausgabe.

Dann kam der Kundenwunsch, dass das Featured Image (Artikelbild) doch bitte anklickbar sein sollte und sich in der Lightbox (wir nutzen Fancybox) vergrößern sollte.

So weit, so gut – auf der Miniloops Plugin Seite geschaut, jedoch nirgendwo das passende gefunden. Im Prinzip brauchten wir „nur“ die URL des Artikelbildes in voller Größe. Wie also nun die Ausgabe so anpassen, dass diese mit ausgegeben wird? Eigenes PHP in die Ausgabe? Nicht machbar. Dann kam uns die Idee: Shortcodes. Warum Shortcodes?

Schaut man sich die Miniloops Ausgabe genauer an, arbeitet sie sogar schon mit kleineren Shortcodes wie „[ml_image]“, „[ml_title]“ und „[excerpt]“.

Also einen eigenen Shortcode schreiben:

//Mini Loops ShortCode getThumbURL
function ml_get_large_url( $atts ){
$large_image_url = wp_get_attachment_image_src( get_post_thumbnail_id(get_the_ID()), 'large');
return $large_image_url[0];
}
add_shortcode( 'ml_largeurl', 'ml_get_large_url' );

Dieser kann einfach in die functions.php geschrieben werden. Da wir hier allerdings schon in einer Template .php Datei waren, haben wir sie direkt in dieser geschrieben.

In dem Array $large_image_url wird die Large – URL und die Höhe und Breite des Postthumbnails gespeichert. Das Return gibt den Wert des String $large_image_url[0] (die URL) zurück. Da wir den Shortcode in einem Loop (von Miniloops) ausführen werden, funktioniert get_the_id() zum Abfragen der ID des Thumbs einwandfrei.

Mit add_schortcode machen wir aus der Funktion „“ml_get_large_url()“ einen Shortcode [ml_largeurl]. WICHTIG: der Shortcode MUSS mit „ml_“ beginnen, sonst erkennt Miniloops ihn nicht.

Nun gehts ans Testen. In die Ausgabe ein <a> Tag mit dem href [ml_largeurl] und unserer Klasse, auf die die Fancybox greift. Abspeichern, fertig.

So sieht die Ausgabe nun aus:

'item_format' => '
<li class="[ml_class]">
<article>
<a href="[ml_largeurl]" class="xf-fancybox">[ml_image width=150 height=75 from=thumb cache=clear]</a>
<h3>[ml_title]</h3>
<span>[excerpt length=200 space_between=1 up_to_more=1 after="" after_link=0]</span>
</article>
</li>'

Un siehe da, es klappt! Und das funktioniert nach eigenen Tests mit praktisch jedem Shortcode den wir festlegen.

Habt ihr eigene Verwendungszwecke für solche Shortcodes in Miniloops? Dann postet sie in die Kommentare, wir sind gespannt.

Adrian Lambertz

Seit 2010 bin ich nun schon bei Pixelbar mit dabei. Zuerst als Auszubildender und nach erfolgreichem Abschluss meiner Ausbildung als Frontend-Entwickler. Ohne Musik und Kaffee kann ich nicht leben, daher konsumiere ich beides während der Arbeit praktisch durchgehend :). Daneben liebe ich WordPress - darauf habe ich mich spezialisiert.

Weitere Beiträge von adrian anzeigen

2 Kommentare

  1. Hallo Adrian,

    ich bin Neuling, was WordPress anbelangt, wenn auch kein blutiger Anfänger mehr.

    Allerdings schlage ich mich jetzt schon ein paar Tage mit folgender Problematik rum:

    Ich möchte folgeödendes ausführen lassen:

    Allerdings kann mein WordPress diesen Sportcode nicht ausführen, weil es ein Sportcode eines Plugin ist.

    Ich habe viel im Netz gefunden, aber leider keine für mich nachvollziehbare Beschreibung, was ich tun muss.

    Kannst Du mir helfen?

    Ich nutze die aktuellste WP Version und ein Theme von MySiteMyWay.

Kommentar hinterlassen

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