Jump to content
xt:Commerce Community Forum

Carousel Flash Anleitung


Landixus

Recommended Posts

Kann Jemand mir genau sagen wie man ein Flash Rondell einbaut?

Also welcher Quelltext wo hin muss, vielleicht mit einem Beispiel?

Dann brauch ich nicht rumfrickeln bis es irgendwann geht.

Mein bevorzugtes wäre:

Kostenloses Open Source Flash Karussell mit XML-Konfiguration Webmaster und Internet Tipps, Tricks, Tutorials & Tools

das ist schon schön beschrieben, aber ich hätte das für Veyton gerne

etwas genauer wo was genau eingebaut werden muss.

Würde sicher auch anderen Usern helfen.

Dank im voraus

Andreas

Link to comment
Share on other sites

  • Replies 51
  • Created
  • Last Reply

ich habe ein kommerzielles eingebaut in einen shop. aber ich benutze es nurnoch weil ich mal geld dafür bezahlt habe. jetzt benutze ich meinen anderen shops Professor Cloud java karussel. kommt nähmlich ohne sinnloses xml file aus. biegt einfach die listen um. somit ist das ganze viel dynamischer, weil du zum beisspiel einfach die starseitenartikel zum karusell machen kannst.

bei den flash dingern musst du jedesmal erst die xml datei von hand füttern, oder nen script schreiben was die erstellt und das dann über regelmäßig ausführen.

hier das java karusell auf einer meiner seiten:

The Parlotones Shop

bei java, wie auch flash ist zu beachten das die dinger ganzschön performance rauben.

Link to comment
Share on other sites

okay, mal gucken ob ichs noch zusammenbekomme:

UPDATE auf die 1.04er

aktuellste version hier herunterladen:

http://www.professorcloud.com/mainsite/carousel.htm

die: cloud-carousel.1.0.4.min.js

kommt in:

xtFramework/library/jquery/

in deinem templateordner:

/templates/DEINTEMPLATE/javascript/js.php

einfügen:

wenn jquery noch nicht vorhanden oder zu alt, aktuellste runterladen und auch in die xtFramework/library/jquery/ kopieren:

<script type="text/javascript" src="<?php echo _SYSTEM_BASE_URL . _SRV_WEB; ?>xtFramework/library/jquery/jquery-1.4.2.min.js"></script>[/HTML]

danach:

[HTML]<script type="text/javascript" src="<?php echo _SYSTEM_BASE_URL . _SRV_WEB; ?>xtFramework/library/jquery/cloud-carousel.1.0.4.min.js"></script>[/HTML]

und ganz am ende noch die konfiguration(hier wie ichs haben wollte, details auf der Professor Cloud anleitung):

[HTML]<script language="JavaScript" type="text/javascript">
$(document).ready(function(){

$("#carousel1").CloudCarousel(
{
speed: 0.01,
autoRotateDelay: 1500,

xPos: 300,
yPos: 20,
altBox: $("#alt-text"),
titleBox: $("#title-text"),
reflHeight: 40,
reflGap: 3,
reflOpacity: 0.5,
yRadius: 10,


}
);
});

</script>[/HTML]

dann legst du am besten eine neue product_listing an, nennen wir sie product_listing_start_3d.html, welche in deinen templateordner /templates/DEINTEMPLATE/xtCore/pages/product_listing kommt. Ich kopiere dir hier einfach mal meine rein:

[PHP]{$categories}
{if $product_listing}
<div id = "carousel1" style="width:600px; height:280px;background:#3a3a3a;overflow:scroll;">
{foreach name=aussen item=module_data from=$product_listing}

<a href="{$module_data.products_link}" title="{$module_data.products_name|replace:'"':'"'}">{img img=$module_data.products_image type=m_info class=cloudcarousel alt=$module_data.products_name|replace:'"':'"' title=$module_data.products_name|replace:'"':'"'}</a>

{/foreach}
</div>
{/if}
{$error_listing}[/PHP]

Das Listing für die Startseite ändert man unter Inhalte->installierte Plugins->Startpage Products

da wählen wir product_listing_start_3d.html

Um dann einen Artikel auf der Startseite anzuzeigen braucht man nur im Artikel eine Checkbox im Reiter "Artikel auf Startseite anzeigen" setzen

das sollte es eigendlich sein.

Link to comment
Share on other sites

  • 2 weeks later...

Hallo Leute,

probier auch gerade alles mögliche um das 3d Carousel in meinen Shop einzubauen, jedoch wird das Carousel in jeder Kategorie angezeigt.

Die BIlder im Carousel sind auch nicht in "3D" sondern Tabellenförmig in einen 2x2 angeordnet, hat das jemand schon geschaft es wie auf der Homepage anzuzeigen?

Link to comment
Share on other sites

@sams

ist dir schon mal aufgefallen, das dass script im IE7 nicht funktioniert?

in der cloud-carousel.1.0.4.min.js in Zeile 10, Zeichen 6558 bringt er mir einen Fehler:

Zeichenfolge oder Zahl erwartet.

Bin aber leider noch nicht dahintergestiegen.

heute endlich mal zeit erstmal auf .13 updaten, danach update ich das carusell auf die 1.04er und schau dann mal.

@dragon_0000, ja wie gesagt, bei mir läufts fein.

Link to comment
Share on other sites

dann liefere doch einfach mal ne genaue Fehlerbeschreibung und was du gemacht hast.

verdachtsmodus: on

wenn das bei dir auf jeder seite angezeigt wird, wirst du wohl das productlisting modifiziert haben welches überall bei dir als default ausgewählt ist.verdachtsmodus: off

Link to comment
Share on other sites

  1. In den Ordnern xtFramework/library/jquery/ hab ich die beiden dateien von Professor Cloud kopiert
  2. In /templates/xt_default/javascript/js.php hab ich das *.im.js script eingebunden und darunter die Konfig geschrieben (wie von dir beschrieben)
  3. In /templates/xt_defaul/xtCores/pages/product_listing/product_listing_v1.html hab ich zw. {if $heading_text}<h1>{$heading_text}</h1>{/if} und {if $PRODUCTS_DROPDOWN}{$PRODUCTS_DROPDOWN}{/if} deinen Code zurzeit mal 1zu1 von dir kopiert (eigenes Listing hab ich aus testgründen noch nicht erstellt)

Mein Ergebnis sieht so aus:

http://s7.directupload.net/images/100811/89mq2dfi.png

Alle Bilder werden in einer Zeile angezeigt aber nicht in "3D" angezeigt

P.s. das in jeder Kategorie das Carousel angezeigt wird ist mir klar da ich den Quelcode in die product_listing_v1.htm geschrieben habe, aber für testzwecke sollte es trotzdem funktionieren.

Link to comment
Share on other sites

häh? als was würdest du meine denn bezeichnen?

habe gereade nochmal überflogen. eigendlich habe ich nix anders gemacht als es da steht...

HABE DIE ANLEITUNG JETZT NOCHMAL ÜBERARBEITET. Aktuelleste jquery könnte wichtig gewesen sein.

Link to comment
Share on other sites

Habs nochmal nach der Anleitung gemacht von Sams (danke an der Stelle das du es nochmal überarbeitet hast)

Mein Fehler lag in js.php da ich die jquery-1.4.2.min.js anscheinend 2 mal eingebunden habe (und anscheinend das 2 mal zu weit unten in der Datei)

So siehts jetzt bei mir aus:

http://s7.directupload.net/images/100813/34ott5jd.png

Und ich hab noch in der js.php bei der Konfigruation hinzugefügt das es sich automatisch dreht

autoRotate: 'left',

Und die Buttons Links und Recht den Bild Titel sowie den Alt-text las ich mir noch anzeigen mit:

<!-- Define left and right buttons. -->

<input id="left-but" type="button" value="Left" />

<input id="right-but" type="button" value="Right" />

<!-- Define elements to accept the alt and title text from the images. -->

<p id="title-text"></p>

<p id="alt-text"></p>

Um die Buttons dann auch noch nutzen zu können muss man in der js.php sie noch hinzufügen mit

buttonLeft: $("#left-but"),

buttonRight: $("#right-but"),

@Sams in deinen Step-by-Step hast noch die alte cloud carousel drinnen die neue ist cloud-carousel.1.0.4.min.js vielleicht kannst du es ja noch ändern

Link to comment
Share on other sites

hallo,

saubere sache - könnte man theoretisch auch auf andere jquerys anwenden, bleibt zu hoffen das auch das funktioniert =)

habe aber ne frage zum tutorial

folgende Zeilen hinzufüge:

darunter:

darunter noch ein paar Einstellungen für das Crousel:

Weitere mögliche Einstellungen findet man auf der Seite:

der inhalt fehlt :(

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.


×
  • Create New...