Você quer personalizar o CSS para páginas específicas? Adicionar o slug da página pai à classe do corpo é uma ótima maneira de direcionar uma página específica com CSS. Dessa forma, você pode identificar facilmente a classe do elemento que deseja alterar.
Instruções:
Tudo o que você precisa fazer é adicionar este código ao arquivo functions.php do seu tema ou a um plugin específico do site:
add_filter('body_class','body_class_section');
function body_class_section($classes) {
global $wpdb, $post;
if (is_page()) {
if ($post->post_parent) {
$parent = end(get_post_ancestors($current_page_id));
} else {
$parent = $post->ID;
}
$post_data = get_post($parent, ARRAY_A);
$classes[] = 'parent-' . $post_data['post_name'];
}
return $classes;
}
Observação: Se esta é a primeira vez que você adiciona trechos de código no WordPress, consulte nosso guia sobre como copiar / colar trechos de código corretamente no WordPress, para não quebrar acidentalmente seu site.
Se você gostou deste trecho de código, considere conferir nossos outros artigos no site, como: 62 melhores temas gratuitos de blog do WordPress ou 7 melhores plugins de formulário de contato do WordPress.
Funciona lindamente no WordPress 3.9.1, obrigado!
Isso pode ser adaptado para adicionar o ancestral superior à classe do corpo? Então, se eu navegar para uma página neta, eu vejo não o slug do pai, mas o slug do avô?
Quando eu uso isso, ainda recebo todas as classes padrão do BS adicionadas pelo WP. Existe uma maneira de filtrar essas?
Oi Jess, postarei um trecho na segunda-feira que fornecerá uma solução para isso.
Obrigado, exatamente o que eu estava procurando. Uma pergunta – isso poderia ser adaptado para que ele produza não apenas o slug da página pai nas classes do corpo, mas também o slug da página atual? Isso seria útil para segmentar seções em CSS, além de páginas específicas.
Vou escrever algo para poder postar em alguns dias.
Obrigado, estou ansioso por isso 🙂