Incluir Font Awesome en input de un Formulario con CSS

Me tope con la necesidad de decorar un poco un formulario, existen muchos resultados en la web para lo que necesitaba pero decidí hacer uno propio utilizando Font Awesome y este fue el resultado.


See the Pen Formulario con Font Awesome by Lili López Gutiérrez (@creandoweb) on CodePen.


Agregar Ajax en un Plugin de Wordpress


Para los que desean crear un plugin en wordpress que ejecute una función utilizando Ajax este es el código a ejecutar.


En este ejemplo vamos a usar un archivo .js en la misma carpeta de nuestro plugin que ejecute las sentencias jquery en wordpress 

Vamos a tener un botón que al dar clic ejecute una función en wordpress y retorne un valor usando Ajax. El botón lo vamos a incluir como un Shorcode Wordpress
 


//  Activa el shortcode [cwBotonprueba] 

add_shortcode('cwBotonprueba', 'pintar_el_boton');
   

function pintar_el_boton () {
     
      // Código para agregar el archivo .js al usar el el shortcode
      wp_register_script ('cw_script.js', plugins_url('ruta/cw_script.js', _FILE_),  array(jquery));
      wp_enqueue_script('jquery'); // Incluimos también el Jquery
      wp_enqueue_script('cw_script.js');
     
      // pintamos el botón
      print "Clic en el botón para ejecutar ajax ";
      print "
"; }
Para activar una acción que se ejecute con Ajax usamos add_action creando una nueva acción siempre con el prefijo "wp_ajax_", el código quedará así
 

    add_action( 'wp_ajax_cw_nombre_a_usar', 'cw_funcion_que_retorna_en_ajax' );

    function cw_funcion_que_retorna_en_ajax () {
              
              $loquepasamos = $_POST['PasamosUnaVariable']
 
              print   "Este es el valor retornado en Ajax y el valor de la variable ". $loquepasamos ; 
              wp_die(); // Esto es requerido para terminar y retornar apropiadamente la respuesta 
    }

Por último revisemos el archivo .js que es el encargado de ejecutar la acción y retornar el valor. Pasamos "activo" que es la función que creamos sin el prefijo, la enviamos Post, utilizando una variable que desde la versión 2.8 está definida en el "header" del administrador de wordpress y da la ruta a admin-ajax.php, para versiones anteriores debemos usar la ruta completa al archivo. En este pintamos con JQuery la respuesta en un div. Al fina al oprimir el botón del shortcode, este debe retornar "Este es el valor retornado en Ajax y el valor de la variable 1"
 
jQuery(function($) {
    $("#selectordepaises").change(function() {
        
  var data = {
   'action': 'cw_tabla_paises', // Valor de la función definida quitando el prefijo
   'PasamosUnaVariable': '1';
  };
  
  $.post(ajaxurl, data, function(response) {
   $("#DivRecibeRespuesta").html(response);
  });
        
    });
}); 

Cómo crear Shortcodes anidados en WordPress

Los Shortcodes o accesos cortos en WordPress son funciones agregadas que nos permiten imprimir en wordpress salidas en nuestras páginas o entradas. Existen unos shortcode predefinidos para wordpress (Listado de Shortcode), pero también podemos crear nuestros propios shortcode.

Tabla de precios HTML CSS

Luego de mucho buscar no encontré una tabla de precios que reuniera todas las caracteristicas que yo deseaba, así que he creado está.

See the Pen Tabla de Precios by Lili López Gutiérrez (@creandoweb) on CodePen.

Probar código HTML CSS y JS en línea

Muchas veces he necesitado probar código antes de ubicarlo en directamente en la web, tal vez como mala práctica, cuando me piden cambios rápidos en un sitio siempre lo hago de esta forma, encontré este sitio que me permite probar mi código.

http://codepen.io/



See the Pen Hguzc by Lili López Gutiérrez (@creandoweb) on CodePen.

Diseño cuenta de cobro persona natural en word para Colombia






Desde hace algún tiempo he buscado un diseño aceptable y profesional para enviar las cuentas de cobro a mis clientes, así que hoy me di a la tarea de crear un diseño, y me agrado tanto el resultado que deseo compartirlo con ustedes.

Solamente estoy ofreciendo un formato, no hay programación.

Dominios gratuitos en español

Los dominios gratuitos .tk, son la solución si no se cuenta con dinero para comprar un dominio, permiten una completa configuración. Clic sobre la siguiente imagén y comienza a buscar tu dominio