Nivo Slider einbauen ... klappt nicht so ganz

Der Nivo Slider ist in v2.2 schon ist. Muss nur aktiviert werden in der cseo_css.php und cseo_javascript.php

Zitat von admin

Der Nivo Slider ist in v2.2 schon ist. Muss nur aktiviert werden in der cseo_css.php und cseo_javascript.php

und wie mache ich das?

Zitat von Nail-Factory

und wie mache ich das?

ok, in der cseo_css.php und cseo_javascript.php habe ich es aktiviert.
also in der cseo_css.php diese zeile $css->setCSS($js_css_path.'nivo-slider.css'); hinzugefügt.

in der cseo_javascript halt diese zeile:
$js->setJS($js_source_path.'jquery.nivo.slider.js');

aber wie binde ich das dann in der main_content.html ein???

kannst du mir bitte mal die genauen schritte sagen?

Hallo Nailfactory,

gebe mal das in der main-content.html ein:

<div class="slider-wrapper theme-default">
            <div class="ribbon"></div>
            <div id="slider" class="nivoSlider">
                <img src="images/toystory.jpg" alt="" />
                <a href="http://dev7studios.com"><img src="images/up.jpg" alt="" title="This is an example of a caption" /></a>
                <img src="images/walle.jpg" alt="" />
                <img src="images/nemo.jpg" alt="" title="#htmlcaption" />
            </div>
            <div id="htmlcaption" class="nivo-html-caption">
                <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
            </div>
        </div>
		<script type="text/javascript" src="javascript/js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="javascript/js/jquery.nivo.slider.js"></script>
    <script type="text/javascript">
    $(window).load(function() {
        $('#slider').nivoSlider();
    });
    </script>

danke kay!
das war´s. hat funktioniert!
er zeigt mir zwar die arrows links und rechts an, aber nicht die bullets unter den bilder. weißt du wie ich das noch hinbekomme?

lg
André

[ATTACH=CONFIG]306[/ATTACH]

ich verzweifel langsam. die buttons sind da, aber unten. siehe bild!
wie bekomme ich die dahin wo sie auch hin sollen? hat jemand einen tipp für mich?

Lösche oder ändere den Wert 'bottom' in der nivo-slider.css bei ca. Zeile 135
.theme-default .nivo-controlNav

Gruß Kay

yo vielen dank, dass war´s

Hallo Zusammen,

auch hier ist einer der am verzweifeln ich habe Schritt für Schritt alles durchgeführt wie beschreiben. Leider ohne Erfolg. Was ich auf der Startseite sehe ist lediglich ein graues Fenster welches ich in der Größe per css anpassen kann mehr ist nicht.

Wo kann nach dem Fehler suchen?

habe die Version 2.2.2.1

Vielen Dank

Grüße
Damian

Hmm Damian.

Auch aufgepast wegen den Version?
Weil anfang dieser Anleitung ist für den v 2.1.x und nicht den V2.2

Beim V2.2. hat am ende hier den Katana und André einiges geschrieben!!
Weil im V2.2.x ist die Standard drin, muss nur den CSS angepasst werden und:
aktiviert werden in der cseo_css.php und cseo_javascript.php und main-content.html

Weil in den V2.2.x ist dies so alles anders wie den v2.1.x sehe auch http://plussupport.commerce-seo.de/showthread.php?t=769

na eigentlich schon. wahrscheinlich ist es eine Kleinigkeit auf die ich gerade nicht komme. Zur aktivierung : cseo_css.php und cseo_javascript.php und main-content.html muss ich da etwas besonderes beachten? habe es wie beschrieben:

Zitat von Nail-Factory

ok, in der cseo_css.php und cseo_javascript.php habe ich es aktiviert.
also in der cseo_css.php diese zeile $css->setCSS($js_css_path.'nivo-slider.css'); hinzugefügt.

in der cseo_javascript halt diese zeile:
$js->setJS($js_source_path.'jquery.nivo.slider.js');

und nix geht

Um sicher zu gehen ist in Admin backend nachher den cache leergemacht?
Und F5 Browser?

Weiter den css dies ist aus Beitrag Admin wegen v2.2: (in template ordner und die Javascript-CSS Dateien im subOrdner css/jscss)

Zitat

In v2.2 wurde einiges an der Grundstruktur geändert, somit ist man nun deutlich flexibler. Die Komprimierung wird nicht mehr über SourceMerger gemacht, sondern über eine neue Komprimierungsklasse. Somit entfallen wieder einmal externe Abhängikeiten

Die CSS Dateien, befinden sich in der v2.2 ALLE im Template Ordner css und die Javascript-CSS Dteien im Ordner css/jscss. Das ermöglicht uns, auch schon mit neuen Templates die Javascripte optisch anzupassen und die Sucherei fällt weg, wo ist denn das CSS für die und die Klasse.

Die Javascripte sind jetzt auf der obersten Ebene eingebunden, im Ordner /javascript/js und /javascript/img für die benötigten Bilder.
Die Javascripteinbindung erfolgt nun über /cseo_javascript.php und /cseo_js_base.php wobei in der cseo_js_base.php nur das jQuery eingebunden wird. Die Trennung ist notwendig, da jQuery immer als Erstes geldaden werden muss, wegen IE Kompatibiliät.
Hier kann man auch neue Scripte einbinden.

Die CSS Dateien werden über die Datei /cseo_css.php und /cseo_css_ie.php eingebunden. Die cseo_css_ie.php wird nur für IE7/8 heran gezogen. In Erster Linie diehnt die Datei für die optimale Darstellung der fluid-Templates im IE 7/8. Es wird im Template CSS Ordner die Datei ie.css gesucht. Ist diese nicht vorhanden, wird die normale stylesheet.css verwendet. Die Grid Templates benötigen keine ie.css, somit entfällt der Mehraufwand.
Auch hier kann man eigene CSS Dteien einbinden.

OJA hier info bei Entwickler dieser slider glaube ich dort kan man auch den Pakete downloaden
http://nivo.dev7studios.com/support/jquery-plugin-usage/

na aber diese sind doch schon integriert oder nicht? .. es sollte doch funktionieren

Vielen Dank für die Infos derweil.

Jein, drin ja aber ofcourse man mus naturlich alles noch richtig Konfigurieren und Aktiv machen und teilweise Uploaden Verzeichnisse richtig setzen ( weil bei jeden kan / sollte die vielleicht anders sein ( Templatename, images/silder verzeichnis und und)

Sehe weiter zurück den beitrag von Katana, über den images und co und naturlich den css und js.css (nivo-slider.css ) für den slider wen die separat da ist

Mein beitrag link zum Entwicklerseite ist auch gedacht als Anleitung für den Slider einstellungen/konfig selbst braucht man naturlich nicht zweimal zu machen, wen es die dort gibt!

cseo_css.php -> um die Nivo css aktualisiert: $css->setCSS($js_css_path.'nivo-slider.css'); -> check
cseo_javascript.php -> um das skript aktualisiert: $js->setJS($js_source_path.'jquery.nivo.slider.js'); -> check

Nivo Files uploaded -> images/themes/ -> Check

die main_content.html -> <link rel="stylesheet" href="images/themes/default/default.css" type="text/css" media="screen" /> CSS des nivo packs erweitert und pfade angepasst-> check
die main_content.html -> um div class="slider-wrapper theme-default">
<div class="ribbon"></div>
<div id="slider" class="nivoSlider">
<img src="images/nivo-slider/toystory.jpg" alt="" />
<a href="http://holz-renz.de"><img src="images/themes/default/up.jpg" alt="" title="This is an example of a caption" /></a>
<img src="images/nivo-slider/walle.jpg" alt="" />
<img src="images/nivo-slider/nemo.jpg" alt="" title="#htmlcaption" />
</div>
<div id="htmlcaption" class="nivo-html-caption">
<strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
</div>
</div>
<script type="text/javascript" src="javascript/js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="javascript/js/jquery.nivo.slider.js"></script>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>

erweitert -> Check

Ich bin echt Ratlos, irgendwie hab ich das Gefühl das das JS nicht geladen wird oder so. Die CSS klappt sonst wäre der graue kasten nicht da. Aber alles andere fehlt.

images/nivo-slider/toystory.jpg ???

cache leermachen und f5 browser

es lauft in v2.2.x in jedenfall, muss halt den anpassungen machen für deine Seite / template ( also die main content auch die von deiner template ofcourse

OJA schau mal nach

<script type="text/javascript" src="javascript/js/jquery-1.7.1.min.js"></script>
Vielleicht ich habe mit den

Zitat

<script type="text/javascript" src="javascript/js/jquery.min.js"></script>

hier drin tested

Mit dieser anleitung geht es, mussen nur den images und themes auch wirklich da sein!http://plussupport.commerce-seo.de/showthread.php…full=1#post5032

ich habe mit den

Zitat

<script type="text/javascript" src="javascript/js/jquery.min.js"></script>

hier drin tested

Mache es mall neu:
Ist nicht alles 100% design und/oder entwickler fertig aber...

seo_css.php -> um die Nivo css aktualisiert: $css->setCSS($js_css_path.'nivo-slider.css');
Vielleicht auch noch den /cseo_css_ie.php
cseo_javascript.php -> um das skript aktualisiert: $js->setJS($js_source_path.'jquery.nivo.slider.pack.js' );

Den nivoslider default theme uploaded mit images in den verzeichnis!
IN maincontenthtml:

Zitat

div class="slider-wrapper theme-default">
<div class="ribbon"></div>
<div id="slider" class="nivoSlider">
<img src="images/toystory.jpg" alt="" />
<a href="http://dev7studios.com"><img src="images/up.jpg" alt="" title="This is an example of a caption" /></a>
<img src="images/walle.jpg" alt="" />
<img src="images/nemo.jpg" alt="" title="#htmlcaption" />
</div>
<div id="htmlcaption" class="nivo-html-caption">
<strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
</div>
</div>
<script type="text/javascript" src="javascript/js/jquery.min.js"></script>

<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>

Alles anzeigen

dieser lauft bei mir momentan nicht ohne <script type="text/javascript" src="javascript/js/jquery.min.js"></script> sollte aber auch gehen glaube ich

und hier also den css wo man die einstellungen macht ist in template/css/jscss .'nivo-slider.css'

das geht auch!
einiziges problem was bei mir im moment besteht, das script läuft nicht sauber im ie9. der slider geht zwar, aber wenn die bilder verlinkt sind, dann kann ich sie nicht anklicken. im firefox dageben läuft das ohne probleme.