Hilfe beim jQuery-Plugin

Thema wurde von ficius, 16. August 2017 erstellt.

  1. ficius
    ficius Erfahrener Benutzer
    Registriert seit:
    23. August 2011
    Beiträge:
    120
    Danke erhalten:
    0
    Danke vergeben:
    16
    Hallo,

    ich bin zwar seit 15 Jahren online Händler, aber einen neuen Shop habe ich vor 10 Jahren das letzte mal aufgesetzt und verstehe von all dem wirklich wenig.

    Nun habe ich eine Verständnisfrage zum jQuery-Plugin.

    Leider kann ich euch keinen link zum Shop schicken da dieser noch nicht online ist.

    Ich möchte über den content manager ein Bild mit meheren Imagemaps darauf auf die Startseite laden. das war auch kein Problem, nur ist dieses jetzt nicht responsive. Das, so habe ich erlesen kann ich mit dem jQuery-Plugin hinbekommen.

    Jetzt die erste Frage dazu:
    Nun habe ich dieses Plugin "jquery.rwdimagemaps.min.js". Dies lade ich ins Hauptverzeichnis meines Shops ?

    Dann habe ich mit dem Program CoffeeCup ImageMapper die Datei erstellt.
    Dazu die nächste Frage.

    Als erstes soll ich nun den nachfolgenden Code nach dem <body> Tag einfügen. Also im Content Manger einfach im Quelltext Editor einfügen?
    Code:
    <!-- Beginning of CoffeeCup Image Map -->
    <img src="kategorien-startseite.jpg" usemap="#kategorien-startseite" border=0>
    <map name="kategorien-startseite">
      <area name="Dreamgirl" shape="rect" coords="23,8,437,192" href="http://www.mimoli-dessous.de/de/marken/Red-Diamant--black-Diamant--Fetisch-Diamant-oder-Kostuem-Diamant--Dreamgirl/"  alt="Dreamgirl" title="Dreamgirl" OnMouseOver="window.status='Dreamgirl'; return true" OnMouseOut="window.status=''; return true" target="_self">
      <area name="Dorina" shape="rect" coords="520,9,935,188" href="http://www.mimoli-dessous.de/de/marken/dorina/"  alt="BHs und Slips von Dorina" title="BHs und Slips von Dorina" OnMouseOver="window.status='Dorina'; return true" OnMouseOut="window.status=''; return true" target="_self">
      <area name="Manstore Underwear" shape="rect" coords="5,226,456,391" href="http://www.mimoli-dessous.de/de/marken/manstore/"  alt="Manstore Underwear" title="Manstore Underwear" OnMouseOver="window.status='Manstore Underwear'; return true" OnMouseOut="window.status=''; return true" target="_self">
      <area shape="rect" coords="497,215,952,395" href=""  alt="" title="">
      <area shape="rect" coords="980,14,1428,194" href=""  alt="" title="">
      <area name="Naturana" shape="rect" coords="979,217,1425,387" href="http://www.mimoli-dessous.de/de/marken/naturana/"  alt="BHs und Slips von Naturana" title="BHs und Slips von Naturana" OnMouseOver="window.status='BHs und Slips von Naturana'; return true" OnMouseOut="window.status=''; return true" target="_self">
    </map>
    <!-- End of CoffeeCup Image Map -->
    
    Danach soll ich bevor der <body> Tag schließt diesen code einfügen.
    Code:
    <!-- Beginning of CoffeeCup Image Map Responsive Scripts -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="jquery.rwdImageMaps.min.js"></script>
    <script>$(document).ready(function(e) {$('img[usemap]').rwdImageMaps();});</script>
    <!-- End of CoffeeCup Image Map Responsive Scripts -->
    
    Und als letztes, und da weiß ich nun gar nicht was ich machen soll, soll ich folgenden File auf meinen Server laden. Ich frage mich, wo denn auf dem Server? In die jquery Datei?
    Code:
    C:\Users\xxxxxxxx\xxxxxxxxxx\xxxxxxxxx\kategorien-startseite_exported\jquery.rwdImageMaps.min.js
    C:\Users\xxxxxxxx\xxxxxxx\xxxxxxxx\kategorien-startseite_exported\kategorien-startseite.jpg
    
    Sorry für die dummen Fragen, aber ich bin da echt überfordert.

    LG

    Anette
     
  2. Dennis (MotivMonster.de)
    Dennis (MotivMonster.de) G-WARD 2013/14/15/16
    Registriert seit:
    22. September 2011
    Beiträge:
    31.303
    Danke erhalten:
    6.268
    Danke vergeben:
    1.118
    Beruf:
    Mann für alles :)
    Ort:
    Weilburg
    viele funktionen sind im Bootstrap und gambio-JS schon enthalten.
    Wenn du eigenes JS brauchst kannst die datei einfach im Template /usermopd/js ordner unterbringen in dem Ordner wo du den code im Shop benötigst. Ordner darin sind eigentlich selbsterklärend anhand der namen
    ja, das ja die stelle wo es erscheinen soll
    das müsste dann in den header entweder im usermod ordner oder per overload an den header anhängen.
    die 2 sind einmal dein JS und einmal dein Bild.
    JS wie oben schon beschrieben riecht eigentlich im usermod ordner da der shop das dann einbindet ohne weitere eingriffe, der sucht immer die ordner ab.
    Bilder kannst in /images/wunschordner unterbringen.
     
  3. ficius
    ficius Erfahrener Benutzer
    Registriert seit:
    23. August 2011
    Beiträge:
    120
    Danke erhalten:
    0
    Danke vergeben:
    16
    Noch mal nachgehakt,

    Das heißt, wenn ich die Datei auf der Startseite benötige lade das jquery.rwdimagemaps.min.js in den Ordner Template /usermopd/js/Index

    Code:
    <!-- Beginning of CoffeeCup Image Map Responsive Scripts -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="jquery.rwdImageMaps.min.js"></script>
    <script>$(document).ready(function(e) {$('img[usemap]').rwdImageMaps();});</script>
    <!-- End of CoffeeCup Image Map Responsive Scripts -->
    Das verstehe ich nicht. In welchen Usermod Ordner? Speichere ich das als Datei und lade es dann in den, welchen auch immer, Usermod Ordner? Oder füge ich das an irgendeine bereits bestehende Datei ein die im usermod Ordner liegt?
    Wenns einfacher ist hänge ich das auch gerne per overload an den header, nur weiß ich auch hier nicht wie?:(

    Sorry, wernn das für Euch Profis dumm rüber kommt. Aber auch hier noch mal nachgefragt.
    speichere ich das <<
    C:\Users\xxxxxxxx\xxxxxxxxxx\xxxxxxxxx\kategorien-startseite_exported\jquery.rwdImageMaps.min.js>>>>> als Datei ab und lade es dan in den usermod ordner index.

    Hey, aber das mit dem Bild habe ich verstanden. :D

    Danke für eine etwas genauere Erklärung ;)
     
  4. Dennis (MotivMonster.de)
    Dennis (MotivMonster.de) G-WARD 2013/14/15/16
    Registriert seit:
    22. September 2011
    Beiträge:
    31.303
    Danke erhalten:
    6.268
    Danke vergeben:
    1.118
    Beruf:
    Mann für alles :)
    Ort:
    Weilburg
    Ja genau es gibt einen Ordner /template/honeygrid/usermod/js/xxxx
    da kopierst einfach die JS Datei rein. Dann läd der Shop die ohne das die im header extra einbauen musst.