Personalizar la administración de wordpress.

 



 

Hay ocasiones en las que queremos  personalizar el área de administración de WordPress para hacerlo mejor a las necesidades según el cliente , o para incluir (o excluir) funcionalidades con vistas a su uso por un cliente o una tercera persona.

Vamos a ver una serie de funciones que nos permitirán precisamente eso: adaptar un poco el gestor de WordPress.

Cambiar logo barra de administracion solo con css,agrega esto a tu css del tema,cambia el icono wordpress por el de carro de compras .Ver iconos wordpress

/*Cambia logo administracion
---------------------------------------------------------------------------------------------------- */
#wpadminbar #wp-admin-bar-wp-logo > .ab-item .ab-icon:before {
	content: '\f174';
	top: 2px;
}

 

Eliminamos eL logo de wordpress y las actualizaciones, pero si quieren eliminar otra cosa aqui les dejo una lista de todo lo que pueden eliminar.

search:para eliminar la caja de búsqueda.
comments:Para eliminar el aviso de comentarios
updates:Eliminar el aviso de actualizaciones
edit:Elimina editar entrada y páginas
get-shortlink:Proporciona un enlace corto a esa página/post
my-sites:Elimina el menu my sitios, si utilizas la función multisitios de wordpress
site-name:Elimina el nombre de la web
wp-logo:Elimina el logo(y el sub Menú)
my-account:Elimina los enlaces a su cuenta. El ID depende de si usted tiene Avatar habilitado o no.
view-site:Elimina el sub menú que aparece al pasar el cursor sobre el nombre de la web
about:Elimina el enlace “Sobre WordPress
wporg:Elimina el enlace a wordpress.org
documentation:Elimina el enlace a la documentación oficial (Codex)
support-forums:Elimina el enlace a los foros de ayuda
feedback:Elimina el enlace “Sugerencias”

function remove_admin_bar_links() {
    global $wp_admin_bar;
    // Elimina el logo de WordPress (desaparece también todo el submenú)
    $wp_admin_bar->remove_menu('wp-logo');
    // Elimina el icono de notificación de actualizaciones
    $wp_admin_bar->remove_menu('updates');
}
add_action( 'wp_before_admin_bar_render', 'remove_admin_bar_links' );

Agregar enlace en barra de herramientas

function add_custom_link_admin_bar() {
   global $wp_admin_bar;
   if ( !is_super_admin() || !is_admin_bar_showing() )
      return;
   $wp_admin_bar->add_menu( array(
   'id' => 'CustomLink',//ID del link
   'title' => __( 'Mis enlaces'),//Nombre a mostrar en el enlace
   'href' => __('http://www.webgae.com/'),//Enlace del link
   ) );
}
add_action('admin_bar_menu', 'add_sumtips_admin_bar_link',25);

 Agregar submenus a los enlaces

// Add sub menu link "Descargas"
   $wp_admin_bar->add_menu( array(
      'parent' => 'CustomLink',//Nombre del link padre
      'id'     => 'downloadLink',//ID del link
      'title' => __( 'Descargas'),//Nombre a mostrar en el enlace
      'href' => __('vinculo aqui'),//Vínculo del link
   ));

   // Add sub menu link "Estadísticas"
   $wp_admin_bar->add_menu( array(
      'parent' => 'CustomLink',//Nombre del link padre
      'id'     => 'Estat',
      'title' => __( 'Estadísticas'),
      'href' => __('vinculo aqui'),
   ));

   // Add sub menu link "Comentarios"
   $wp_admin_bar->add_menu( array(
      'parent' => 'CustomLink',//Nombre del link padre
      'id'     => 'Comment',
      'title' => __( 'Comentarios'),
      'href' => __('vinculo aqui'),
   ));

 

Agregar al menu lateral.

// Cambiar el nombre de Mensajes en el Menú
function wptutsplus_change_post_menu_label() {
    global $menu;
    global $submenu;
    $menu[5][0] = 'Noticias';
    $submenu['edit.php'][5][0] = 'Todas las noticias';
    $submenu['edit.php'][10][0] = 'Agregar noticia';
}
add_action( 'admin_menu', 'wptutsplus_change_post_menu_label' );

Quitar del menu lateral por ejemplo quitamos los comentarios.

// Eliminar los comentarios del menú para todos, pero no a los administradores.
function wptutsplus_remove_comments_menu_item() {
    $user = wp_get_current_user();
    if ( ! $user->has_cap( 'manage_options' ) ) {
        remove_menu_page( 'edit-comments.php' );
    }
}
add_action( 'admin_menu', 'wptutsplus_remove_comments_menu_item' );

Cabiamos el footer de admin de wordpress que tiene sus enlaces-

//cambiamos el texto en el footer
function webgae_admin_footer_text () {
    echo '<img src="' . plugins_url( 'images/la que tu quieras.png' , __FILE__ ) . '">Este tutorialha sido creado por <a href="http://www.webgae.com">Webgae</a>.';
}
add_filter( 'admin_footer_text', 'webgae_admin_footer_text' );

Cambiar estilos css con un plugin personal.

Creamos datos del plugin

/*
Plugin Name:cambiamps estilos del admin
Plugin URI: http://www.webgae.com
Description: esto carga un css personal para el admin
Version: 1.0
Author: ximo
Author URI: http://www.webgae.com
License: GPLv2
*/

Cargamos el css

//cargamos estilos de la forma correcta
function webgae_admin_styles() {
    wp_register_style( 'webgae_admin_stylesheet', plugins_url( '/css/style.css', __FILE__ ) );
    wp_enqueue_style( 'webgae_admin_stylesheet' );
}
add_action( 'admin_enqueue_scripts', 'webgae_admin_styles' );

Creamos una carpeta css y ponemos hoja de estilos.

/* stylos para el footer */
#wpfooter #footer-left img {
    height: 1.2em;
    width: auto;
    margin-right: 0.5em;
}

/* stylos para el admin menu */
 
/* background and text color */
#adminmenuback, #adminmenuwrap {
    background-color: #58595b;
    border-color: #fff;
}
#adminmenu li.menu-top:hover, #adminmenu li.opensub > a.menu-top, #adminmenu li > a.menu-top:focus {
    background-color: #58595b;
    color: #d54e21;
    text-shadow: 0 1px 0 rgba(255,255,255,0.4);
}
#adminmenu li.wp-menu-separator {
    background: #fff;
    border-color: #fff;
}
 
/* links in admin menu */
#adminmenu a,
#adminmenu li.menu-top:hover,
#adminmenu li.opensub > a.menu-top,
#adminmenu li > a.menu-top:focus {
    color: #fff;
}
#adminmenu a:hover,
#adminmenu a:active {
    color: #fff;
    text-decoration: underline;
}
#adminmenu .wp-submenu a {
    color: #58595b;
}
 
/* change color of arrow to submenus */
#adminmenu li.wp-not-current-submenu .wp-menu-arrow,
#adminmenu li.wp-not-current-submenu .wp-menu-arrow div {
    background: #58595b;
}
 
/* active screen as seen in menu - change the background and arrow colour */
#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,
#adminmenu li.current a.menu-top,
.folded #adminmenu li.wp-has-current-submenu,
.folded #adminmenu li.current.menu-top,
#adminmenu .wp-menu-arrow,
#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head {
    background: #9e4059;
}
#adminmenu li.wp-has-current-submenu .wp-menu-arrow,
#adminmenu li.wp-has-current-submenu .wp-menu-arrow div {
    background: #9e4059;
}
/* Enlaces */
a:hover, a:active {
    color: #9e4059;
}
/* botones */
.wp-core-ui .button-primary {
    background: #4b8938;
    background-image: -webkit-gradient(linear,left top,left bottom,from(#7ea367),to(#4b8938));
    background-image: -webkit-linear-gradient(top,#7ea367,#4b8938);
    background-image: -moz-linear-gradient(top,#7ea367,#4b8938);
    background-image: -ms-linear-gradient(top,#7ea367,#4b8938);
    background-image: -o-linear-gradient(top,#7ea367,#4b8938);
    background-image: linear-gradient(to bottom,#7ea367,#4b8938);
    border-color: #4b8938;
    color: rgba(255,255,255,0.95);
    -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
    box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
    text-shadow: 0 1px 0 rgba(0,0,0,0.1);
}
.wp-core-ui .button-primary.active,
.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:active {
    background: #9e4059;
    background-image: -webkit-gradient(linear,left top,left bottom,from(#ba7582),to(#9e4059));
    background-image: -webkit-linear-gradient(top,#ba7582,#9e4059);
    background-image: -moz-linear-gradient(top,#ba7582,#9e4059);
    background-image: -ms-linear-gradient(top,#ba7582,#9e4059);
    background-image: -o-linear-gradient(top,#ba7582,#9e4059);
    background-image: linear-gradient(to bottom,#ba7582,#9e4059);
    border-color: #9e4059;
    color: rgba(255,255,255,0.95);
    -webkit-box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
    box-shadow: inset 0 1px 0 rgba(0,0,0,0.1);
    text-shadow: 0 1px 0 rgba(0,0,0,0.1);
}

Ahora personalizamos las cajas del escritorio.
Así que me voy a quitar lo siguiente:Comentarios recientes,Enlaces entrantes,QuickPress,Blog de WordPress,Otros WordPress Noticias

// eliminar widgets del escritorio no deseados para los usuarios 
function webgae_remove_dashboard_widgets() {
    $user = wp_get_current_user();
    if ( ! $user->has_cap( 'manage_options' ) ) {
        remove_meta_box( 'dashboard_recent_comments', 'dashboard', 'normal' );
        remove_meta_box( 'dashboard_incoming_links', 'dashboard', 'normal' );
        remove_meta_box( 'dashboard_quick_press', 'dashboard', 'side' );
        remove_meta_box( 'dashboard_primary', 'dashboard', 'side' );
        remove_meta_box( 'dashboard_secondary', 'dashboard', 'side' );
    }
}
add_action( 'wp_dashboard_setup', 'webgae_remove_dashboard_widgets' );

Agregamos pantallas personales

// Crear nueva caja a la derecha del escritorio
function webgae_move_dashboard_widget() {
    $user = wp_get_current_user();
    if ( ! $user->has_cap( 'manage_options' ) ) {
        global $wp_meta_boxes;
        $widget = $wp_meta_boxes['dashboard']['normal']['core']['dashboard_right_now'];
        unset( $wp_meta_boxes['dashboard']['normal']['core']['dashboard_right_now'] );
        $wp_meta_boxes['dashboard']['side']['core']['dashboard_right_now'] = $widget;
    }
}
add_action( 'wp_dashboard_setup', 'webgae_move_dashboard_widget' );

Rellenamos una caja con el contenido deseado.

// nueva caja en el escritorio
function webgae_add_dashboard_widgets() {
    wp_add_dashboard_widget( 'webgae_dashboard_welcome', 'Bienvenido', 'webgae_add_welcome_widget' );
    wp_add_dashboard_widget( 'webgae_dashboard_links', 'Enlaces útiles', 'webgae_add_links_widget' );
}
function webgae_add_welcome_widget(){ ?>
 
    Este sistema de gestión de contenidos le permite editar las páginas y mensajes en su sitio web. 
 
     Su sitio se compone de los siguientes contenidos, que se puede acceder a través del menú de la izquierda:
 
    <ul>
        <li><strong>Paginass</strong> - páginas estáticas que se pueden editar.</li>
        <li><strong>Posts</strong> - noticias o artículos - usted puede editar estos y añadir más.</li>
        <li><strong>Media</strong> - imágenes y documentos que se pueden cargar a través del menú de medios de la izquierda o dentro de cada post o página.</li>
    </ul>
 
   En cada pantalla de edición hay instrucciones que le ayudarán a añadir y editar contenido.
 
<?php }
 
function webgae_add_links_widget() { ?>
 
  Algunos enlaces y recursos que le ayudarán a gestionar su sitio:
 
    <ul>
        <li><a href="http://wordpress.org"> WordPress Codex</a></li>
        <li><a href="http://easywpguide.com">buen sitio</a></li>
        <li><a href="http://www.wpbeginner.com">otro buen sitior</a></li>
         <li><a href="http://www.webgae.com"webgae</a></li>
    </ul>
<?php }
add_action( 'wp_dashboard_setup', 'webgae_add_dashboard_widgets' );

Ir viendo y cambiando al gusto,con todo esto usted personalizara el panel de administracion.

Personaliza el loguin de wordpress sin plugin

¿Que pasos debes de seguir para conseguir esto?

Tenemos el login por defecto, lo que haremos es poner una imagen distintiva, y un poco de CSS,empieza creando tu logo personal y ponlo dentro de tu tema una carpeta llamada login y crea una hoja de estilo css llamada login-styles.css puedes pegarle este código. Lo pones también dentro de la carpeta loguin dentro de tu tema

@charset "utf-8";
/* CSS Document */
body.login {
background: #021a2b;
}
.login h1 a {
background-image: url('../login/logo.png');
background-size: 300px 72px;
width: 300px;
height: 72px;
}
#login {
padding: 30px 0 0;
}
.login form {
margin-left:auto;
margin-right:auto;
padding:30px;
border: 1px solid rgba(0,0,0,.2);
background-clip: padding-box;
background: rgba(255, 255, 255, 0.9);
box-shadow: 0 0 13px 3px rgba(0,0,0,.5);
overflow: hidden;
}
.login label {
color: #333;
line-height: 26px;
}
.login .button-primary {
width: 120px;
float:right;
background-color:#083353 !important;
background: -webkit-gradient(linear, left top, left bottom, from(#0b436e), to(#083353));
background: -webkit-linear-gradient(top, #0b436e, #083353);
background: -moz-linear-gradient(top, #0b436e, #083353);
background: -ms-linear-gradient(top, #0b436e, #083353);
background: -o-linear-gradient(top, #0b436e, #083353);
background-image: -ms-linear-gradient(top, #0b436e 0%, #083353 100%);
text-shadow: #333333 0 1px 0;
color: #849db0;
}
.login .button-primary:hover {
background-color:#083353 !important;
background: -webkit-gradient(linear, left top, left bottom, from(#0b436e), to(#083353));
background: -webkit-linear-gradient(top, #0b436e, #083353);
background: -moz-linear-gradient(top, #0b436e, #083353);
background: -ms-linear-gradient(top, #0b436e, #083353);
background: -o-linear-gradient(top, #0b436e, #083353);
background-image: -ms-linear-gradient(top, #0b436e 0%, #083353 100%);
text-shadow: #333333 0 -1px 0;
color: #fff;
}

.login .button-primary:active {
background-color:#083353 !important;
background: -webkit-gradient(linear, left top, left bottom, from(#0b436e), to(#083353));
background: -webkit-linear-gradient(top, #0b436e, #083353);
background: -moz-linear-gradient(top, #0b436e, #083353);
background: -ms-linear-gradient(top, #0b436e, #083353);
background: -o-linear-gradient(top, #0b436e, #083353);
background-image: -ms-linear-gradient(top, #0b436e 0%, #083353 100%);
text-shadow: #333333 0 -1px 0;
color: #fff;
}

Luego añade este código en tu archivo de funciones del tema functions.php

Recuerda de quitar la etiqueta

<?php

Si vas a copiar y pegar todo

<?php

//*Cargar este archivo CSS  en su tema functions.php 


function login_custom_stylesheet() { ?>
 <link rel="stylesheet" id="custom_wp_admin_css" href="<?php echo get_bloginfo( 'stylesheet_directory' ) . '/login/login-styles.css'; ?>" type="text/css" media="all" />
<?php }
add_action( 'login_head', 'login_custom_stylesheet' );

//*Cambie la URL Por defecto, el logotipo enlazará a wordpress.org 

function my_login_logo_url() {
return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'my_login_logo_url' );

function my_login_logo_url_title() {
return 'Su Nombre del sitio y la informacion';
}
add_filter( 'login_headertitle', 'my_login_logo_url_title' );

//*Para mover el enlace de contraseña olvidada

function remove_lostpassword_text ( $text ) {
if ($text == 'Lost your password?'){$text = '';}
return $text;
}
add_filter( 'gettext', 'remove_lostpassword_text' );
//*Podemos  eliminar el mensaje de error 
add_filter('login_errors',create_function('$a', "return null;"));

//*Para quitar el batido, 

function my_login_head() {
remove_action('login_head', 'wp_shake_js', 12);
}
add_action('login_head', 'my_login_head');

//*los usuarios que no sean de administración se redirigen:


function admin_login_redirect( $redirect_to, $request, $user )
{
global $user;
if( isset( $user->roles ) && is_array( $user->roles ) ) {
if( in_array( "administrator", $user->roles ) ) {
return $redirect_to;
} else {
return home_url();
}
}
else
{
return $redirect_to;
}
}
add_filter("login_redirect", "admin_login_redirect", 10, 3);


//*Para salir del cuadro siempre marcado


function login_checked_remember_me() {
add_filter( 'login_footer', 'rememberme_checked' );
}
add_action( 'init', 'login_checked_remember_me' );

function rememberme_checked() {
echo "<script>document.getElementById('rememberme').checked = true;</script>";
}

Si algo no te gusta lo quitas, lee las anotaciones.Espero funcione todo bien si no comentar.