360 Grad Ansicht mit CSS und Java in Artikelseite einbinden

Hallo Zusammen,

ich weiß das Thema ist schon paar mal diskutiert worden, ich komme aber trotzdem nicht weiter.
Ich habe von meinem Fotografen alle Bilder für die 360 Grad Ansicht inkl. einer CSS Datei und Java Datei bekommen.
Ich will die in einen neuen TAB in der Artikeldetailseite einbinden.

Eigentlich muss ich doch nur den Quellcode aus der index3 Datei meines Fotografen in den TAB Quellcode kopieren und alle Daten im FTP auf die richtige Stelle kopieren, oder ? Nur wo muss ich das hinkopieren, damit gambio das richtig abruft ?

Danke für eure Hilfe.

Hier die Dateien vom Fotografen:

http://www.lacanto.de

 

also die index3.html schon in den Artikel-TAB und den Pfad für die Bilder anpassen,
die thrixty.css unter honeygrid/usermod/css und thrixty.js honeygrid/usermod/javascript/ProductInfo.
Dann sollte das gehen.

 

In dem html code der index Datei sind ja Pfadangaben. Die musst entsprechend anpassen.
Ich würde im /images Ordner einen Unterordner machen z.b. /images/3d/artikelnummer/ ...hier die dateien
und dann im quellcode die entsprechenden Pfade angeben.

Die JS und CSS hat Gerd dir ja schon die Ordner genannt.

 

Hier der Quellcode:

<!DOCTYPE html>
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<script type="text/javascript"src="/lacm/templates/Honeygrid/usermod/javascript/ProductInfo/thrixty.js"></script>
<link type="text/css" rel="stylesheet" href="/lacm/templates/Honeygrid/usermod/css/thrixty.css">
<script>
</script>
</head>
<body style="background: gray;">
<div style="width: 100%; max-width: 660px; margin: auto; border: 5px solid darkblue; background: none; box-sizing: border-box;">
<!-- important -->
<div class="thrixty"
thrixty-basepath="."
thrixty-filelist-path-small=" lacm/images/product_images/3d/small/Filelist.txt"
thrixty-filelist-path-large=" lacm/images/product_images/3d/large/Filelist.txt"
thrixty-cycle-duration="3"
thrixty-reversion="false"
thrixty-sensitivity-x="20"
thrixty-zoom-mode="inbox"
thrixty-zoom-control="progressive"
thrixty-zoom-pointer="minimap"
thrixty-outbox-position="right"
thrixty-autoplay="1"
thrixty-autoload="on"
></div>
<!-- /important -->
</div>
</body>
</html>

 

irgendwo ist noch ein Fehler, es funktioniert noch nicht.

 

die Padangaben für .css und die .js müssen nicht angegeben werden, findet der Shop selbst!

Schicke mal die index3.html und die css/java
Eigentlich ist nur notwendig im Qelltext:
<div class="thrixty"></div>
der Rest kann in eigene-thrixty.js und .css verpackt werden

 

Also - deine html Seiten dürfen keinen neuen head und body und doctype usw aufmachen da die ja schon da sind
das alles

<!DOCTYPE html>
<html lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html" charset="utf-8">
<script type="text/javascript"src="/lacm/templates/Honeygrid/usermod/javascript/ProductInfo/thrixty.js"></script>
<link type="text/css" rel="stylesheet" href="/lacm/templates/Honeygrid/usermod/css/thrixty.css">
<script>
</script>
</head>
<body style="background: gray;">

darf also so nicht sein

 

nur so als Beispiel: habe einen Hersteller mit 360°-Fotos, der hat daraus ein gif gemacht und ich finde es sehr unkompliziert, siehe hier:
(Link nur für registrierte Nutzer sichtbar.)