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 3 años, 4 meses por jose64. Razón: Mover al foro adecuado
Viendo 14 respuestas - de la 1 a la 14 (de un total de 14)
  • Moderador kallookoo

    (@kallookoo)

    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.

    Iniciador del debate banics

    (@banics)

    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.

    Moderador kallookoo

    (@kallookoo)

    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/

    Iniciador del debate banics

    (@banics)

    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.

    Moderador kallookoo

    (@kallookoo)

    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 3 años, 4 meses por kallookoo.
    Iniciador del debate banics

    (@banics)

    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.

    Moderador kallookoo

    (@kallookoo)

    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.

    Iniciador del debate banics

    (@banics)

    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

    Iniciador del debate banics

    (@banics)

    Hola de nuevo.

    Pues definitivamente, pasa algo extraño con el tema…

    He puesto el siguiente código en functions PHP:

    <?php
    
    function my_favicon_link() 
    {
        echo '<span>hola</span>';
    }
    add_action( 'wp_head', 'my_favicon_link' );
    
    ?>

    He probado también a ponerlo en un functions.php de otra web que tengo y ahí si funciona perfectamente….

    Debido a que esta pagina que tengo problemas es un dominio adicional, la carpeta de la propia web no esta en la carpeta public_html/wp-content, si no en otra a parte que he creado….¿Puede ser este el problema?

    Gracias de antemano y un saludo.

    Iniciador del debate banics

    (@banics)

    Hola de nuevo.
    Me respondo a mi mismo. Efectivamente, algo pasa con esa ubicación. Tengo una tercera web montada con ese mismo tema. Acabo de probar poniendo en el functions.php el mismo código y funciona.

    Por tanto, el problema es que no lee bien el functions.php en mi tema hijo. El unico problema que veo es la localización de la carpeta.

    Al ser un dominio adicional, seguí las recomendaciones que vi de crearla en una carpeta aparte….

    • Esta respuesta fue modificada hace 3 años, 4 meses por banics.
    Moderador kallookoo

    (@kallookoo)

    Hola @banics

    Seria posible ver online dichas webs, para ver a donde apuntan. lo que comentas no es algo que suela pasar asi que podriamos deducir un monton de cosas y esta mareando la perdiz.
    Luego que recomendaciones seguistes?
    Puedes tener los WordPres que quieras en un mismo servidor no hay que hacer nada en especial he incluso con la misma base de datos con algunos ajustes extras.

    Sinceramente estoy perdido con tu caso, ya que comentas que tienes bien creado el tema hijo pero no utiliza sus archivos y eso es en teoria imposible.
    Ahora mismo solo se me ocurre que tengas mal configurado el WordPress, pero es hablar por hablar.

    Iniciador del debate banics

    (@banics)

    Hola @kallookoo

    ¿Puedo preguntar a que te refieres con ver de manera online?
    No me importaría enseñarte la estructura y te agradezco tu ayuda.

    La recomendación la encontré en un tutorial de como agregar dominios adicionales al hosting. La estructura ahora mismo que tengo es esta:

    Captura árbol general

    Y ya, dentro de la carpeta seadigital (la web con problemas), esta:

    Captura árbol web adicional

    Gracias de antemano y un saludo.

    Moderador kallookoo

    (@kallookoo)

    Me refiera que se pueda consultar para comprobar si las direcciones son correctas. Pero parace mas diria que por las capturas que no correcto.
    Consulta con tu proveedor para que te confirme que puedes añadir carpetas fuera de public_html y que tienes bien definido lo siguiente:
    – Dirección de WordPress (URL)
    – Dirección del sitio (URL)

    Iniciador del debate banics

    (@banics)

    Hola de nuevo @kallookoo. Despues de investigar, mandar correos y demas, me he dado cuenta por casualidad, y es un error tontísimo.

    Simplemente, cuando guardaba los cambios, los comprobaba accediendo a la pagina…pero no me di cuenta de que wordpress (al dar visitar sitio) me estaba redirigiendo al dominio sin HTTPS….en cambio (mi maquetador de paginas que tengo) si me esta trabajando sobre el dominio con HTTPS, y ahi si que se ven reflejado los cambios en el functions.php….

    Cambios reflejados

    Cambios no reflejados

    Supongo que tengo que redirigir siempre al https….

    Gracias y un saludo.

    PD: vale, ahora parece que va bien en ambos….estoy pensando que, al tener el maquetador de pagina abierto, a lo mejor deja la pagina cogida y no recarga bien hasta que lo cierras.

    Aun no lo se por que esto con elementor juraría que no me pasaba….

    • Esta respuesta fue modificada hace 3 años, 4 meses por banics.
Viendo 14 respuestas - de la 1 a la 14 (de un total de 14)
  • El debate ‘Añadir función a botones de HTML’ está cerrado a nuevas respuestas.