Nasadenie finepic produktových fotografií na váš web je pomerne jednoduché. Bude však potrebovať zásah do zdrojového kódu ktorý vám alebo vykonáme my alebo ho prenecháte programátorom, ktorý vám e-shop/web prevádzkujú.
Príprava prostredia
1. Ak ešte nemáte tak si musíte na web pridať knižnicu jQuery.
- Do časti <head> vložíte nasledujúci kód: <script src='https://code.jquery.com/jquery-2.1.3.min.js'></script>
2. Obdobne si musíte pridať knižnicu finepic ktorá sa stará o zobrazenie produktov.
- Do časti <head> vložíte nasledujúci kód: <script src='http://ngn.finepic.sk'></script>
Príprava miesta pre obrázok
1. vytorte blokový element (ideálne <div>) a vložte ho na stránku.
2. Vytvorenému elementu nastavte rozmery podľa toho aké rozmery máte u nas definované. Môžete tak spraviť alebo v CSS súbore alebo aj pomocou "inline" štýlu.
3. Nastavte vytvorenému elementu ľubovolné ID (napr. id="preview"), ktoré budete potrebovať neskôr pri inicializácii Finepic prehrávača.
Zobrazenie obrázku
1. Pod blokový element pre zobrazenie obrázku vložime inicialižačný JavaScript kód ktorý sa už o zvyšok postará sám. Budete k tomu však ešte potrebovať aj jedinečný identifikátor nafoteného produktu (PID) ktorý nájdete v administrácii všetkych vašich produktov pri každom z nich.
<script type="text/javascript">
$("#ID_VASHO_BLOKOVEHO_ELEMENTU").finepic("PID");
</script>