Menu icon Foundation
How to add customised javascript in foundationpress

Hello everyone...It's really confusing on how to add my own javascript in foundationpress. I learnt there are two ways of doing this. One is to alter the function.php and enqueue.php and then call the function where you want to . Second is via node.js by running the grunt build.

However I'm not sure exactly how to get it work since I'm totally new to these frameworks. I prefer the first method where you can register the function in enqueue.php but how to call it only in a particular page home.php?

Please advise me..I need help.Thanks in advance.

foundationPress

Hello everyone...It's really confusing on how to add my own javascript in foundationpress. I learnt there are two ways of doing this. One is to alter the function.php and enqueue.php and then call the function where you want to . Second is via node.js by running the grunt build.

However I'm not sure exactly how to get it work since I'm totally new to these frameworks. I prefer the first method where you can register the function in enqueue.php but how to call it only in a particular page home.php?

Please advise me..I need help.Thanks in advance.

Jeremy Englert over 4 years ago

This is more of a WordPress question than a Foundation question. However, this should get you going in the right direction:
http://codex.wordpress.org/Function_Reference/wp_enqueue_script

If you look at the enqueue-scripts.php file, you can see how other scripts are being called. Follow that same formatting with whatever kind of Javascript you are trying to add.

Ole Fredrik Lie, the creator of FoundationPress, is actually a member of this forum.

kalaivani nair over 4 years ago

I've tried to copy the same way of how scripts are called in enqueque.php, however it doesn't worrk. But I created a file called home.js inside js folder and this seems to control the script. Unfortunately I can't remember which tutorial i refered for this.

The pagination for the slideshow that I wanted to show appears in accordance with the images called from db. WHn i emptied the scripts in home.js ,this doesn't appeoar(I mean pagination). So my script partially working. BUt i wonder why they're unclickable and image not appearing too.

This is the 3rd day I sitting with no solution for this issue. Any help would be great.

Ole Fredrik Lie about 4 years ago

The official way to add scripts in WordPress is by using the wp_enqueue_script function. That said, it is not necessarily good for performance to load a handful of scripts in the header and footer. By loading scripts in Gruntfile.js, you get the opportunity to concatinate and uglify (minify) scripts using the 'grunt build' command. This will result in fewer and smaller files, which is beneficial for performance. And performance is one of the most important things you can facilitate in responsive web design.

Some skeptics might say that you lose control of your dependencies by loading scripts without registering every single script using wp_enqueue_script. This may not be a big problem if you use a front-end package manager like bower? Dunno.

There are several possible solutions here. Would love to hear what the WordPress gurus say about the matter.

Cheers,
Ole Fredrik