WordPress por defecto tiene algunos esquemas de colores que puedes usar para personalizar la administración del sitio, sin embargo en este artículo veremos cómo agregar esquemas personalizados adicionales.
Resultado Final
Al final lo que queremos obtener será un nuevo esquema de colores que el usuario pueda elegir para personalizar el backend del sitio.
Generando un nuevo Esquema de Color
El sitio que usaremos para generar un nuevo esquema de color es WordPress Admin Colors
Seleccionaremos la opción de Start Creating, luego podremos elegir un nombre, un identificador y seleccionar los colores para el nuevo esquema.
Podrás ver los cambios directamente en el mismo sitio web, una vez culminado podrás generar el esquema de color
Aparecerá una pantalla en la cual se distinguen dos pasos:
- El primero de ellos indica el código CSS como parte de un archivo que hay que descargar y copiar a la carpeta de tu tema activo.
- El segundo paso es usar un código PHP que debes copiar como parte del archivo functions.php de tu tema o en algún plugin de Snippets.
Usando el código CSS generado
Tras descargar el archivo puedes copiarlo como parte de los archivos de tu tema. El archivo tendrá el nombre que definiste en el campo de identificador de esquema.
En nuestro ejemplo estamos usando un tema hijo del tema StoreFront, por lo que el archivo tenemos que copiarlo en la siguiente ruta:
wp-content/themes/store-front-child/
Usando el código PHP
El generador de colores de esquemas también nos brinda un código PHP, este código esta preparado para hacer referencia al archivo .css que hemos copiado. Este código permite ver de manera visual el nuevo esquema en el perfil del usuario.
Sin embargo el código, al menos de momento, tiene un bug y no funciona con temas hijo, por lo que haremos un pequeño cambio.
Cambia la función get_template_directory_uri() por get_stylesheet_directory_uri(), el código quedaría:
$theme_dir = get_stylesheet_directory_uri();
Conclusión
No siempre los esquemas de colores que vienen por defecto en WordPress se adaptan a los colores corporativos de tu sitio, en este artículo hemos visto cómo generar nuevos esquemas de colores y personalizar de esta forma los colores de la administración de WordPress.
¿Aún con dudas?, en el siguiente video se detallan los puntos anteriores
Artículos Relacionados
(3 votos, promedio: 5,00 de 5)
Cargando...