Theme Development Basics

[daniel.a]

Hello,

 

How to properly add javaScripts and styles in prestashop ?

 

I want to add a stylesheet that loads after everything else ? how can i do that ? 

 

I know i can go to header.tpl file and add it after

{if isset($css_files)}

...

{/if}

But this way it won't be included in ccc compiled stylesheet.

 

same with script files ?

 

I think the most basic thing for theme development is being able to load your desired scripts and stylesheets where you need them and in order you need them  but i didn't find anything about this on documentation ?

 

Am i missing something too obvious ?

 

 

[El Patron]

you would need to write a module, to accompany your theme....

 

it would then call using standard .css  and .js functions to add...

 

i wrote this module for shop managers who wanted to clean up those that added to header.tpl

 

http://etiendas.co/en/home/58-ccc-orphaned-js-and-css-files.html

 

happy day, el

[daniel.a]

Thanks for the answer. well i think that's a prestashop problem but who am i to judge

 

So how to add scripts and stylesheets with modules ? and make sure they load after everything else or in order that you want ?

[razaro]

If you are using 1.6 version you can add scripts and stylesheets by placing files in themes/your_theme/js/autoload, or themes/your_theme/css/autoload and check default-bootstrap theme and how  js files are loaded. Because if order matters just rename them with numbers in front.

 

Other solution that people use is to make  module like El Patron said, or to override FrontController setMedia function.

[daniel.a]

Thanks for Autoload tip that's cool and useful but it still won't solve my problem of making sure that my styles load as the last stylesheet after everything else added by modules and other controllers. 

 

How does ccc work ? Is there anyway we can add a css file to the end of css array right before ccc starts combining the css files ?

Any hook or something ?

[El Patron]

if you use module, that moves itself to bottom position, i.e. last in header hook...then your files will load last.