[Quick how-to] SWF για εικόνες κατηγοριών

[cirrus3d]

Καλημέρα,

μου ζητήθηκε από τη δουλειά μου να έχουμε animation στις φωτογραφίες των κατηγοριών των προϊόντων και έτσι αποφάσισα να χρησιμοποιήσω flash.

Χωρίς να έχω τεστάρει ιδιαίτερα το όλο hack (δεν είμαι σίγουρος αν παίζει σε όλους τους browsers) σας το παραδίδω:

 

1) Στο theme μας ανοίγουμε το αρχείο category.tpl (prestashop/themes/ourtheme/category.tpl)

2) Βρίσκουμε τη γραμμή:

<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" />

και της βάζουμε σχόλια:

<!-- <img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" /> !-->

3) Θα χρησιμοποιήσουμε τη replace function της smarty templating engine για να αλλάξουμε το .jpg extension σε .swf.

Ακριβώς από κάτω ή από πάνω από τη σχολιασμένη γραμμή βάζουμε το embedded object για το flash.

<object id="editorial" width="710" height="130">
   <embed type="application/x-shockwave-flash"
 pluginspage="http://www.macromedia.com/go/getflashplayer"
 width="710" height="130"
 name="editorial" src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category')replace:'jpg':'swf'}"
 bgcolor="#FFFFFF" quality="high"
 swLiveConnect="true" allowScriptAccess="samedomain"
></embed>
  </object>

Στον κώδικα αυτόν φαίνονται τα width και τα height που πρέπει να αλλαχθούν ώστε να είναι ίδια με το swf που θα έχουμε φτιάξει. Επίσης φαίνεται η replace function.

4) Τελικό βήμα είναι να βρούμε σε κάθε κατηγορία του site μας, που βρίσκονται οι εικόνες που έχουμε ορίσει για κατηγορίες πχ (prestashop/img/c/category-1/category-1.jpg)

και εκεί να κάνουμε upload με το ίδιο όνομα το swf μας. (prestashop/img/c/category-1/category-1.swf). Δυστυχώς θα πρέπει να ανέβουν όλα τα swf με το χέρι.

5) Από εκεί και πέρα και αν όλα έχουν πάει καλά θα πρέπει αντί για το jpg να βλέπουμε το swf αρχείο in all its glory.

 

Αυτό θα μπορούσε να γίνει ένα ωραιότατο module.

 

Take care guys, greetings to the greek prestashop community, and improvements are more than welcome!

 

Κυριάκος

http://www.cirrus3d.com