Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

Panoramafotografie: Virtuelle Touren mit Panotour Pro

HTML-Vorlagen hinzufügen

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Standardmäßig erstreckt sich die virtuelle Tour formatfüllend auf die komplette HTML-Seite. Durch Hinzufügen externer HTML-Vorlagen werden allerdings interessante Konstruktionen möglich, bei denen Ihre Panoramen auf der Tour mit der umgebenden HTML-Seite kommunizieren können.

Transkript

Eine weitere Möglichkeit "Panotour Pro" zu erweitern oder zu verändern, teilweise sogar wirklich massiv, ist der Umgang mit anderen HTML-Templates. Wenn wir bei "Panotour Pro" in das "Erstellen"-Tab gehen, dann sehen wir hier zwei HTML-Templates. Sie sind beide relativ basic. "fullpage" wird meistens verwendet, weil dort einfach das Panorama die Seite komplett ausfüllt. Wunderbar zum Einbinden und ähnliche Geschichten. "generic" hat ein bisschen was drumherum. Also, meistens wird "fullpage" verwendet. Das kann aber noch wesentlich mehr, und das finden Sie auch in der Supportabteilung von Kolor. Die Seite zu "Panotour" und dort, wie man diese HTML-Templates einbaut und wo die hinkommen und was die können. Hier ist zunächst einmal erklärt, wie Sie die einbinden. Das ist ganz ähnlich, wie das, was ich zuvor mit dem Plugin und dem Plugin-Ordner erzählt habe. Einfach in den User-Ordner, und dort [unverständlich] Plugin, sondern HTML. Wobei manche HTML-Templates auch noch Plugins brauchen, damit sie funktionieren. Ich mache das jetzt bei meinem Projekt mal nicht, weil man dann erstmal gründlich aufräumen muss, sondern ich zeige mal kurz was her, wie man sich das in etwa vorstellen muss. Hier ist, zum Beispiel, ein Download: "Bootstrap External Commands with Colors". "Bootstrap" ist ein Framework, was sehr, sehr beliebt ist, das responsiv ist und mit Mobil-Devices sehr gut umgehen kann. Es ist im Moment in aller Munde. Webdeveloper wissen wovon ich rede. Und das kann eine ganze Menge das Ding. Ich klicke jetzt mal hier drauf und schaue mir das mal an, wie das in etwa aussieht. Also, hier hat man einfach, zum Beispiel oben, eine Menüleiste, über die man das gesamte Panorama steuern kann. Da ist fix unten so eine Gallery drin. Relativ kleines Interface. Und das schöne an Bootstrap ist, dass sich das sozusagen bei zusammengezogenem Bildschirm einfach entsprechend responsiv verhält, und auch das eben kann, was zum Beispiel "Panotour Pro", was wir vorhin gesehen haben. Bestimmte User-Interface-Elemente einfach rausschmeißen kann, wenn der Bildschirm kleiner wird. Ich mache mal hier "View Demo" und wir schauen uns das mal an, wie das aussieht. Das ist jetzt hier dieses Bootstrap. Das ist, zum Beispiel, eine Tour auch mit mehreren Gruppen aber auch einzelnen Panoramen. Also hie ist, zum Beispiel, eine einzelne Kirche. Und dann gibt es Gruppen von hier, von einem Fort, zum Beispiel. Das ist ein recht schönes Demo-Beispiel. Und ich kann mich hier bewegen. Unten habe ich meine Thumbnails. Und jetzt sehe ich also hier, zum Beispiel, auch andere Gruppen und so weiter und so fort. Und wenn ich jetzt hier den Schirm nehme und ziehe den mal zusammen, dann rückt das zusammen. Man sieht jetzt, dass oben umgebrochen wird. Irgendwann wird das Menü dann zu lang für die Seite, dann kommt hier oben so ein Hamburger-Menü, dass dann praktisch hier einfach so eine Seite aufmacht, -- Sie kennen das von mobilen Webseiten. -- und dann wird das hier aufgefaltet. Und das sind so Sachen, die kann Bootstrap. Das ist ein Framework aus verschiedenen Bibliotheken, die diese Sachen ermöglichen, relativ fein. Und wenn man das noch weiter treibt, dann wird irgendwann mal auch das Menü umgebrochen. Aber man sieht, dass hier, zum Beispiel, dann schon abhängig von der Bildschirmbreite, einzelne Menüelemente rausfliegen. Und das ist ganz nett einfach für solche Geschichten. Und dieses Bootstrap ist halt eine recht nette Engine für diese ganzen Geschichten. Da gibt es verschiedene Möglichkeiten die man da hat. Also, gibt unterschiedliche Sachen, die in dem Paket drin sind. Da gibt es noch mehrere Sachen, die da drauf basieren, und man kann also jetzt hier noch runter scrollen, und da gibt es, zum Beispiel, die Geschichte mit einem anderen Menü. Und das ist eigentlich auch ganz interessant hier. Das nimmt nämlich Beschreibung und Titel. Das was bei uns aus der linken Seite rauskommt in die Website um das Panorama herum. Eigentlich auch relativ sehenswert und interessant, und sicher für manche Projekte absolut reizvoll. Also, man sieht jetzt hier die Beschreibung von der Gruppe, die Beschreibung vom Gesamtprojekt, die Beschreibung von Panorama. Und oben ist es eigentlich ganz gleich. Also, hier sieht man eben auch die nächste Szene, und oben ist es recht gleich, wie vorhin. Und das lässt sich alles mit CSS formatieren, was hier ist. Also, das ist im Prinzip alles Standardtechnologie. Und hier ist, zum Beispiel, witzigerweise auch die Navigation von dem Panorama unten drunter. Das geht auch, und das ist, zum Beispiel, was ich bereits erwähnt habe. Das ist die Möglichkeit einfach im Panorama Befehle zu empfangen von draußen einfach über JavaScript. Und hier kann man eben dann so Popups machen, die ganz anders ausschauen, zu dem einzelnen Panorama oder auch die Hilfedatei. Also, hier ganz anders integriert. Und da aber der ganze Output auch das, was wir bis jetzt gesehen haben aus HTML5 und JavaScript und CSS besteht, ist das eigentlich im Prinzip nur eine andere Form der Ausgabe. Der Inhalt selber, das Panorama, die ganzen Thumbnails und die ganzen Texte, das ist alles das gleiche. Und wenn Sie dann hier diese Sachen einbinden, das ist genau beschrieben, wie das funktioniert. Also, das braucht dann immer noch zusätzlich ein Plugin, das vor allen Dingen diese Kommunikation von Panorama nach draußen, wenn gewünscht regelt. Einfach nur genau lesen, wie es funktioniert. Das ist relativ gut einzubinden. Ich habe es nur jetzt eben für dieses Projekt jetzt nicht mehr durchgespielt, sondern einfach nur als Hinweis hier gezeigt, und Leute, die sich mit Bootstrap schon ein bisschen auskennen, also vor allen Dingen Webdeveloper, das sind ja auch Leute, die sich mitunter für diese Interactiv- Geschichten interessieren, die wir bei "Panotour Pro" machen, die werden sich da relativ schnell zurecht finden, und da kann man ziemlich interessante Sachen mit machen. Gerde auch größere Touren, die relativ viel mit medialen Inhalten angereichert sind und ähnlichen Dingen mehr, die schon ein bisschen komplexer sind, kann man hier streckenweise in einer wirklich schöne Art und Weise aufbereiten. Das wären in diesem Video ein paar Bemerkungen zum Thema HTML-Templates, was die können und wie man die installieren kann beziehungsweise, wo man die herbekommt.

Panoramafotografie: Virtuelle Touren mit Panotour Pro

Lernen Sie, wie Sie aus einzelnen Panoramen eine interaktive, klickbare Besichtigungs-Tour für die Präsentation im Web erstellen.

8 Std. 49 min (75 Videos)
Derzeit sind keine Feedbacks vorhanden...
 

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!