Soporte » Guías – Resolución de problemas » Añadir función a botones de HTML

  • Hola. Actualmente uso un tema wordpress que tiene su propio maquetador de paginas.

    En dicho maquetador, he creado un botón para que, al pulsarlo, cambie un valor de un span que hay justo debajo.

    Esto lo he hecho en la propia declaración del botón:

    <button onclick=”codigo php”>Boton</button>

    Lo hace bien, pero quiero (por elegancia y por futuras implementaciones) encapsular todo en una función, pero soy incapaz de hacerlo.

    He intentado todo, desde hacer un wp_enqueue_script, o declarar la función en el function.php de mi tema hijo, etc…

    Gracias de antemano y un saludo.

    • Este debate fue modificado hace 1 día, 6 horas por Jose Luis. Razón: Mover al foro adecuado
Viendo 8 respuestas - de la 1 a la 8 (de un total de 8)
  • Hola @banics

    Lo primero estaria bien saber que theme usas y cual builder, ya que suelen tener esas opciones implementadas ya sea en el propio builder o con un complemento.

    Despues no me queda muy claro como intentas implementarlo utilizando el function.php con un simple archivo javascript incluyendo un on click usando jquery o puro javascript seria mas que sufiente.

    Hola @kallookoo. Cierto, siento mi falta de información inicial.

    Uso el tema Customizr (versión Free) con le maquetador Nimble Builder (exclusivo del tema).

    La verdad es que tengo poca base de desarrollo web, entonces vi ejemplos en internet y vi que hacían eso…

    Tengo un archivo JS en el cual tengo esto:

    $(document).on(«click», «#buttonprices», function(e) {
    alert(‘hola’);
    });

    Para hacer una alerta normal. y luego en el function.php tengo esto:

    function load_js_assets()
    {
    wp_enqueue_script(‘cambiar_precios’,get_template_directory_uri().’/cambiar_precios.js’, array(‘jquery’), », false);
    }

    add_action(‘wp_enqueue_scripts’,’load_js_assets’);

    El Problema es que no hace el add action.

    Gracias de antemano y un saludo.

    Hola @banics

    Una cosa, si te acuerdas la proxima vez utiliza la etiqueta code para añadir codigo, nos hace mas facil visualizarlo y evitas que se pierda codigo.
    Viendo tu codigo cambia la function get_template_directory_uri() por get_stylesheet_directory() y si quieres tambien podrias leerte la documentacion
    https://developer.wordpress.org/themes/advanced-topics/child-themes/

    Hola de nuevo @kallookoo, gracias pro tus respuestas.

    Lo he cambiado, pero al dar a inspeccionar codigo en la pagina, y buscando con control + f mi nombre del js, sigue sin aparecer, como si el wp_enqueue_script no me funciona.

    No se si el functions de mi tema hijo lo esta teniendo en cuenta, ya que he puesto esta funcion de prueba y no hace nada:

    function prueba()
    {
        window.open("http://google.com");
    }
    
    add_action( 'wp_head', 'botonprecios' );

    Gracias de antemano y un saludo.

    Hola @banics

    Perdona, viendo lo que puse me olvide de poner «uri», la function es esta;
    get_stylesheet_directory_uri()

    Sobre ese codigo que pones ahora es normal que no te funcione metes codigo javascript en PHP con intencion de añadirlo al html tal cual y sin imprimirlo.
    En todo caso seria asi:
    echo "<cript>window.open('http://google.com');</script>";
    Aunque el action wp_head no esta destinado para ese uso.

    Ahora si el archivo functions.php esta en la raiz de tu child theme lo lee si o si.
    Prueba con la function bien escrita y asegurate de que la direccion es correcta.

    • Esta respuesta fue modificada hace 1 día, 3 horas por kallookoo.

    Hola de nuevo @kallookoo.

    He probado pero sigue sin funcionar. He colocado el js tanto en la raiz del tema hijo, como en la raíz de la pagina (justo donde están las carpetas wp-content y wp-admin)

    wp_enqueue_script('cambiar_precios',get_stylesheet_directory_uri().'/cambiar_precios.js', array('jquery'), '', false);

    Al final estoy por poner el código directamente en la declaración HTML del botón como estaba, aunque prefiriera evitarlo XD.

    Gracias de antemano y un saludo.

    Hola @banics

    Me parece que andas un poco perdido, vamos por partes.
    La estructura del tema hijo deberia ser la siguiente:
    – tema-hijo
    — style.css
    — functions.php
    — otros archivos llamados templates como podria ser header.php, footer.php, etc… con su respectivo codigo php, html para cambiar el comportamiento original del template que tenga el tema padre.

    Dentro del style.css deberias tener al principio del archivo un comentario con unos datos concretos para que el WordPress sepa que theme es y cual es su padre.
    Como te muestran aqui; https://developer.wordpress.org/themes/advanced-topics/child-themes/#2-create-a-stylesheet-style-css

    Dentro del functions.php debes definir tu codigo y al principio debes abrir la etiqueta php asi <?php luego el codido PHP.
    Por ejemplo si fuese necesario llamar al style.css; tal como te lo explican aqui; https://developer.wordpress.org/themes/advanced-topics/child-themes/#3-enqueue-stylesheet
    Añadir mas opciones al personalizador, nuevos tamaños de imagens y un larga lista de posibilidades.

    Y por ultimo aqui se te explica como añadir archivos javascript o css; https://developer.wordpress.org/themes/advanced-topics/child-themes/#enqueueing-styles-and-scripts

    Como veras no es dificil si te tomas tu tiempo en leerlo aunque no sepas ingles o no lo entiendas del todo que hace cada cosa.
    Igualmente existen varios traductores online que te podrian ayudar en entender alguna parte.

    Despues el WordPress esta pensado para todo tipo de usuarios pero se tiene que entender lo minimo y si no se entiende se tiene que mirar su extensa documentacion o en caso de no saber de programacion buscar un plugin o plugins que te ayuden en la creacion de tu web.
    Practicamente existe un plugin para cualquier cosa.

    Hola de nuevo.

    Si, es así como lo tengo definido el tema hijo. Lo de poner el JS en varios sitios ha sido desesperación pura.

    De todas maneras he observado algo curioso. Usando el plugin simple css, si me detecta cambios de estilo… en cambio, poniéndolos en el style.css propio del tema hijo no…

    lo he intentado dándole css al botón que he creado… ¿puede ser que no me este leyendo bien el style.css y el functions.php? En tal caso, probare con algún plugin para modificar el functions.php

Viendo 8 respuestas - de la 1 a la 8 (de un total de 8)
  • Debes estar registrado para responder a este debate.