Soporte » Plugins y Hacks » Menú toolbar crear menú para movil

  • Resuelto José Illán

    (@joseillankm)


    Buenas tardes.

    Hoy he creado un enlace en el menú de administración de wordpress pero veo que este menú que he añadido no es sensible a dispositivos móviles.

    ¿Cómo hago para que ese enlace se vea tanto en móvil como en ordenador?.

    El código que uso es este:

     // Añadimos los enlaces personalizados al la barra
      function link_simple_toolbar($wp_admin_bar) {
    	  $link = array(
    		  'id' => 'documentos', // Identificador único
    		  'title' => 'Documentos', // Título del enlace
    		  'href' => '#', // URL de destino (si no queremos que apunte a ningún sitio, podemos dejarlo tal cual)
    		  'meta' => array('class' => 'mi-clase') // Clase del elemento
    		  );
    	  $sublink1 = array(
    		  'id'    => 'subdocumento1', // Identificador único
    		  'parent' => 'documentos', // Identificador del elemento superior
    		  'title' => 'Sub documento', // Título del enlace
    		  'href'  => '/subdocumento/', // URL de destino
    		  'meta'  => array(
    			  'title' => __('subdocumento'), // Atributo "title" del enlace 
    			  'target' => '_self', // Destino ("_blank" abrirá el enlace en una página o pestaña nueva)
    			  'class' => 'mi_link_item_class' // Clase del elemento
    			  )
    		  );
    	  $sublink2 = array(
    		  'id'    => 'subdocumento2', 
    		  'parent' => 'documentos', // Identificador del elemento superior
    		  'title' => 'Sub documento 2', 
    		  'href'  => '/subdocuemtno2/', 
    		  'meta'  => array(
    			  'title' => __('sudocumento'), 
    			  'target' => '_self', 
    			  'class' => 'mi_link_item_class'
    			  )
    		  );
    	  $wp_admin_bar->add_node($link);
    	  $wp_admin_bar->add_node($sublink1);
    	  $wp_admin_bar->add_node($sublink2);
      }
    	add_action('admin_bar_menu', 'link_simple_toolbar', 50);
Viendo 3 respuestas - de la 1 a la 3 (de un total de 3)
  • Hola @joseillankm,

    Por defecto, los items de la «admin_bar» están ocultos. En /wp-admin/load-styles.php tienes esto:

    #wp-toolbar>ul>li,#wpadminbar #wp-admin-bar-user-actions.ab-submenu img.avatar {
            display: none;
        }

    Puedes hacer tu item y sus hijos visibles con esto (modificando las):

    add_action( 'admin_head', 'my_custom_admin_css' );
    function my_custom_admin_css() {
    	?>
    	<style>
            @media only screen and (max-width: 782px) {
                li#wp-admin-bar-documentos > a.ab-item:before {
                    content: '\f497';
    		display: block;
    		text-indent: 0;
    		font: 400 32px/1 dashicons;
    		speak: none;
    		top: 7px;
    		width: 52px;
    		text-align: center;
    		-webkit-font-smoothing: antialiased;
    		-moz-osx-font-smoothing: grayscale;
                }
    
    	    li#wp-admin-bar-documentos > a.ab-item {
    		text-overflow: clip !important;
    		white-space: nowrap;
    		overflow: hidden;
    	    }
    
    	    li#wp-admin-bar-documentos {
    		display: block !important;
    		width: 52px;
    	    }
    	}
    	</style>
    	<?php
    }

    Un saludo

    • Esta respuesta fue modificada hace 5 años, 5 meses por Jose Lazo.
    Iniciador del debate José Illán

    (@joseillankm)

    Funcionó perfectamente. Muchas gracias compañero.

    • Esta respuesta fue modificada hace 5 años, 5 meses por José Illán.
    Iniciador del debate José Illán

    (@joseillankm)

    Bueno, tengo ahora otro inconveniente. En la barra de admin estando en la sección de admin aparece. ¿Qué estilos tengo que modificar para que también aparezca en la barra de admin que hay fuera del admin?

Viendo 3 respuestas - de la 1 a la 3 (de un total de 3)
  • El debate ‘Menú toolbar crear menú para movil’ está cerrado a nuevas respuestas.