Personalizar estilos css en WordPress a Través De mi plugin

Personalizar los estilos de mi tema en WordPress con un plugin propio

 

En esta ocasión vamos a cambiar los estilos de nuestra plantilla a través de nuestro plugin, así lo tenemos separado de la parte de la apariencia de temas y no hace falta que creemos un tema hijo.

Para ello, localizamos la carpeta plugins de nuestro proyecto y creamos un nuevo fichero con el nombre por ejemplo mi-plugin.php.

Todo lo que pongamos en este archivo es como si lo leyese del functions.php

Dentro del archivo creado comentamos unas líneas que servirán para que WordPress lea los datos.

Vamos a registrar el estilo para que los use en la plantilla, dentro de las etiquetas <?php justo debajo de los comentarios escribimos la función

/*
Plugin Name: Estilos Personalizados
Plugin URI: Si se puede descargar de algún sitio Web, si no, lo dejamos vacío
Description: Estilos personalizados para el tema !IMPORTANTE! No desativar
Version: 1.0
Author: Óscar Amate
Author URI: La dirección de tu Web si la tienes
Licence: Si va a tener algún tipo de licencia
*/

function mis_estilos() {
wp_register_style('mis-estilos', get_template_directory_url().'/css/mis-estilos.css', array(), '1.0'); 
wp_enqueue_style('mis-estilos');
}
add_action('mis_estilos');

Activamos el plugin en el apartado del escritorio del WordPress.

  • El primer parámetro es el nombre que le queremos poner para registrarlo.
  • El segundo parámetro es la ubicación de donde se encuentra el archivo de estilos que hemos creado, para ello usamos una función que te ubica en el directorio principal del tema y le concatenamos la ruta de nuestro archivo creado.
  • El tercer parámetro es un array donde especificamos el archivo que queremos cargar primero, en caso de que tengamos más. En mi caso lo dejaré vacío ya que  el mis-estilos.css es el único que voy a cargar.
  • El cuatro parámetro es para la versión ya que el navegador lo guarda de forma estática y si realizamos cambios no se refrescarán a no ser que cambiemos de versión.

Después llamamos el estilo con la función wp_enqueue_style y le pasamos como parámetro el nombre que le hemos puesto, en el primer parámetro del wp_register_style.

Y por último lo añadimos al hook en el add_action con el wp_enqueue_scripts de primer parámetro y como segundo parámetro le pasamos el nombre de la función mis-estilos.

Crear el archivo CSS donde vamos a crear los estilos

 

Ahora tenemos que ir a la carpeta css del proyecto y crear un nuevo archivo, le pondremos por ejemplo, mis-estilos.css. Dentro de este archivo .css podemos escribir los nuevos estilos para nuestra plantilla de WordPress y voilá, ya podemos personalizar la plantilla a tope sirope…

Ver más tips