"Move JavaScript to the end" not working

[SupaMonkey]

Hey Guys,

So Im switching all my sites to use the "Move JavaScript to the end" feature. I've come across a site where its simply not working:

http://www.secondskin.co.za

 

Basically, Ive disabled cache - forced recompilation, and have the above mentioned option Enabled - and its still not working. The theme is compatible with 1.4.7.x - so its a bit old - but not ancient.

 

Can someone please tell me why the feature isnt working?

If it is because the 'theme' is too old, please point me in the right direction as to what needs to change in the theme in which file(s) so that I can 'upgrade' the theme to be compatible with this feature.

 

Thanks in advance!

[vekia]

are you able to temporarily switch theme to DEFAULT BOOTSTRAP template?

im asking because it is worth to test default theme - if "move jscripts to end" will work there - it's a case of template

[SupaMonkey]

Thanks Vekia, Im sure thats the case - but how do I go about converting my template to be 'bootstrap compatible'? Prestashop is great, but there is just no material to help an aspiring developer for the platform.

[El Patron]

you should post new topic in development of themes on how to accomplish.

[vekia]

can you show header.tpl file of your template? 

[SupaMonkey]

Sure, attached it here.

header.zip

[vekia]

structure of files are different (i compared default header.tpl and yours)

 

your theme file uses this code:
 

{if isset($js_files)}
	{foreach from=$js_files item=js_uri}
	<script type="text/javascript" src="{$js_uri}"></script>
	{/foreach}
{/if}

default template use this one:

{if isset($js_defer) && !$js_defer && isset($js_files) && isset($js_def)}
	{$js_def}
	{foreach from=$js_files item=js_uri}
	<script type="text/javascript" src="{$js_uri|escape:'html':'UTF-8'}"></script>
	{/foreach}
{/if}

i bet that footer.tpl file uses also different way of including js files

does your theme contain for example global.tpl file ?

[SupaMonkey]

Thanks vekia,

I dont have a global.tpl for this theme. What does global.tpl do?

 

Would it be as simple as copying the relevant code from the default themes header/footer tpl files or is there more to it than that?

[vekia]

it loads js files especially in footer

in addition to that, footer.tpl file must contain code to load this js file

{include file="$tpl_dir./global.tpl"}

and global.tpl

{strip}
{addJsDef baseDir=$content_dir}
{addJsDef baseUri=$base_uri}
{addJsDef static_token=$static_token}
{addJsDef token=$token}
{addJsDef priceDisplayPrecision=$priceDisplayPrecision*$currency->decimals}
{addJsDef priceDisplayMethod=$priceDisplay}
{addJsDef roundMode=$roundMode}
{addJsDef isLogged=$is_logged|intval}
{addJsDef isGuest=$is_guest|intval}
{addJsDef page_name=$page_name|escape:'html':'UTF-8'}
{addJsDef contentOnly=$content_only|boolval}
{if isset($cookie->id_lang)}
	{addJsDef id_lang=$cookie->id_lang|intval}
{/if}
{addJsDefL name=FancyboxI18nClose}{l s='Close'}{/addJsDefL}
{addJsDefL name=FancyboxI18nNext}{l s='Next'}{/addJsDefL}
{addJsDefL name=FancyboxI18nPrev}{l s='Previous'}{/addJsDefL}
{addJsDef usingSecureMode=Tools::usingSecureMode()|boolval}
{addJsDef ajaxsearch=Configuration::get('PS_SEARCH_AJAX')|boolval}
{addJsDef instantsearch=Configuration::get('PS_INSTANT_SEARCH')|boolval}
{addJsDef quickView=$quick_view|boolval}
{addJsDef displayList=Configuration::get('PS_GRID_PRODUCT')|boolval}
{/strip}

[SupaMonkey]

Thanks again Vekia,

I tried the above - but it didnt work. scripts are still getting loaded in the header. Furthermore, for some reason jQuery broke

 

 

1. Uncaught ReferenceError: $ is not defined script.js:1
   1. (anonymous function)script.js:1

1. Uncaught ReferenceError: jQuery is not defined cookies.js:57

1. Uncaught ReferenceError: jQuery is not defined jscript_xjquery.jqtransform.js:17

1. Uncaught ReferenceError: $ is not defined (index):5

1. Uncaught ReferenceError: jQuery is not defined superfish.js:121

1. Uncaught ReferenceError: $ is not defined (index):6

1. Uncaught ReferenceError: $ is not defined (index):6

 

I checked another theme of mine, where it IS working, and it doesnt have a global.tpl either - nor the footer.tpl/header.tpl alterations mentioned above. Looks to me like this is getting handled somewhere else?

Edited September 1, 2014 by SupaMonkey (see edit history)

[vekia]

it's hard to say what's going on there

cases like that need deeper analysis

[El Patron]

Thanks vekia,

I dont have a global.tpl for this theme. What does global.tpl do?

 

Would it be as simple as copying the relevant code from the default themes header/footer tpl files or is there more to it than that?

 

in back office-->advanced parms-->performance

 

did you tell PrestaShop to load javascript bottom?  I ask because you state javascript still loading top.  Which means you managed to put correct header.tpl code in, if so then it would not load top if set correctly.

 

and to answer your general question, yes, see how its done in 1.6.0.7 and higher default them.  good luck

[SupaMonkey]

Yes, this was set El Patron and it still didnt work, so must be controlled elsewhere.

[El Patron]

Yes, this was set El Patron and it still didnt work, so must be controlled elsewhere.

 

since this is a step by step debug, then if header.tpl set correctly per vekia and/or default theme, and you have set load bottom, then why is it still displaying in the header?  the result assuming that there is a missing piece to your theme load bottom with correct header.tpl then no java should load.

 

so once you get 'no' java to load  top, then you can concentrate on loading bottom.

 

then once you get java load bottom you will need to address non-compliant theme/modules  where java like product.js must be loaded top, or attributes won't  work.