quinta-feira, 16 de fevereiro de 2012

wp-admin-bar personalizada (custom wp-admin-bar)

Bom hoje vou mostrar como personalizei minha wp-admin-bar, fiz algumas alterações para alcançar minha necessidade:
  • adicionar novos links
  • manter a barra sempre visível
  • restringir acessos a alguns links ja que a barra esta sempre visível
  • trocar a logo do Wp da barra por uma de minha escolha
  • alterar CSS
basicamente foi isso oque fiz até agora,
então o codigo ficou  da seguinte forma
Primeiro removo os links padroes da wp admin bar

// Remove o link antigo da Admin Bar WP 3.3
function fb_remove_oldlogo_adminbar() {
global $wp_admin_bar;
  $wp_admin_bar->remove_menu('wp-logo');
  $wp_admin_bar->remove_menu('new-content');
  $wp_admin_bar->remove_menu('comments');
  $wp_admin_bar->remove_menu('updates');
  $wp_admin_bar->remove_menu('site-name');
  $wp_admin_bar->remove_menu('edit');
}

Aqui eu coloco os links personalizados


function menuTopo() {
global $wp_admin_bar;
$wp_admin_bar->add_menu( array(
'id' => 'Home-link',
'title' => ' Titulo do link',
'href' => $blog_link
) );
$wp_admin_bar->add_menu( array(
'parent'=> 'Home-link',
'id' => 'admin-link',
'title' => 'Administração',
'href' => ' http://seusite.com.br/wp-admin',
'meta' => array( 'class'=>'novo-link', 'title'=>'Ir administração' )
) );
//o atributo parent é para colocar o menu como subitem na lista criando um menu dropDown
//esse atributo tem que ser viculado ao id do menu pai

$wp_admin_bar->add_menu( array(
'id' => 'Loja-link',
'title' => 'Loja',
'href' => 'http:// seusite.com.br/loja',
'meta' => array( 'class'=>'novo-link', 'title'=>'Ema Store' )
) );
$wp_admin_bar->add_menu( array(
'id' => 'Forum-link',
'title' => 'Forum',
'href' => 'http://seusite.com.br/foruns/',
'meta' => array( 'class'=>'novo-link', 'title'=>'Forum' )
) );
}
}


Agora para colocar a minha logo no lugar da logo do Wordpress na wp-admin-bar 
crio um classe css, no caso utilizei a logo em png com fundo transparente



#wp-admin-bar-Home-link{
background: url("http://seusite.com.br/images/imagem.png") no-repeat scroll 5px -1px transparent !important;
    padding: 0 0 0 21px !important;
    width: 50px !important;
}




Nenhum comentário:

Postar um comentário