WordPress.org

Support

Support » Plugins and Hacks » Hacks » [Resolved] how to 'use google libraries'

[Resolved] how to 'use google libraries'

  • Hi, anyone know ho to call jQueryUI using use google libraries?

    install instructions just say ‘install and activate’ no mention of calling the script?
    Bit of a newbie!

    Thank you!

Viewing 15 replies - 1 through 15 (of 19 total)
  • esmi

    @esmi

    Forum Moderator

    Thanks Esmi! so i do have to use enqueue script with the plugin?

    esmi

    @esmi

    Forum Moderator

    With the Google Libraries plugin? No. That plugin simply replaces the jQuery shipped in WordPress core with Google’s version.

    so with plugin installed when i use the following code, its callung from google CDN?

    <head>
    <style type="text/css" media="screen">
    	@import url("<?php bloginfo("stylesheet_url"); ?>");</style>
    <?php wp_enqueue_script('jquery'); ?>
    <?php wp_enqueue_script('jquery-ui-core'); ?>
    <?php wp_head(); ?>
    <script>
      jQuery(document).ready(function() {
        jQuery("#accordion").accordion({ header: "h3" });
      });
      </script>
    </head>

    If you want to use jQuery UI (or any of the scripts shipped with WordPress that are supported by UGL), get your code working without UGL enabled. Be sure to have WP_DEBUG set to true to ensure you aren’t generating any new errors. Once that’s working, activate UGL.

    All it does is change the location the script is loaded from if you enqueue it correctly in the supported manner.

    esmi

    @esmi

    Forum Moderator

    You need to enqueue scripts via your theme’s functions.php file. See the function’s Codex page for details.

    ok thanks Jason and Esmi. Where is WP_DEBUG?

    so i should get accordion working while UGL is deactivated?

    I have the accordion working now though. when i deactivate UGL it stops working.

    ‘All it does is change the location the script is loaded from if you enqueue it correctly in the supported manner.” – have i enqueued it properly, if not what is the correct way?

    Many Thanks

    Frank

    esmi

    @esmi

    Forum Moderator

    Where is WP_DEBUG?

    See this Codex section.

    have i enqueued it properly

    Not if you’re adding that code above to your theme’s header.php file. It needs to be in your theme’s functions.php file. I’d also suggest that you remove:

    <script>
      jQuery(document).ready(function() {
        jQuery("#accordion").accordion({ header: "h3" });
      });
      </script>

    place it in an external .js file within your theme and enqueue it also.

    You have not enqueued it properly. Please read the codex page (the codex also covers WP_DEBUG). The code you posted will break a lot of things, although it may appear to work in some cases if you are lucky.

    Never put the javascript right into the page if you want to depend on scripts provided with WordPress like that. It won’t work out.

    You want to put your javascript it it’s own file (for example ‘js/theme_enhancements.js’).

    Then you do something like this in your theme’s functions.php:

    function my_scripts_method() {
       // script depends on jquery-ui-accordian, so register
       // that as a dependency
       wp_register_script('my_theme_enhancements',
           get_template_directory_uri() . '/js/theme_enhancements.js',
           array('jquery-ui-accordian'),
           '1.0' );
       wp_enqueue_script('my_theme_enhancements')
    }
    
    add_action('wp_enqueue_scripts', 'my_scripts_method');

    But really, read the Codex page so you understand why.

    Thank you guys. Dont have a functions.php file, should copy one from twentyeleven and add this? Was looking for relevant codex page is it ‘Function Reference/wp enqueue script?

    do i need to put this in separate js file and then call it from functions.php using above structure? do i need to mention jquery-ui-accordion as you have above, thought it would be automatically called? sorry, quite confused.

    <script>
    jQuery(document).ready(function() {
    jQuery(“#accordion”).accordion({ header: “h3” });
    });
    </script>

    cant find functions codex page.

    esmi

    @esmi

    Forum Moderator

    should copy one from twentyeleven and add this?

    Nooo! Start with a completely blank function.php file.

    do i need to put this in separate js file and then call it from functions.php using above structure?

    Yes.

    do i need to mention jquery-ui-accordion

    Ideally it should be referenced as a dependency when you enqueue the new .js file, yes.

    thanks so all i need in functions.php is

    <?php
    function my_scripts_method() {
       // register your script location, dependencies and version
       wp_register_script('custom_script',
           get_template_directory_uri() . '/js/custom_script.js',
           array('jquery'),
           '1.0' );
       // enqueue the script
       wp_enqueue_script('custom_script');
    }
    add_action('wp_enqueue_scripts', 'my_scripts_method');
    ?>

    so i leave that line with jquery-ui-accordion as Jason wrote it? just change the name of the js file?

    much appreciated, thought this would be more automatic but its good to explore!

    If your custom script uses the accordion then you should change your dependency to array('jquery-ui-accordian') which will automatically bring in all the libraries accordion depends on.

    When UGL is active this will be just jquery, and the jquery-ui combined bundle file, but without it enabled it’ll be a number of smaller files.

    I’m not sure why I took the time to give you the answer just to have you ignore me.

    Sorry Jason, i’m not ignoring you you’re just using terms i dont really understand, wasnt sure whether that line was as an example, but have read a bit on it now and get that bit.

    ‘Dependency’ is a new one to me, i get what it is (the third part of the wp_register_script?)

    so this is my_accordion.js

    <script>
      jQuery(document).ready(function() {
        jQuery("#accordion").accordion({ header: "h3" });
      });
      </script>

    and this is my functions.php

    <?phpfunction my_scripts_method() {
       // script depends on jquery-ui-accordian, so register
       // that as a dependency
       wp_register_script('my_accordion',
           get_template_directory_uri() . 'my_accordion.js',
           array('jquery-ui-accordian'),
           '1.0' );
       wp_enqueue_script('my_accordion')
    }
    
    add_action('wp_enqueue_scripts', 'my_scripts_method');
    ?>

    is this all i need?

    Thank you!

Viewing 15 replies - 1 through 15 (of 19 total)
  • The topic ‘[Resolved] how to 'use google libraries'’ is closed to new replies.
Skip to toolbar