euro-designBez kategoriiNo comments
Rate this post

Aby hostować prezentacje bezpośrednio ze swojego serwera potrzebujesz co najmniej:

  • serwer

  • własna kopia ORBITVU VIEWER

  • prezentacje

  • trochę technicznej wiedzy odnośnie HTML i administracji serwerem

Wdrożenie

  • Skopiuj katalog z ORBITVU VIEWER, czyli orbitvu12/ na swój serwer

  • Skonfiguruj swój serwer HTTP tak by pliki z folderu orbitvu12/ były dostępne pod jakimś adresem, np: http://twojadomena.pl/orbitvu12/

  • Skopiuj foldery z prezentacjami na swój serwer

  • Skonfiguruj swój serwer tak by pliki prezentacji były dostępne pod jakimś adresem, np.: http://twojadomena.pl/presentations/

  • Dodaj nagłówek Access-Control-Allow-Origin *; do URL-i VIEWER-a i prezentacji aby uniknąć problemów z CORS

  • Jeśli zamierzasz hostować pliki Oribtvu VIEWER i pliki prezentacji z różnych domen wówczas musisz też obsłużyć kwestie zabezpieczeń Flash. Dodaj plik crossdomain.xml do domeny wskazywanej przez parametr ovus_url.

  • Utwórz strony www które używają Twojej kopii ORBITVU VIEWER i url-i Twoich prezentacji (szczegóły poniżej)

Informacja:
Aby prezentacja działała z Facebook musisz także kupić i skonfigurować certyfikat SSL dla swojej domeny


Informacja:
Aby sprawdzić ewentualne problemyz CORS powinieneś użyć wersji HTML5 VIEWER-a. Wyłącz Flash w przeglądarce lub ustaw parametr force_html5 na wartość yes


Ostrzeżenie:
Jeśli pliki prezentacji są hostowane z innej domeny niż ta której używa Twoja strona, wówczas musisz ustawić nagłówek Access-Control-Allow-Origin *; sprawdź poniżej w najczęściej zadawane pytania

Kodowanie strony www

  • Załaduj skrypty ORBITVU VIEWER

    Możesz dodać skrypty do sekcji <head> strony.
    <script type=„text/javascript” src=„http://yourdomain.com/orbitvu12/swfobject.js”></script>
    <script type=„text/javascript” src=„http://yourdomain.com/orbitvu12/orbitvu.js”></script>

    Informacja:
    Musisz użyć adresów URL do plików VIEWER-a znajdujących się na Twoim serwerze.

  • Utwórz element będący kontenerem dla prezentacji

    Utwórz element/nazwę kontenera do którego wstawiona zostanie prezentacja. Wymagane jest ustawienie unikalnego identyfikatora dla tego elementu czyli nazwa twojej prezentacji

    <div id=„twojaprezentacja1-container”></div>


    Informacja:
    Jeśli chcesz mieć kilka prezentacji na jednej stronie wówczas dla każdej z nich utwórz element kontenera z unikalnym id.

  • Zainicjuj prezentację

    Ostatnim krokiem jest wywołanie funkcji JavaScript inject_orbitvu która wstawi prezentacje w element kontenera.

     1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
    		 
    <script type="text/javascript">
    inject_orbitvu(
     'twojaprezentacja1-container',
     'http://yourdomain.com/orbitvu12/orbitvuer12.swf',
     'http://yourdomain.com/orbitvu12/expressInstall.swf',
     {
  ovus_folder: "http://yourdomain.com/presentations/presentation1/",
     content2: 'yes',
     width: "500",
     height: "400"
      });
</script>
    Linia 3:

    id elementu kontenera

    Linie 4-5:

    Adresy URL plików ORBITVU VIEWER (hostowane na Twoim serwerze)

    Linia 7:

    URL do folderu prezentacji (hostowana na Twoim serwerze)

    Linia 8:

    Ustaw na ‘yes’ jeśli w folderze prezentacji istnieje plik content2.xml. W przeciwnym wypadku ustaw na ‘no’ lub usuń ten parametr

    Linie 9-10:

    Inne parametry ORBITVU VIEWER.

    Ostrzeżenie:
    Skrypty pomocnicze muszą być załadowane PRZED wywołaniem inject_orbitvu


    Informacja:
    Jeśli masz kilka prezentacji na stronie wówczas musisz wywołać inject_orbitvu dla każdej z nich

    Informacja:
    Dobrym rozwiązaniem jest wywołanie inject_orbitvu wewnątrz handlera zdarzenia onready

  • Pełny przykład

    Przykład użycia jQuery do wykonywania JavaScript dopiero po załadowaniu strony:

    —————————————————————————————————————————————-

    <!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />

        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script type="text/javascript" src="http://yourdomain.com/orbitvu12/swfobject.js"></script>
        <script type="text/javascript" src="http://yourdomain.com/orbitvu12/orbitvu.js"></script>

        <script type="text/javascript">
            $(function() {
                inject_orbitvu(
                  'twojaprezentacja1-container',
                  'http://yourdomain.com/orbitvu12/orbitvuer12.swf',
                  'http://yourdomain.com/orbitvu12/expressInstall.swf',
                  {
                      ovus_folder: "http://yourdomain.com/presentations/presentation1/",
                      content2: "yes",
                      width: "500",
                      height: "400"
                  });
            });
        </script>
    </head>
    <body>
        <h1>TWÓJ TEKST</h1>

        <div id="twojaprezentacja1-container"></div>
    </body>
</html>

    —————————————————————————————————————————————-


    Informacja:
    Ustaw odpowiedni DOCTYPE dla Twojej strony zwłaszcza dla przegladarki Internet Explorer i trybu HTML5 ORBITVU VIEWER

    —————————————————————————————————————————————-

    Najczęściej zadawane pytania

    Widzę białą stronę – ORBITVU VIEWER nie działa

    Możliwą przyczyną takiego zachowania jest serwowanie plików prezentacji z oddzielnej domeny i blokowanie dostępu do nich przez mechanizmy bezpieczeństa Flash. W takim wypadku musisz dodać plik crossdomain.xml do domeny z której hostowane są prezentacje, np.: http://yourdomain.com/crossdomain.xml. Zawartość pliku crossdomain.xml powinna mieć postać:

    <cross-domain-policy>
  <allow-access-from domain="*" secure="false"/>
  <site-control permitted-cross-domain-policies="all"/>
  <allow-http-request-headers-from domain="*" headers="*"/>
</cross-domain-policy>

    VIEWER nie działa na urządzeniach mobilnych / HTML5

    Android i iOS używają wersji HTML5 ORBITVU VIEWER. Aby zdiagnozować problem wyłącz Flash w przeglądarce na swoim komputerze i sprawdź konsolę błędów. Najczęstszą przyczyną tego problemu jest błędna konfiguracja Twojego serwera powodująca problemy z CORS. Sprawdź czy masz odpowiednio ustawiony nagłówek Access-Control-Allow-Origin *.

    Jeśli serwer www którego używasz to Apache wówczas możesz ustawić nagłówek Access-Control-Allow-Origin * używając następującego pliku (który powinien być umieszczony w folderze z plikami prezentacji)

    • .htaccess:
    <FilesMatch "\.(xml)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

    Prezentacja nie działa na Facebook

    Aby strona działała z Facebook musi ona spełniać pewne wymagania. Sprawdź dokumentację FACEBOOK aby uzyskać szczeegóły. Najczęstsze przyczyny problemów to:

    • brak meta znaczników facebook na Twojej stronie

    • brak https na Twojej stronie

Przykładowa:

euro-design

Leave a comment

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *

Theme: Illdy.

Translate »