[GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

marc164 · 18. Januar 2015 20:51

Guten Abend,
nachdem ich schon bei der Installation Probleme hatte
http://www.cmsmadesimple.de/forum/viewt … 411#p33411
wird jetzt im mitgelieferten Gallery Template Cycle das Bild abgeschnitten.

Server-Software Apache
Server-API cgi-fcgi
Server-Betriebssystem Linux 2.6.32-042stab094.8 An x86_64
Prüfung auf PHP-Version 5.2.4+ Ihre Einstellung 5.6.4

Die Safari Konsole meldet

Hier klicken, um den Code zum Kopieren zu markieren

[Log] [cycle2] --c2 init-- (jquery.cycle2.min.js, line 6)
[Log] [cycle2] fx: scrollHorz (string) (jquery.cycle2.min.js, line 6)
[Log] [cycle2] timeout: 4000 (number) (jquery.cycle2.min.js, line 6)
[Log] [cycle2] speed: 600 (number) (jquery.cycle2.min.js, line 6)
[Log] [cycle2] pauseOnHover: true (boolean) (jquery.cycle2.min.js, line 6)
[Log] [cycle2] slides: > .NewsSummary (string) (jquery.cycle2.min.js, line 6)
[Error] TypeError: undefined is not a function (evaluating '$('#slider').nivoSlider')
	(anonyme Funktion) (init.js, line 24)
	n (jquery.min.js, line 2)
	fireWith (jquery.min.js, line 2)
	ready (jquery.min.js, line 2)
	B (jquery.min.js, line 2)

Wobei der Nivo Slider vom buddy template verwendet wird.

Ich fand Cycle eigentlich ganz schön und würde das gern einsetzen.

Hat vielleicht jemand eine Idee?
Markus

NaN · 19. Januar 2015 08:46

Kann man das mal irgendwo sehen?
Dieses "undefined is not a function" deutet darauf hin, dass die Variable "$" ( = jQuery) nicht definiert ist.
Das passiert z.B. wenn jQuery erst nach dem Aufruf des NivoSliders geladen wird, oder wenn weiter oben die Funktion "$.noConflict();" verwendet wird. Bei letzterem müsste man das "$" in "jQuery" ändern oder seine Scripte in eine selbstaufrufende anonyme Funktion packen:

Hier klicken, um den Code zum Kopieren zu markieren

(function ($) {

    $('#slider').nivoSlider ...

})(jQuery);

marc164 · 19. Januar 2015 13:27

Hallo NaN,
vielen Dank für die schnelle Antwort.
Sehen kann man das unter
http://www.keramik-haus-rheinsberg.de/k … gen/kannen
Markus

Klenkes · 19. Januar 2015 14:55

Das Thumbnail hat eine Breite von 300px und eine Höhe von 120px und wird per crop beschnitten.
Was hast du als Templateeinstellungen im Gallerytemplate drin?

Des Weiteren lädst du erst jQuery 1.7.1 und später nochmal jQuery 1.5. Das führt natürlich zu Problemen.

NaN · 19. Januar 2015 15:10

Du bindest jQuery zweimal mit unterschiedlichen Versionen ein. Einmal die 1.7.1 und einmal die 1.5.2. Kann sein, dass die sich in die Quere kommen. Mach da erstmal eins draus.
Wenn Du den Nivo-Slider nicht brauchst, dann nimm aus dem Javascript (/uploads/tpl-buddy-008/init.js) die Funktion mit dem NivoSlider raus.
Ändere außerdem im Template den Link zu jQuery auf die aktuellere Version und nimm jQuery aus dem Gallery-Template raus.

Abgesehen davon liegt der Fehler mit dem agbeschnittenen Bild daran, dass im Cycle Plugin nur die Vorschaubilder angezeigt werden, nicht die Original-Bilder. Und die Vorschaubilder scheinen abgeschnitten zu sein. Hat also nichts mit dem Javascript zu tun, sondern mit der Art und Weise wie Vorschaubilder erstellt werden sollen. Ich glaube das kann man im Gallery-Template einstellen.

Edit: Crosspost roll

marc164 · 19. Januar 2015 15:35

Vielen Dank.
Also ich habe erstmal im Gallery-Template die Einstellungen geändert: 300x300px und jQuery auf 1.7.1
Sieht schon etwas besser aus. Aber nicht wie unter
http://jquery.malsup.com/cycle/lite/
Ich meine z.B. Rahmen und Schrift.
Woran liegt das? Sorry, hab keine Ahnung von html, java und so.

Den Nivo-Slider hätt' ich gern behalten. Da behalte ich wohl auch die Fehlermeldung? Auf Seiten ohne das Gallery-Cycle Template kommt's nicht. Scheint aber auch kein für Otto Normal sichtbares Problem zu sein - ?

Grüße

markus

marc164 · 19. Januar 2015 15:41

OK, ich denk ich hab wieder was begriffen.

Also im Gallery-Template Skalierungsmethode auf Skalieren setzen funktioniert deutlich besser. Dann wird auch der Bildtitel netter gesetzt.

Danke!

markus

marc164 · 19. Januar 2015 16:30

Doch ein Problem. Der Nivo-Slider aus dem buddy template und cycle scheinen irgendwie zu kollidieren. Wenn gallery-template cycle eingefügt ist, dann wird der header slider nicht angezeigt. Immernoch
http://www.keramik-haus-rheinsberg.de/k … gen/kannen

Für die Startseite sollte aber beides zusammen laufen. Hat jemand eine Idee?

NaN · 20. Januar 2015 09:15

Sorry, hab keine Ahnung von html, java und so.

Dafür musst Du Dich nicht entschuldigen wink

Ich meine z.B. Rahmen und Schrift.
Woran liegt das?

Das ist eine Sache der Formatierung.
Das macht man über die Stylesheets.
In dem Falle über das Gallery-Template.

Wie soll es denn aussehen?
Genauso wie in der Demo?
Dann füge im Gallery-Template im Stylesheet mal folgendes ein:

Hier klicken, um den Code zum Kopieren zu markieren

#slides img, 
#caption {
    padding: 15px;
    border: 1px solid #ccc;
    background-color: #eee;
}

#caption {
    margin: 6px 12px;
    width: 290px;
}

Dann hast Du diesen grauen Rand um die Bilder und um die Bildbeschreibung - wie in der Demo.

Was Dein Problem mit den beiden Slidern angeht, dazu musst Du nicht viel Ahnung haben, um folgendes Prinzip zu verstehen:

Du lädst jQuery doppelt.

Auf der Startseite hast Du im <head> lediglich folgendes stehen:

Hier klicken, um den Code zum Kopieren zu markieren

<!-- JAVASCRIPT CALLS -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="/uploads/tpl-buddy-008/jquery.nivo.slider.pack.js" type="text/javascript"></script>
<script src="/uploads/tpl-buddy-008/jquery.cycle2.min.js" type="text/javascript"></script> 
<script src="/uploads/tpl-buddy-008/init.js" type="text/javascript"></script>
<!-- END JS CALLS -->

D.h. Du hast jetzt eine jQuery Instanz bei der sich NivoSlider und Cycle2 registrieren. D.h. jQuery hat eine Variable über die es die beiden Plugins ansteuern kann.

Aber auf der Seite, wo es nicht funktioniert, wird danach zusätzlich nochmal das geladen:

Hier klicken, um den Code zum Kopieren zu markieren

<!-- Gallery/Cycle -->
<link rel="stylesheet" href="http://www.keramik-haus-rheinsberg.de/modules/Gallery/templates/css/Cycle.css" type="text/css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="modules/Gallery/templates/cycle/jquery.cycle.lite.js"></script>

D.h. es wird nochmal jQuery und das Plugin Cycle-lite geladen.

Der zweite jQuery-Aufruf überschreibt aber die erste jQuery Instanz mit all seinen Variablen und somit auch mit all seinen bis dahin bereits registrierten Plugins. Und dadurch gehen sowohl der NivoSlider als auch Cycle2 verloren.

Es gibt am Ende also nur noch eine neue jQuery-Instanz mit dem Plugin Cycle-Lite.

Woher kommen diese beiden Aufrufe?
Der erste ist völlig okay. Der lädt alles was Du brauchst.
Der zweite muss angepasst werden. Das jQuery muss da raus.
Ich vermute, der zweite Aufruf steht im Gallery-Template.

marc164 · 20. Januar 2015 09:21

Vielen Dank für die ausführliche Erklärung, jetzt habe ich auch etwas vom dahinter liegenden Prinzip verstanden, das hilft sehr. Werde ich nachher gleich machen, muss erst noch in die Werkstatt…

Viele Grüße
Markus

marc164 · 20. Januar 2015 11:13

Also ich habe

Hier klicken, um den Code zum Kopieren zu markieren

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

rausgelöscht - es funktioniert! Danke!
Markus

Forum für CMS/made simple

#1 18. Januar 2015 20:51

[GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#2 19. Januar 2015 08:46

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#3 19. Januar 2015 13:27

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#4 19. Januar 2015 14:55

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#5 19. Januar 2015 15:10

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#6 19. Januar 2015 15:35

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#7 19. Januar 2015 15:41

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#8 19. Januar 2015 16:30

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#9 20. Januar 2015 09:15

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#10 20. Januar 2015 09:21

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

#11 20. Januar 2015 11:13

Re: [GELÖST] Gallery-Template Cycle funktioniert nicht wie vorgesehen

Fußzeile des Forums