¿Problema con la barra de administración y el encabezado fijo?

Intenta agregar esto a tu archivo CSS:

body.admin-bar #branding-wrap{top: 28px;} 
body.admin-bar #wrapper{margin-top: 145px;}

La declaración body.admin-bar al principio asegurará que estos estilos solo se apliquen cuando la barra de administración esté visible.

Prueba esto para WordPress 4+. Verifica si la barra de administración está presente y, de ser así, mueve el encabezado fijo hacia abajo un poco para compensar.

    //fix para la barra de administración
    if ($('#wpadminbar')[0])
        $('.site-header').css('top', '32px')

Esto también funciona

body.logged-in > header {  
    margin-top: 32px;  
}  

Leí todas las respuestas pero no encontré esta:

¿Por qué no usar la función de WordPress:

is_admin_bar_showing()

ejemplo en el archivo header.php del tema

<nav class="nav-default" style="<?php echo is_admin_bar_showing() ? 'top: 32px' : ''; ?>">

Creo que, en dispositivos con anchos más pequeños, la barra de administración (wpadminbar) no tiene una posición fija. Entonces, si desplazas el documento en un smartphone, la barra de administración seguirá el desplazamiento y no permanecerá en la parte superior de la ventana. Teniendo esto en cuenta, ¿por qué no agregar un poco de JavaScript en el pie de página de tu tema justo después de la llamada a wp_head()? De esta manera, podemos detectar el ancho del dispositivo y si el documento tiene o no la barra de administración. Luego, simplemente creamos algunas reglas CSS y las añadimos al encabezado del documento, como se muestra a continuación:

<script>
( function(e) {
    var ab = document.getElementById( 'wpadminbar' );
    if ( typeof( ab ) === 'object' && window.innerWidth >= 610 ) {
        var abh = ab.offsetHeight || ab.clientHeight || ab.scrollHeight;
        var style = document.createElement( 'style' );
        style.id = 'adminbar_main_nav_controle_rules';
        document.getElementsByTagName( 'head' )[0].appendChild( style );
        var rules = document.createTextNode( 'body.admin-bar .main-navigation.fixed { margin-top: ' + abh + 'px !important; }' );
        style.appendChild( rules );
        console.debug( 'El espacio de la barra de administración está cubierto' );
    }
})();
</script>

Suponiendo que tu menú de navegación tenga una clase 'main-navigation' y al desplazarte le añadas otra clase llamada 'fixed'. Cambia el CSS para apuntar a tu panel de navegación reemplazando 'body.admin-bar .main-navigation.fixed' con lo que necesites para apuntar al tuyo.

Se puede mejorar aún más, por ejemplo, verificando si la barra de administración está fija o no, pero por ahora, espero que esto te ayude.

Acabo de usar este CSS.

body.admin-bar #main-header  {
padding-top: 32px }

Prueba esto, funciona correctamente

$(document).ready(function() {
    if ($('#wpadminbar')[0]) {
        $('header').css('top', '32px')
    }
});

dar la barra de navegación superior

.navbar-fixed-top {
    border-width: 0 0 1px;
    padding: 0;
    position: relative!
}