Menu
Can someone show me how to include this javascript file into my wordpress plugin. I have tried all the wp_enqeue_script() methods but nothing happens.
ok here is my example plugin code with comments explaining what I would like.
<?php /* Plugin Name: Ava Test Plugin URI: http://#.com Description: A plugin that is used for my javascript tests Author: Ronny Kibet Author URI: http://ronnykibet.com version: 1.001 */ include(popup.js); /*when I include it this way, it works fine, but gives an error when I activate the plugin 'plugin generated 453 characters ...' */ function popup() { $src = plugins_url('popup.js', __FILE__); wp_register_script( 'popup', $src ); wp_enqueue_script( 'popup' ); } /* when I included it this way, plugin is activated but nothing happens. */ ?> this is the popup.js
<script type="text/javascript"> function popup(){ alert('hello there this is a test popup') } </script> <body onload="popup()"> </body> So does anybody know how to call this script to work correctly in wordpress plugin?
282
The function should be called using the wp_enqueue_scripts action hook if you want to call it on the front-end of the site, like in the examples above. To call it on the administration screens, use the admin_enqueue_scripts action hook. For the login screen, use the login_enqueue_scripts action hook.
The answer is no, you cannot, as you have referenced in your question. By definition, a plugin is at the very least a "PHP file with a WordPress plugin header comment" (Wordpress Docs). However, there is no reason a Wordpress plugin can't be primarily Javascript.
You need to specify when the load should happen, try this.
<?php /* Plugin Name: Ava Test Plugin URI: https://matsio.com Description: A plugin that is used for my javascript tests Author: Ronny Kibet Author URI: https://matsio.com version: 1.001 */ add_action('wp_enqueue_scripts','ava_test_init'); function ava_test_init() { wp_enqueue_script( 'ava-test-js', plugins_url( '/js/ava_test_.js', __FILE__ )); } Also, there are errors in your JS, but I have seen the correct version in some answers, hope this helps
Update : There is a hook called wp_enqueue_scripts, as mentioned by @brasofilo which should be used in lieu of init for loading scripts.
114
Learning to work within WP structure can be frustrating.
And, learning to bring in javascript can be even more frustrating.
So, everyone here has contributed something valuable, however you need to bring it all together. So:
Remove your include line. You do not need it.
Be sure that the $src variable in your code is in fact the correct path. I would add an:
echo $src; To TEST if the location is correct.
Aghoshx is correct - you MUST have the hook reference:
add_action('init','popup'); (Since you named the function popup, that's what I put in - HOWEVER, to prevent function name colissions with other WP functions and plugins, I recomment that you change it to something more unique, like aghoshx proposed)
Check that your script is LOADING. After you do steps 1-3 above, then go refresh the WP page and do a "view source". Look for your script file. If you're in Firefox, you can actually CLICK on the url and it will load it - if you are in IE, then copy-paste the url into the url bar and see if in fact your file is THERE (if so, it's loading. If NOT, then it's NOT loading the file properly, and you need to fix the path you are setting into th $src variable).
Once you get the above nailed, cillosis is right - you need to remove everything BUT the javascript function (you even remove the tags) from the javascript file.
look at Martti Laines answer - you need to bind the event by using his suggested window.addEventListener, OR ELSE modify the tag in your php template to contain the onload="popup" (like you had in the script file).
One final bit of suggestion:
jQuery makes many things MUCH easier. It's very easy to bring jQuery into your WP plugin. Just add this in your php popup function:
wp_enqueue_script('jquery'); Good luck!
37
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
