Change the position of loader.gif

[Strady77]

Hello everyone, I need to make a change to the blocklayered.

 

The change is quite simple and consists of only bring up the animated gif (loader.gif) "loading" instead of above list of products

should appear in the top menu select but always within the layered navigation block.

 

I looked at the file blocklayered.tpl and at the bottom there is the management of the gif I'm interested in:

 

 

<div id="layered_ajax_loader" style="display: none;">

<p><img src="{$img_ps_dir}loader.gif" alt="" /><br />{l s='Loading...' mod='blocklayered'}</p>

</div>

</div>

{else}

<div id="layered_block_left" class="block">

<div class="block_content">

<form action="#" id="layered_form">

<input type="hidden" name="id_category_layered" value="{$id_category_layered}" />

</form>

</div>

<div style="display: none;">

<p style=""><img src="{$img_ps_dir}loader.gif" alt="" /><br />{l s='Loading...' mod='blocklayered'}</p>

</div>

</div>

 

 

 

I do not understand, however, which variable to use to enable and disable the display of the gif.

Can you help me figure out which variable to use?

 

the image attached explains it better than 1000 words what I would do

 

TANKSSSSS

[Strady77]

please, who can help me figure out how to move the image inside the loader.gif blocklayered? is it so hard?

[albikom]

the position of layered_ajax_loader is defined in this file :

 

modules\blocklayered\blocklayered.js

 

on line 333 (by default)

 

$('#product_list').prepend($('#layered_ajax_loader').html());

you have to replace #product_list by another id

 

For example, you can create an empty div at the end of your blocklayered.tpl (this is the place where you want to load the loader.gif):

 

<div id="loadingzone" style="height:25px;"></div>

 

In this example you have to modify your modules\blocklayered\blocklayered.js like this :

 

$('#loadingzone').prepend($('#layered_ajax_loader').html());