Por defeito, o WordPress tem a opçãotopo do ecrãMostrando a barra de administração, esta barra ajuda-o a aceder rapidamente às funções de backend do WordPress. No entanto, alguns utilizadores podem achar a localização da barra de administração um pouco intrusiva e querer movê-la, especialmente para alterar o seu aspeto e localização.

Neste tutorial, oConstrutor de sítios Web autodidata WPIremos abordar a forma de mover a barra de administração do WordPress para o rodapé adicionando CSS personalizado ou como mover a barra de administração para o rodapé utilizandofunções.php para obter o mesmo efeito, assegurando que a apresentação da página para utilizadores não registados não é afetada.

Porquê mover a barra de administração do WordPress?

A barra de administração do WordPress fornece uma série de recursos de navegação, como acesso rápido ao painel de controle, edição de páginas, visualização de comentários, atualização de plug-ins e muito mais. Embora seja poderosa, é colocada no topo da página por defeito, o que pode ocultar conteúdo ou entrar em conflito com designs personalizados.

Mover a barra de administração para a parte inferior da página melhora a experiência visual, especialmente para os utilizadores que precisam de mais espaço no ecrã para apresentar o seu design de front-end. Além disso, melhora a estética geral da página, especialmente se o design na parte superior da página for complexo, e mover a barra de administração para a parte inferior da página evita distracções.

preliminar

Antes de mergulharmos no tutorial, eis o que precisa de preparar:

1. Um tema que suporta CSS personalizadas e recomenda a utilização de um editor de blocos (por exemploVinte e vinte e três(Assunto).
2. subtema(Recomenda-se que crie primeiro o tema filho para que as suas alterações não se percam quando atualizar o tema).
3. A sua versão do WordPress deve ter sido actualizada para a versão mais recente para garantir a compatibilidade.

Passo 1: Aceda a Personalização do tema

Em primeiro lugar, tem de se certificar de que o tema utilizado suporta a personalização. Existem várias formas de personalizar o WordPress, sendo que a forma mais fácil é através da opção "Aparência > Personalização" para configurar.

1. Inicie sessão no sítio Web do WordPress e aceda ao painel de controlo.
2. Navegar paraAparência > Personalizaçãoou clique simplesmente em "personalização"Botão.

3. Quando estiver na página de personalização do tema, procure "CSS adicional"Opções.

Porquê criar tópicos secundários?

Para garantir que futuras actualizações do tema não substituam as personalizações que fez, recomenda-se que crie eUtilizar temas secundários. Os temas filhos podem fazer alterações ao tema sem afetar os ficheiros principais do tema original.

Passo 2: Adicione CSS personalizadas

De seguida, passamos à secção "CSS adicionalA opção " adiciona um estilo personalizado à barra de administração do WordPress para a mover para a parte inferior da página.

Código CSS personalizado

entrar emCSS adicionalDepois da página, copie e cole o seguinte código:

corpo {
    margem superior: -28px;
    enchimento-fundo: 28px;
}
body.admin-bar #wphead {
    padding-top: 0;
}
body.admin-bar #footer {
    enchimento-fundo: 28px;
}
#wpadminbar {
    topo: automático !importante;
    fundo: 0;
}
#wpadminbar .menupop .ab-sub-wrapper {
    fundo: 32px;
}

Este snippet CSS move a barra de administração da parte superior para a parte inferior da página e ajusta o espaçamento entre a parte superior e a parte inferior da página para acomodar a nova posição da barra de administração.

Função do código de interpretação

• margin-top: -28px; padding-bottom: 28px;Reduza o espaçamento na parte superior da página, deixando espaço na parte inferior para que a barra de administração não se sobreponha ao conteúdo da página.
• #wpadminbar { top: auto !important; bottom: 0; }Forçar a barra de administração a ser fixada na parte inferior da página em vez da posição superior predefinida.
• .ab-sub-wrapper { bottom: 32px; }Verifique se o menu pendente da barra de administração é apresentado corretamente na parte inferior.

Passo 3: Pré-visualize e guarde as alterações

Quando tiver terminado de adicionar o CSS, clique em "Guardar alterações" e regresse à página inicial do sítio para ver o efeito.

Se tudo estiver bem, guarde as definições e publique as alterações. A sua barra de administração do WordPress deve ter sido movida da parte superior para a parte inferior da página.

Outras questões e considerações

1. problemas com a visualização de utilizadores não registados

Depois de seguir as alterações nas etapas acima, pode haver um problema com a exibição da página sendo elevada em 28px quando um usuário não conectado visita o site. Para resolver este problema, pode, opcionalmente, adicionar código condicional adicional ao ficheiro functions.php para que apenas os utilizadores com sessão iniciada vejam os ajustes da barra de administração e os utilizadores sem sessão iniciada não sejam afectados.

Passo 4: Adicione o código através de functions.php

Se quiser que o ajuste da barra de administração tenha efeito apenas para os utilizadores com sessão iniciada, pode fazê-lo adicionando código personalizado ao ficheiro functions.php do tema. Abaixo está o código adicionado:

função wpg_ubah_posisi_admin_bar() {
    se (is_user_logged_in()) {
        ?>
        <style>
            body {margin-top: -28px; padding-bottom: 28px;}
            body.admin-bar #wphead {padding-top: 0;}
            body.admin-bar #footer {padding-bottom: 28px;}
            #wpadminbar { top: auto !important; bottom: 0;}
            #wpadminbar .menupop .ab-sub-wrapper { bottom: 32px; }
        </style>
        <?php
    }
}

add_action('wp_head', 'wpg_ubah_posisi_admin_bar');

Como adicionar o código functions.php?

1. Inicie sessão no backend do WordPress e navegue atéAparência > Editor de ficheiros de temas.

2. Na lista de ficheiros à direita, localize e clique no ficheirofunctions.phpDocumentação.
3. Adicione o código acima ao final desse ficheiro e clique em "Documentos actualizados".

Este código garante que o reposicionamento da barra de administração só tem efeito para os utilizadores com sessão iniciada e que os utilizadores sem sessão iniciada não vêem qualquer efeito, evitando assim o problema da página ser levantada.

chegar a um veredito

Seguindo os passos acima, é fácil mover a barra de administração do WordPress da parte superior para a parte inferior da página, e não é necessário instalar plug-ins adicionais. Quer a personalize através de CSS ou adicione código condicional ao ficheiro functions.php, estes métodos proporcionarão uma forma mais personalizada de apresentar a barra de administração no seu site.