How to change Quick view button from fixed to display on hover in product list

[rajansinha02]

Hi

 

I was trying to change quick view button from fixed to display on hover in product list page but was unsuccessful, if any one can help with this it would be grate.

 

Using default theme 1.6.0.8 

 

Looking forward for help

 

 

 

Thanks in advance

[PascalVG]

Try this:

 

<script>

  $(document).ready(function(){

    $('.quick-view').mouseenter(function(){

      $(this).trigger('click');

    });

  });

</script>

 

put it in your themes/<your theme folder>/product-list.php  (make backup!!)

 

and it should work on all the category product lists.

 

(Adjust and add self to homefeatured, newproducts, bestsellers etc.)

 

Hope this works, let me know,

pascal.

[rajansinha02]

Hello Pascal

 

Thank you very much for your prompt response, I add product-list.php with your code as you mentioned to the theme folder but did not get the desired effect.

 

Do I need to make changes in product-list.css also if any if you can help with desired changes.

 

 

Thanks once again

 

Rajan

[rajansinha02]

Can any one help with this

 

 

Thanks

[PascalVG]

Hi rajah,

 

Try to put it in the themes/<your theme folder>/product-list.tpl code like here: (Make backup!)

 

{if isset($quick_view) && $quick_view}

  <div class="quick-view-wrapper-mobile">

    <a class="quick-view-mobile" href="{$product.link|escape:'html':'UTF-8'}" rel="{$product.link|escape:'html':'UTF-8'}">

      <i class="icon-eye-open"></i>

    </a>

  </div>

  <a class="quick-view" href="{$product.link|escape:'html':'UTF-8'}" rel="{$product.link|escape:'html':'UTF-8'}">

    <span>{l s='Quick view'}</span>

  </a>

  <script>

    $(document).ready(function(){

      $('.quick-view').mouseenter(function(){

        $(this).css("background-color","yellow");  // test line to see if it triggers. remove this line afterwards

        $(this).trigger('click');

      });

    });

  </script>

{/if}

{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}

 

 

This should do it:

Example on what it does:

http://ps1609.buymethai.com/index.php?id_category=4&controller=category

 

pascal

[akashs]

i want to add quick view my product  page is showing but search page is not 
any one can help me

[jjryeste]

Hello is possible , eliminate productcomments in quick view

thank you

[booklovers]

my site is designed on prestashop framework. My designer has comment on quick view, which is not showing on pages, but it is making url mysite.com/quickview/product....

 

I want to remove these url and also not want my site to make these urls again. Can anyone help which file to change or remove and where to find it.

Edited March 2, 2017 by booklovers (see edit history)

[rocky]

Assuming you're using the default PrestaShop theme, you can disable quick view using the "Theme configurator" module. Just go to the module's configuration page and then change "Display quick view window on homepage and category pages" to "No".

 

If this doesn't work, you'll have to manually edit product-list.tpl in your theme and remove the quick view code.