Fancy box in functional buttons

[berkis]

0 down vote favorite

I want to have on Prestashop warehouse theme http://warehouse.iqit-commerce.com/ar/ product list functional buttons have an additional button, which would enlarge image (like fancy box is used in product page, when you click on main image). As far as I understand i have to put some code from product.tpl to product_list.tpl , but cannot get to work it.. Here is a part of code which is responsible for functional buttons in product_list.tpl

                <div class="functional-buttons functional-buttons-grid clearfix">                    {if isset($quick_view) && $quick_view}                    <div class="quickview col-xs-6">                        <a class="quick-view" href="{$product.link|escape:'html':'UTF-8'}" rel="{$product.link|escape:'html':'UTF-8'}" title="{l s='Quick view'}">                            {l s='Quick view'}                        </a>                        </div>                    {/if}                    {hook h='displayProductListFunctionalButtons' product=$product}                    {if isset($comparator_max_item) && $comparator_max_item}                        <div class="compare col-xs-3">                            <a class="add_to_compare" href="{$product.link|escape:'html':'UTF-8'}" data-id-product="{$product.id_product}" title="{l s='Add to Compare'}">{l s='Add to Compare'}</a>                        </div>

Here is a code from product.tpl which I believe is responsible for the zoom function in product page:

<span id="view_full_size">                    {if $jqZoomEnabled && $have_image && !$content_only}                        <a class="jqzoom" title="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" rel="gal1" href="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'thickbox_default')|escape:'html':'UTF-8'}" itemprop="url">                            <img itemprop="image" src="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'large_default')|escape:'html':'UTF-8'}" title="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" alt="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}"/>                        </a>                    {else}                        <img id="bigpic" itemprop="image" src="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'large_default')|escape:'html':'UTF-8'}" title="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" alt="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" width="{$largeSize.width}" height="{$largeSize.height}"/>                        {if !$content_only}                            <span class="span_link no-print"></span>                        {/if}                    {/if}                </span>            {else}                <span id="view_full_size">                    <img itemprop="image" src="{$img_prod_dir}{$lang_iso}-default-large_default.jpg" id="bigpic" alt="" title="{$product->name|escape:'html':'UTF-8'}" width="{$largeSize.width}" height="{$largeSize.height}"/>                    {if !$content_only}                        <span class="span_link">

Or maybe replace quickview with just image popup....

 

Thank You in advance for your help !!!

 

There was a way

http://www.prestaholic.com/how-to-add-an-image-preview-in-product-list-using-jquery-in-prestashop/

 

but i cannot achieve it in 1.6.0.14

 

Edited May 1, 2015 by berkis (see edit history)