Share
Tan refrescante como es el nuevo panel de WordPress, no todos están contentos con algunos de los cambios. Personalmente me encanta el nuevo estilo minimalista..
Solo faltaba una cosa: la navegación de la izquierda carecía de la separación visual de las diferentes áreas de WordPress.
En este rápido consejo, le mostraré cómo inspeccionar el CSS de back-end y devolver los separadores con solo unas pocas líneas de código.
Los separadores que vamos a intentar restaurar no han desaparecido, son transparentes. Haga clic derecho en el área en blanco entre Comentarios y Apariencia e inspeccionar este elemento.
Deberías ver el HTML renderizado. Los menus son ul-elementos con li-Elementos para cada elemento del menú..
Abierto ul role = "navegación". Ver todos los elementos del menú en li-Elementos envueltos, pero también verá una li entre. Cuando haga clic en él, podrá ver los estilos y debería notar el CSS de este elemento..
#adminmenu li.wp-menu-separator background: transparent; color del borde: transparente;
Ese es nuestro estilo separador. Específicamente, es el que necesitamos modificar..
Ahora vamos a escribir una función, para conectar nuestros propios estilos CSS al Backend de WordPress.
Agrega este código a tus temas funciones.php expediente.
Accentsconagua
function tutsplus_separators () add_action ('admin_head', 'tutsplus_separators'); La primera parte define la función y el enlace add_action la agregará al encabezado del panel de WordPress. En el medio, ahora agregaremos un eco para publicar nuestro propio código CSS.
función tutsplus_separators () echo ''; add_action ('admin_head', 'tutsplus_separators'); Si recargas tus páginas, tus separadores estarán en el color. # 444 - gris. Cambié el margen del separador también porque necesitaba una cierta alineación en mi opinión.
Si eres un perfeccionista, notarás que este color solo se adapta al estilo de administrador predeterminado en negro y azul de WordPress. Echemos otro vistazo a cómo podemos cubrir todas las nuevas combinaciones de colores..
los cuerpo-La etiqueta de WordPress tiene muchas clases prácticas para identificar diferentes usos. Si observa detenidamente, también verá una clase para la combinación de colores. El predeterminado se llama admin-color-fresh.
Intente cambiar su estilo en "Usuarios"> "Su perfil" y vea cómo está cambiando la clase. Con esta clase disponible, podemos darle a cada estilo de color su propio color separador. Solo agrega el nombre de la clase delante de tu código css como este .admin-color-fresh #adminmenu li.wp-menu-separator background: # 444;
Aquí está el código ahora con todos los estilos de color para emparejar separadores:
función tutsplus_separators () echo ''; add_action ('admin_head', 'tutsplus_separators'); Si quieres líneas separadoras entre cada elemento de menú intente ajustar la clase superior de menú de lali-artículos un poco con borde inferior y borde superior.
Hice este pequeño fragmento de código en un complemento para simplemente agregarlo rápidamente a algunas de mis instalaciones. Si lo desea, puede obtenerlo del Directorio de Complementos de WordPress.
