Oct 8, 2011

How to Use JavaScript in WordPress Pages

JavaScript are one of the most used languages in the web world that helps in implementing objects, rich content, modules and media into the site effectively with decent level of animation feature. WordPress, as content management software, is pretty robust to integrate JavaScript properly with some limitations due to security.

Generally JavaScript, such as tracking or analysis codes, can easily be added into the WordPress as they require to be inserted in the home page only and most of the themes have predefined place to insert the code or the code can simply be added into the header via the header.php file. The problem occurs while adding any JavaScript in a single particular page or post, as there is no php file separately for each page and post of WordPress that can simply be edited and inserted the JavaScript. While creating or editing any new page or post, html tags are accepted as well as some php syntax but if you use any JavaScript under the html tab of the page or post, it will not be activated in there, neither any effect of that JavaScript will show in the edited page or post.

As we said earlier WordPress have the compatibility to use JavaScript in anywhere, page or post but for security reasons, the JavaScript are blocked and only html or xhtml scripts are allowed to run by a filter predefined in WordPress library. Tracking or analysis codes are inserted to specified php files where filers are not used but normal page or posts have the filters activated. To use JavaScript in any particular page or post, we have to disable the filter so that JavaScript can be used anywhere. Another alternative is to install a plugin like AdSense implementer where JavaScript can be added and used anywhere in the site.

To use disable the filter, you have to use the following codes :
function disable_content_filters() {
global $current_user;

These will elevate the blockade on JavaScript by Disabling KSES HTML/XHTML filter of WordPress security, but to prevent any mishaps for the lack of security, another code should be used to prevent any non-elevated user to exploit JavaScript in the site, so after adding the codes above, use these jjust under :

if ($current_user->user_level >= $min_user_level) {
remove_filter(‘content_save_pre’, ‘wp_filter_post_kses’);
remove_filter(‘excerpt_save_pre’, ‘wp_filter_post_kses’);
remove_filter(‘content_filtered_save_pre’, ‘wp_filter_post_kses’);

These will ensure proper use of JavaScript keeping the security loop tight, along with disabling the KSES filter to work simultaneously. There are some plugins in the WordPress.org site that does exactly the same to enable JavaScript, but using own codes are always better for learning and security purpose. Make sure to add the php syntax on the beginning and end of the combined codes like <?php code ?> otherwise the code will not be recognized as a php script and hence will not work.

Keep reading for more tips on editing and customizing WordPress and don’t forget to subscribe. If you have any query or suggestions, write in the comment, your views are very important for us.


Post a Comment