Dokumente in WordPress innerhalb Content anzeigen

 In Snippets, Tipps und Tricks, Wordpress

Immer wieder kommt die Frage danach, insbesondere von Vereinen oder Restarants, eigene Excel-Tabellen oder PDF-Dateien innerhalb der WordPress-Seite anzeigen zu lassen.
Dabei ist das mit Hilfe eines Code-Snippets sehr einfach zu realisieren und kann in Zukunft immer per Shortcode-Eingabe an einer beliebige Stelle innerhalb eine WordPress-Seite angezeigt werden.

Dazu muss folgender Code in die functions.php ihres aktiven Themes oder ein neuer Snippet innerhalb des Plugins Code-Snippets eingefügt werden.

/* GOOGLE DOCUMENT VIEWER */
function doc_viewer($atts, $content = null) {
  extract(
    shortcode_atts(
      array( 
        "url" => 'http://', // URL-Pfad zum Dokument
        "class" => '',      // Einfügen einer Klasse zum individuellen anpassen im CSS
        'width' => '700',   // Breite des angezeigten Dokumentes
        'height' => '400'   // Höhe des angezeigten Dokumentes
      ),
    $atts)
  );
  return '<iframe width="'.$width.'" height="'.$height.'" src="http://docs.google.com/viewer?url='.$url.'&embedded=true" class="'.$class.' googleviewer"></iframe>';
}
add_shortcode("doc", "doc_viewer");

Das war's auch schon, ab nun an kann ein beliebiges Dokument über Medien --> Datei hinzufügen in WordPress hochgeladen werden. In der Detail-Ansicht des Dokumentes finden Sie den genauen Pfad zum Dokument.

Detail-Ansicht einer Datei in WordPress

Quelle: Eigener Screenshot

Jetzt kann das Dokument an beliebiger Stelle einer Seite mittels eines Shortcodes wie folgt aufgerufen werden.

Beispiel online ansehen


[doc url="http://ihre-seite-de/url-zum-dokument" class="individuelle class zum stylen" width="600" height="600"]

Animiert wurde ich dazu, auf der Suche zu einem Kundenprojekt, durch ein Snippet von Gino Cremer auf GitHub. Vielen Dank dafür!!!

Recommended Posts
support
icon
Wie können wir helfen?
Close
call
+49 6734 4973573
menu-icon
Support Ticket
Code Snippets @eigenes Screenshot