Contenido

wp_enqueue_script() esa gran función

3 Ago

+ 6

Hace unos meses comentaba la existencia de una función con la que permitimos cargar librerías de Javascript incluidas en WordPress. Esta función se llama wp_enqueue_script().

Declaración

 wp_enqueue_script( $handle, $src = false, $deps = array(), $ver = false );

Scripts que podemos cargar

Name Calling Name
Docking Boxes dbx
Fade Anything Technique fat
Simple AJAX Code-Kit sack
QuickTags quicktags
ColorPicker colorpicker
Tiny MCE tiny_mce
WordPress Tiny MCE wp_tiny_mce
Prototype Framework prototype
Autosave autosave
WordPress AJAX wp-ajax
List Manipulation listman
Scriptaculous Root scriptaculous-root
Scriptaculous Builder scriptaculous-builder
Scriptaculous Drag & Drop scriptaculous-dragdrop
Scriptaculous Effects scriptaculous-effects
Scriptaculous Slider scriptaculous-slider
Scriptaculous Controls scriptaculous-controls
Scriptaculous scriptaculous
Image Cropper croppe

Ejemplo de uso

 wp_enqueue_script("prototype");

De esta forma estamos cargando los archivos del framework prototype y por lo tanto podremos usar sus propiedades en la página que estemos invocando la función anterior.

Ejemplo práctico

Un ejemplo del uso de esta función sería la posibilidad de añadir el editor enriquecido a los comentarios sin necesidad de ningun tipo de plugin. Para ello tendremos que seguir lo siguientes pasos.

Primero cargamos los ficheros necesarios para que el editor pueda funcionar, para ello llamaremos a nuestra querida función con el parametro pertinente.

wp_enqueue_script("tiny_mce");

sto lo haremos en  nuestro <head></head>, de esta forma estamos invocando los ficheros que TinyMCE necesita para funcionar.Ahora nos queda indicarle al script que los elementos y las opciones necesarias para que el editor enriquecido en los comentarios sea una realidad.

  <script type="text/javascript">
             tinyMCE.init({
             mode : "exact",
             themes : "simple",
             theme_advanced_toolbar_location : "top",
             elements : "comment" });
          </script>
  • esta muy bueno, pero podrias esplicar un poco mas algunas funciones de los scripts?

  • perdón pero estoy un poco verde en esto;

    ¿donde habría que insertar

    
                 tinyMCE.init({
                 mode : "exact",
                 themes : "simple",
                 theme_advanced_toolbar_location : "top",
                 elements : "comment" });
              

    para que salga la barra de herramientas en el formulario de los comentarios?

    ¿y en el caso del bbpress? Suponiendo que estas usando el mismo header que el wordpress, ¿donde habría que insertar el script?

  • Pablo, no entiendo a que scripts te refieres.

    Ganzua, eso tendrías que ponerlo para ser lanzado desde el evento onload de la página.

    Saludos

  • aNieto2k, perdón pero no te sigo. ¿Te refieres a ponerlo en el comments.php del template?

  • Ganzua, perdona no me expliqué bien.

    Esto debería lanzarse una vez se haya cargado como mínimo el elemento involucrado, por lo tanto puedes optar por dos opciones.

    1) Poner el código (del TinyMCE) justo debajo del textarea de los comentarios, en el fichero comments.php.
    2) La otra opción sería usar el fichero header.php y el evento onload para conseguir el mismo efecto.
    Para ello introduciría esto entre los tags <head> … </head>

    
    window.onload = funcion() {
    tinyMCE.init({
                 mode : "exact",
                 themes : "simple",
                 theme_advanced_toolbar_location : "top",
                 elements : "comment" });
    }
    
    

    Espero que te sirva, Saludos 😀

  • Hola aNieto2k! Gracias por responder.

    Debo ser bastante torpe porque no consigo que funcione ninguno de los dos metodos;

    esto en el header;

      
    
    
    
                    window.onload = funcion() {
    tinyMCE.init({
                 mode : "exact",
                 themes : "simple",
                 theme_advanced_toolbar_location : "top",
                 elements : "comment" });
    }
    
    

    no me funciona

    y esto en el comments.php despues de poner wp_enqueue_script(«tiny_mce»); en el header tampoco;

    
    
                 tinyMCE.init({
                 mode : "exact",
                 themes : "simple",
                 theme_advanced_toolbar_location : "top",
                 elements : "comment" });
              
    

    Hasta el momento solo he conseguido poner el tinymce en los formularios mediante un plugin que hay para ello, pero no me soluciona el ponerlo en el bbpress y en el contact-form. 🙁

Comentar

#

Me reservo el derecho de eliminar y/o modificar los comentarios que contengan lenguaje inapropiado, spam u otras conductas no apropiadas en una comunidad civilizada. Si tu comentario no aparece, puede ser que akismet lo haya capturado, cada día lo reviso y lo coloco en su lugar. Siento las molestias.