ThemeLocal: consejos de blog que funcionan como magiaThemeLocal: consejos de blog que funcionan como magiaThemeLocal: consejos de blog que funcionan como magia
  • Marketing por correo
  • Más
Search
© 2022 Themelocal. Reservados todos los derechos.
Lectura: Colores de celda de tabla personalizados en el panel de administración de WordPress
Cuota
Notificación Mostrar más
Aa
ThemeLocal: consejos de blog que funcionan como magiaThemeLocal: consejos de blog que funcionan como magia
Aa
  • Marketing por correo
  • Más
Search
  • Marketing por correo
  • Más
Síganos
© 2022 Themelocal. Reservados todos los derechos.
ThemeLocal: consejos de blog que funcionan como magia > Blog > Tutoriales > Colores de celda de tabla personalizados en el panel de administración de WordPress
Tutoriales

Colores de celda de tabla personalizados en el panel de administración de WordPress

Última actualización: diciembre 13, 2021 11:08 am
ThemeLocal hace 4 años 8 Minutos mínimos para leer
Cuota
8 Minutos mínimos para leer
Cuota

Siempre pensé que sería interesante poder cambiar las filas de las publicaciones de color de fondo de acuerdo con diferentes criterios en la administración de WordPress. Entonces, miré a mi alrededor y encontré algunos tutoriales para hacerlo. Pero lo malo es que todos los tutoriales tenían el mismo código, probablemente un simple copiar y pegar. Y además, después de algunas pruebas, vi que todas estas publicaciones estaban incompletas. Es por eso que decidí profundizar un poco más en la explicación de cómo agregar colores de fondo específicos a la fila de publicaciones. ¡Y para hacerlo, vamos a crear un nuevo complemento!

Contents
Paso 1: el complementoPaso 2: la clase principalPaso 3: Estilo de las publicaciones¿Qué pasa con las publicaciones fijas?Descargar el complemento

Paso 1: el complemento

Ok, entonces, para comenzar, necesitamos crear un complemento, como vimos en mis publicaciones anteriores, esta es la parte más simple. Cree una nueva carpeta en wp-content / plugins y asígnele el nombre «color-my-posts». Dentro de él, cree un nuevo archivo y llámelo…. “Color-my-posts.php” (¡no crea que no tengo imaginación!). Abra este archivo y agregue este código:

<?php
/*
Plugin Name: Color My Posts
Plugin URL: http://remicorson.com/color-my-posts
Description: A little plugin to color post rows depending on the posts' status in the administration
Version: 0.1
Author: Remi Corson
Author URI: http://remicorson.com
Contributors: corsonr
tags: color, customization, administration, corsonr, remi corson
*/

Lo que esto hace es simplemente decirle a WordPress que hay un nuevo complemento llamado «Color de mis publicaciones» dentro de su carpeta de complementos. Ahora su complemento, incluso si está vacío, debería aparecer en la lista de complementos en el menú «Complementos». En el siguiente paso, crearemos una clase simple para instanciar el complemento.

Paso 2: la clase principal

Como creamos una clase en mi tutorial sobre cómo agregar atributos personalizados a los menús de WordPress, necesitamos hacer lo mismo y crear una clase, así es como se hace:

class rc_color_my_posts {

	/*--------------------------------------------*
	 * Constructor
	 *--------------------------------------------*/

	/**
	 * Initializes the plugin
	 */
	function __construct() {

		add_action('admin_footer', array( &$this,'rc_color_my_admin_posts') );

	} // end constructor

	function rc_color_my_admin_posts(){
		/* Be patient ! */
	}

}

// instantiate plugin's class
$GLOBALS['color_my_posts'] = new rc_color_my_posts();

Aquí estamos creando una clase llamada “rc_color_my_posts que contiene un constructor y una función llamada rc_color_my_admin_posts (). En el constructor estamos conectando la función rc_color_my_admin_posts () a admin_footer. Esto significa que nuestra función se tendrá en cuenta durante la carga del pie de página de administración. Ahora todo lo que tenemos que hacer es agregar código CSS a nuestra función. Este código se imprimirá directamente en el código fuente de las páginas de administración de WordPress.

Paso 3: Estilo de las publicaciones

Como dije antes, todos los tutoriales que hablan sobre el estilo de la fila de publicaciones en la administración de WordPress que vi, solo tratamos con el estado de las publicaciones. Eso es cierto, puede diseñar publicaciones fila por estado de publicación, pero no solo. Para aquellos que estén interesados, hay una función llamada get_post_class () en el /wp-includes/post-template.php archivo central. Por si acaso – ¡No modifique el código de este archivo (al menos ni por ahora)!

Bueno, esta función get_post_class () es excelente porque es la responsable de determinar las clases posteriores. Esta función se utiliza en la administración y en el frontend. A continuación, se explica cómo agregar código CSS personalizado para cada clase generada por get_post_class:

function rc_color_my_admin_posts(){
 ?>
 <style>
 /* Color by post Status */
 .status-draft { background: #ffffe0 !important;}
 .status-future { background: #E9F2D3 !important;}
 .status-publish {}
 .status-pending { background: #D3E4ED !important;}
 .status-private { background: #FFECE6 !important;}
 .post-password-required { background: #ff9894 !important;}
/* Color by author data */
 .author-self {}
 .author-other {}
/* Color by post format */
 .format-aside {}
 .format-gallery {}
 .format-link {}
 .format-image {}
 .format-quote {}
 .format-status {}
 .format-video {}
 .format-audio {}
 .format-chat {}
 .format-standard {}
/* Color by post category (change blog by the category slug) */
 .category-blog {}
/* Color by custom post type (change xxxxx by the custom post type slug) */
 .xxxxx {}
 .type-xxxxx {}
/* Color by post ID (change xxxxx by the post ID) */
 .post-xxxxx {}
/* Color by post tag (change xxxxx by the tag slug) */
 .tag-xxxxx {}
/* Color hAtom compliance */
 .hentry {}
</style>
 <?php
 }

Como este código no es complicado, agregué comentarios en el código mismo. Básicamente, para diseñar filas mediante:

  • Estado de la publicación, use .status-xxx donde xxx es el estado de la publicación
  • Autor, use .author-self para orientar las publicaciones que escribió, y .author-other para publicaciones escritas por otros autores
  • Formato de publicación, use .format-xxx donde xxx es el formato de publicación
  • Categoría de publicación, use .category-xxx donde xxx es la categoría slug, puede apuntar a tantas categorías como desee
  • Tipo de mensaje, use .xxx o .type-xxx donde xxx es el tipo de publicación slug, puede apuntar a tantos CPT como desee
  • ID del mensaje, use .post-xxx donde xxx es el ID de la publicación, puede apuntar a tantas publicaciones como desee
  • Etiqueta de publicación, use .tag-xxx, donde xxx es la etiqueta slug, puede apuntar a tantas etiquetas como desee
  • .hentry se utiliza para apuntar hátomo cumplimiento

No he establecido colores para todas las clases, pero puede hacerlo usted mismo y personalizar el complemento para que se vea como realmente desea.

¿Qué pasa con las publicaciones fijas?

Cuando estaba trabajando en este pequeño complemento, noté que no se había agregado ninguna clase a las publicaciones fijas. Bueno, al menos en la administración. Así que volví al archivo post-template.php y vi que hay una clase .sticky agregada a la publicación adhesiva, pero solo si is_home () &&! Is_paged ()… ¿por qué? Eso es realmente extraño. Esa es la razón por la que creé un boleto en la pista principal de WordPress para mencionarlo. Para aquellos que realmente quieren poder diseñar publicaciones fijas en el administrador, simplemente agregue este código a la función get_post_class () incluso si recomiendo nunca modificar los archivos centrales de WordPress:

// sticky for Sticky Posts in administration
if ( is_sticky($post->ID) && is_admin() )
$classes[] = 'post-sticky';

Descargar el complemento

Para aquellos que quieran usar el complemento directamente sin tener que crearlo usted mismo, agregué el complemento al repositorio, simplemente haga clic aquí para descargarlo.

También podría gustarte

Los IEM personalizados de Dark Matter son auriculares de otra dimensión

El nuevo panel de TV OLED de LG Display aumenta el brillo

iOS 18.2: crea emojis personalizados en mensajes con Genmoji

Genmoji en iOS 18.2: crea emojis personalizados en mensajes

Personalizar los colores y el tamaño de los iconos de las aplicaciones en iOS 18

ETIQUETADO: administración, celda, Colores, panel, personalizados, tabla, WordPress
Comparte este artículo
Facebook Twitter Pinterest Whatsapp Whatsapp
Cuota
¿Qué piensas?
Amor0
Triste0
Contento0
Somnoliento0
Enfadado0
Sin comentarios0
Guiño0
Artículo anterior Cómo crear un archivo de fanfiction con WordPress
Artículo siguiente Cómo cambiar correctamente el nombre de las categorías en WordPress (Guía para principiantes)
Deja un comentario

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Publicación popular

También podría gustarte

Los IEM personalizados de Dark Matter son auriculares de otra dimensión

hace 1 año 3 Minutos mínimos para leer

El nuevo panel de TV OLED de LG Display aumenta el brillo

hace 1 año 3 Minutos mínimos para leer

iOS 18.2: crea emojis personalizados en mensajes con Genmoji

hace 1 año 4 Minutos mínimos para leer

Genmoji en iOS 18.2: crea emojis personalizados en mensajes

hace 2 años 4 Minutos mínimos para leer

Personalizar los colores y el tamaño de los iconos de las aplicaciones en iOS 18

hace 2 años 6 Minutos mínimos para leer

Sonido y visión: las aplicaciones y los auriculares personalizados son el futuro

hace 2 años 6 Minutos mínimos para leer

¿WordPress reemplazará a los desarrolladores web? (Perspectivas de expertos)

hace 2 años 14 Minutos mínimos para leer

Cómo crear un manual de formación online en WordPress (Guía fácil)

hace 2 años 13 Minutos mínimos para leer
Mostrar más
ThemeLocal: consejos de blog que funcionan como magiaThemeLocal: consejos de blog que funcionan como magia
Síganos
© 2022 Themelocal. Reservados todos los derechos.
Welcome Back!

Sign in to your account

¿Perdiste tu contraseña?