Using Javascript with a custom plugin

  • I’m working on a custom plugin that basically takes an existing set of files and adapts them to work as a WordPress plugin. It’s based on a “Coda Slider” mod of jQuery (demo here and files here), but I can’t seem to get it work in WordPress.

    I’ve eliminated variables – rather than using my modified version of the Featured Content Slider, I used the files linked above. The plugin is activated, but it’s not even connected to anything in the admin area or databases – I merely stuck the javascript, css, and image files in the plugin folder, pasted the HTML code into a slider.php file in the plugin, used wp_enqueue_script and _style to call the necessary files, and used <?php include (ABSPATH . '/wp-content/plugins/coda-slider/slider.php'); ?> in my static home page to call the slider itself.

    Now, I read through codex, specifically this page. How exactly does the <script type="text/javascript"><!--//--><![CDATA[//><!-- emailpage(); //--><!]]></script> stuff work? The files from the site linked above work fine as a standalone version, so I assumed this wasn’t needed… but I tried it with and without it anyway (exchanging emailpage() with the other names of course), and it still didn’t work. Like I said though, I don’t quite understand how that works, so I might be doing it wrong.

    Is there anything else I’m missing as to why the Javascript won’t work? Basically, the slides don’t slide, the contents of the slide are all trying to display, statically, at once either layered on top of each other, or just below each other vertically. I’ve been at this for a couple days now, any help would be appreciated…

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter thetanooki

    (@thetanooki)

    Just a little update, this is almost certainly an issue of getting the Javascript to properly load. I tried hardcoding the scripts using script tags instead of wp_enqueue_script, and the slider worked fine. However, keeping with WP standards, I’d like for this to work through the proper methods. Does this look like it should work? At the moment, it doesn’t…

    function load_scripts() {
    wp_enqueue_script('jquery');
    wp_enqueue_script('easing13', plugins_url('coda-slider/javascripts/jquery.easing.1.3.js'), array('jquery'));
    wp_enqueue_script('slider20', plugins_url('coda-slider/javascripts/jquery.coda-slider-2.0.js.php'), array('jquery'));
    wp_enqueue_script('featureslider', plugins_url('coda-slider/javascripts/featureslider.js'), array('jquery'));
}

function load_styles() {
    wp_enqueue_style('codastyle', plugins_url('coda-slider/stylesheets/coda-slider-2.0.css'), array(), false, 'screen');
}

add_action('init', 'load_scripts');
add_action('init', 'load_styles');

    My understanding is that since this loads in the header, I shouldn’t need any additional code in the body, correct?

    My story is similar, although I am not as advanced as thetanooki. I have tried to integrate various jquery sliders like the Coda Slider 2.0 and the Better Coda Slider.

    Two days of frustration later, I have narrowed my suspicions down to dysfunctional javascript loading. Nothing slides.

    I’ve done everything I can to conform to standards, following instructions, redoing my work.

    All I want is a tabbed slider for WordPress that accepts posts or images.

    Wrapping the code like this relieved my JS headache.

    jQuery(document).ready(function($) {
//your code here

)};

    Anyone, any luck?

    @thetanooki

    wp_enqueue_script(‘slider20’, plugins_url(‘coda-slider/javascripts/jquery.coda-slider-2.0.js.php’), array(‘jquery’));

    Well for starters, your “slider20” script is apparently a .php file, which really cannot be inserted as a .js would. Other than that, the code seems to be correct. And you are correct, this all loads in the header, so given that your implementation of the code is correct, it should work (also given that these jQuery plugins do not require jQueryUI or have other dependencies).

    $Skip Savage
    The best method is almost always starting from scratch and keeping very good track of what logic you are following; this line of code does this, but requires this, which in turn allows this. Make sure to always check that your code should theoretically work just between components.

    Not sure exactly what either of you are really trying to make, but if you still follow this topic, I’d be glad to help. And to whomever have noticed that I just replied to a 5 month old post, it’s because I happened to arrive here by chance and found it lacking in solutions.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Using Javascript with a custom plugin’ is closed to new replies.