Spaces. Smartes Cloud Hosting für anspruchsvolle Webprojekte. Loslegen und Spaces testen. Von Mittwald.
Dieter Petereit 18. Januar 2017

WP-VR-View: Virtual Reality mit WordPress

WP-VR-View ist ein WordPress-Plugin, das es dir erlaubt, 360-Grad-Videos und Photospheres in dei­ne Seite ein­zu­bau­en. Betrachten kannst du die VR-Elemente dann im Web und auf mobi­len Geräten. Auch Googles Cardboard wird unter­stützt.

Google Cardboard in Action. (Bild: Google)

WP-VR-View basiert auf der Google-Bibliothek VR View

WP-VR-View von Alexander Tumanov, einem Entwickler aus Bishkek in der kir­gi­si­schen Republik, ist ein Aufsatz für die Google-Bibliothek VR View. Du kannst dich also dar­auf ver­las­sen, dass alle in der Bibliotheksspezifikation genann­ten Plattformen auch tat­säch­lich funk­tio­nie­ren wer­den.

Alexander stellt ein klei­nes Video zur Verfügung, in dem er alle Anwendungsfälle nebst Vorgehensweise zeigt:

Das Einbinden von Photospheres oder 360-Grad-Videos funk­tio­niert per Shortcode. Um alles ande­re küm­mert sich das Plugin. Wenn du dir die Shortcodes nicht mer­ken willst oder kannst, ver­wen­de ein­fach die ent­spre­chen­den Buttons im visu­el­len Editor TinyMCE.

Buttons im TinyMCE. (Screenshot: Alexander Tumanov)

Klickst du eine der bei­den Schaltflächen an, öff­net sich ein Dialog-Fenster, in wel­chem du eini­ge grund­le­gen­den Einstellungen vor­neh­men kannst. Erforderlich ist dabei nur die URL zum jewei­li­gen Inhalt. Beachte dabei, dass auch in dei­ner Mediathek etwa vor­han­de­ner Inhalt nicht wie gewohnt ein­ge­fügt wer­den kann. Vielmehr musst du aus der Mediathek die URL zum Inhalt aus­ko­pie­ren und in den Optionsdialog als URL ein­fü­gen.

Optionsdialog zum Einbinden der VR-Elemente. (Screenshot: Alexander Tumanov)

WP-VR-View: Steuerung per Maus und Schwenken/Neigen

Die Steuerung der Inhalte erfolgt am Desktop mit der Maus. Rechts unten am jewei­li­gen Element fin­dest du ein, einem Plus nach­emp­fun­de­nes Piktogramm, mit wel­chem du die Darstellung in den Vollbildmodus umschal­ten kannst. Links dane­ben befin­det sich das Icon zur Umschaltung in den Cardboard-Modus. Dieser bewirkt die Zweiteilung des Videos, um jeweils das lin­ke und rech­te Auge sepa­rat zu bespie­len.

Beispielinhalt mit Steuerungssymbolen unten rechts

Im Cardboard-Modus, wie auch gene­rell bei der Betrachtung über das Smartphone, bewegst du dich inner­halb der vir­tu­el­len Realitäten durch das Bewegen des Smartphones sel­ber. Schwenkst du das Smartphone nach rechts, wan­dert der Bildausschnitt in die­se Richtung mit. Abgesehen von der Reaktionsverzögerung, die abhän­gig von der Leistung des Betrachtergeräts ist, ent­steht so der Eindruck, dass du tat­säch­lich in eine ande­re Richtung schaust.

WP-VR-View ist erhältlich über WordPress und Github

Wenn du schon jetzt mit VR in WordPress expe­ri­men­tie­ren willst, ist WP-VR-View das Mittel der Wahl. Das Plugin wird unter GPL als Open Source ver­trie­ben. Im WordPress-Plugin-Verzeichnis steht noch die älte­re Version 1.6 bereit, wäh­rend du auf Github schon die aktu­el­le Version 2.1 fin­dest, die Alexander erst vor einer Woche fer­tig gestellt hat.

Wenn du es dir ein­fach machen willst, instal­lierst du das Plugin aus dem Backend her­aus über Plugins Installieren. Hier gibst du über das Suchfeld rechts oben den Begriff wp-vr-view ein und drückst Enter. Im danach erschei­nen­den Suchergebnis wählst du das ers­te Plugin direkt oben links. Du siehst, dass es noch ande­re PLugins gib­nt, die eben­falls teils auf Googles Bibliothek set­zen. Allerdings hat kei­nes der ande­ren Plugins auch nur annä­hernd die Zahl an Installationen vor­zu­wei­sen, die WP-VR-View schon für sich in Anspruch neh­men kann. Nachdem du das Plugin in der Version 1.6 instal­liert und akti­viert hast, war­test du schlicht auf die Update-Benachrichtigung zur Version 2.1.

Dieter Petereit

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design.

Schreibe einen Kommentar

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