Aggiungere Cu3er in Magento
In un articolo di qualche giorno fa abbiamo presentato il magnifico slide CU3ER, ora vediamo come installare e rendere funzionale questo fantastico slider flash nella home page di un e-commerce costruito con Magento per rendere il sito di sicuro effetto per i nostri potenziali clienti. Prima di tutto come sempre occorre fare backup di tutti i file che andremo a modificare, dopo scarichiamo lo slide Cu3er direttamente dalla home page dell’ideatore.
Tutorial – Magento e Cu3er
Nel pannello di controllo del nostro sito Magento andiamo in CMS>Amministra pagine>Home page ed aggiugiamo il codice seguente nella nostra home page:
<reference name="top_slider"> <block type="cms/block" name="cu3er"> <action method="setBlockId"> <block_id>cu3er</block_id> </action> </block </reference>
Ora è il momento di creare un blocco statico, andiamo sempre in CMS>Blocchi statici e creiamo un nuovo blocco statico, chiamiamolo cu3er e inseriamo all’interno questo codice:
<script type="text/javascript" src="{{skin url=""}}cu3er/js/swfobject/swfobject.js"></script> <script type="text/javascript"> var flashvars = {}; flashvars.xml = "{{skin url=""}}cu3er/config.xml"; flashvars.font = "Arial"; var attributes = {}; attributes.wmode = "transparent"; attributes.id = "slider"; swfobject.embedSWF("{{skin url=""}}cu3er/cu3er.swf", "cu3er-container", "925", "200", "9", "{{skin url=""}}cu3er/js/expressInstall.swf", flashvars, attributes); </script> <style type="text/css"> <!-- body { margin: 0% auto; text-align:center;} #cu3er-container {width:925px; outline:0;} --> </style> <div id="cu3er-container"> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /> </a> </div>
Ora è arrivato il momento di configurare il file xml che farà funzionare lo slide Cu3er, inserendo quindi i percorsi dei file immagine e le opzioni di slide, il codice xml seguente potrà essere personalizzato a seconda delle vostre esigenze, il file è presente nel pacchetto di Cu3er che scaricherete, questo è solo un esempio di come lo potrete utilizzare:
<?xml version="1.0" encoding="utf-8" ?> <cu3er> <settings> </settings> <slides> <slide> <url>http://www.mysite.com/cu3er/images/slider1.jpg</url> </slide> <!-- changing transition beetween first & second slide --> <transition num="3" slicing="vertical" direction="down"/> <slide> <url>http://www.mysite.com/cu3er/images/slider2.jpg</url> </slide> <!-- changing transition beetween second & third slide --> <transition num="4" direction="right" shader="flat" /> <slide> <url>http://www.mysite.com/cu3er/images/slider3.jpg</url> </slide> <transition num="10" slicing="vertical" direction="down" duration=".6" delay=".3" shader="none" cube_color="0x333333" z_multiplier="4" /> <!-- transitions properties defined in transitions template --> <slide> <url>http://www.mysite.com/cu3er/images/slider4.jpg</url> </slide> <transition num="6" slicing="vertical" direction="up" shader="flat" delay="0.05" z_multiplier="4" /> <slide> <url>http://www.mysite.com/cu3er/images/slider5.jpg</url> </slide> <transition num="3" slicing="vertical" direction="down"/> <slide> <url>http://www.mysite.com/cu3er/images/slider6.jpg</url> </slide> <transition num="4" direction="right" shader="flat" /> <slide> <url>http://www.mysite.com/cu3er/images/slider7.jpg</url> </slide> <transition num="6" slicing="vertical" direction="up" shader="flat" delay="0.05" z_multiplier="4" /> <slide> <url>http://www.mysite.com/cu3er/images/slider8.jpg</url> </slide> <slide> <url>http://www.mysite.com/cu3er/images/slider9.jpg</url> </slide> </slides> </cu3er>
Ora copiamo copiamo il contenuto della cartella Cu3er che abbiamo scarico in questo percorso: /skin/frontend/default/tuo tema/, il gioco è fatto.
Tutorial – Magento e Cu3er – Compatibilità con tutti i browser
Seguendo la prima parte del nostro tutorial avrete di sicuro notato che con Firefox lo slide non viene visualizzato a causa di alcune incompatibilità con il codice che richiamo lo script flash. Ecco di seguito il modo per richiamare il codice e renderlo compatibile con tutti i browser.
Occhio sempre ai percorsi dei file, bisogna cambiarli altrimenti non funzionerà nulla
<script type="text/javascript" src="{{skin url='images/flash/cu3er/js/swfobject/swfobject.js}}"></script> <object classid="clsid:cu3er.swf" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0" width="897" height="300"><param name=movie value="{{skin url='images/flash/cu3er/cu3er.swf'}}"><param name=quality value=high><param name="wmode" value="transparent"><param name="id" value="slider"><param name="FlashVars " value="xml={{skin url='images/flash/cu3er/config.xml}}"><embed src="{{skin url='images/flash/cu3er/cu3er.swf'}}" quality=high wmode="transparent" id="slider" FlashVars="xml={{skin url='images/flash/cu3er/config.xml}}" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="897" height="300"></embed></object> Notate nello script che bisogna copiare la cartella cuber nella cartella images e flash del vostro tema.
Popularity: 5%






[...] aver scoperto Cub3r e aver imparato come inserirlo nella home page di Magento è arrivato il momento di capire come inserire lo slide Cub3r in un tema WordPress. Inserire lo [...]
Ho provato a seguire la guida per installare cu3er su magento, ma purtroppo non funge, nella home page viene visualizzato solo il nome del blocco ma non il blocco.
Quindi c’è qualcosa che ancora manca.
su quali browser hai provato?
Ho provato sia su firefox che su explorer ma nulla, niente da fare..
Forse manca qualcosa?
Si manca un pezzo di codice che però rende compatibile il tutto in in Firefox se a te non funge nemmeno in IE significa che hai fatto qualche errore, devo cmq aggiornare l’articolo.
Qualcuno mi ha detto che la prima parte di codice, quella che dici di inserire in CMS>Amministra pagine>Home page , in realtà vada inserita nel file xml presente in app/design/frontend/default/mio tema/layout/un file xml
Giusto secondo te?
Non mi risulta, cmq hai riprovato ad eseguire da capo?
Io personalmente ho avuto problemi ad inserire il percorso delle immagini, che consiglio di metterlo assoluto.
Vi è poi un altro modo per inserire lo slider, compatibile con tutti i browser, creo lo aggiungo ora di seguito al tutorial.
Stasera da casa riprovo a rifare tutta la procedura da capo, credo possa dipendere anche dal percorso delle img ma alla fine il problema grande è anche dovuto dal fatto che vedo in home solo il nome dell’id del blocco (cu3er) e nulla più
Come puoi vedere ho aggiunto un altra parte al tutorial, devi cmq sapere che è molto importante stare attenti al percorso di tutti i file, io ho avuto problemi con quello.
Spetta tentiamo di ricapitolare, di modo che possa essere utile anche ad altri.
Dopo la prima parte, il blocco statico con il nuovo codice, e il file xml con le opportune modifiche, i file di cu3er vanno copiati da soli nei vari percorsi o va messa direttamente la cartella nella cartella del tema in uso?
Perchè da quello che vedo nei percorsi che vengono richiamati, viene salvata tutta la cartella e quindi puntata e non solo i file contenuti in essa.
esatto devi mettere la cartella cu3er nel nuovo percorso, se leggi il codice è chiaro.
Possibile che qui non si inviino i mex privati?
Azzo solo quello manca!
Provato proprio ora, continua a non funzionare…
Tu puoi prendere la mia mail dall’iscrizione? se si, scrivimi li che ti mando il contatto msn…perchè davvero pare non uscirne fuori da questa installazione..probabilmente anzi sicuramente sbaglio qualcosa io, ma non riesco a capire cosa.
Se non va l’errore c’è, a me alla fine ha funzionato.
Prova a scaricare, l’ultimo flash player ed aggiornare la cache dei browser che usi.
Provando si capisce quale sia il problema.