Um usuário perguntou ?
DEvelopers WPMU, um chara ?
Estou usando meu próprio de vinte e sete anos, disponível no github:
Estou usando barras laterais personalizadas e me pergunto por que as barras laterais são exibidas em lados diferentes, dependendo do tipo de material.
Exemplos de postagens de blog com barra lateral direita como esperado:
A página de amostra mostra a barra lateral à esquerda, mas também deve estar localizada à direita:
Alguma idéia sobre a causa do comportamento diferente?
Muitas felicidades e um próspero ano novo! Björn
(@wpmudev-support9)
1 ano, 1 mês atrás
Olá @airbjorn,
Confie que você está fazendo certo!
O seguinte código CSS foi adicionado ao seu tema
@media screen and (min-width: 48em) {
/*other CSS*/
.has-sidebar:not(.error404) #primary {
float: left;
width: 58%;
}
}Encontre este CSS e altere-o float: left; para flutuar para a direita;
@media screen and (min-width: 48em) {
/*other CSS*/
.has-sidebar:not(.error404) #primary {
float: right;
width: 58%;
}
}Se você não conseguir encontrar este CSS, adicione o seguinte arquivo ao style.css do seu tema filho, ou ao arquivo Aparência > Personalizar > CSS Adicional Gort:
@media screen and (min-width: 48em) {
.has-sidebar:not(.error404) #primary {
float: right;
}
}Eu espero que isso ajude!
Atenciosamente, Nastya
(@airbjorn)
1 ano, 1 mês atrás
Oi Nastia, obrigado pela sua resposta rápida! No entanto, essa alteração mostra a barra lateral das postagens do blog no lado _esquerdo_.
Então, na verdade, o switch moveu o conteúdo para a direita, não a barra lateral em si. Ao mesmo tempo, a página de amostra aparece logo antes.
Mas eu encontrei uma solução que parece tão boa quanto eu queria. Adicionei o seguinte SEC ao meu tópico filho:
/* Sidebar on pages should appear on the right hand side (default: left) */
@media screen and (min-width: 48em) {
body:not(.has-sidebar):not(.page-one-column) .page-header,
body.has-sidebar.error404 #primary .page-header,
body.page-two-column:not(.archive) #primary .entry-header,
body.page-two-column.archive:not(.has-sidebar) #primary .page-header {
float: right;
}
/* wide actual content to 64% (default: 58) */
blog:not(.has-sidebar) #primary article,
.archive:not(.page-one-column):not(.has-sidebar) #primary article,
.search:not(.has-sidebar) #primary article,
.error404:not(.has-sidebar) #primary .page-content,
.error404.has-sidebar #primary .page-content,
body.page-two-column:not(.archive) #primary .entry-content,
body.page-two-column #comments {
width: 64%;
}
}
Veja agora (embora eu esteja um pouco confuso, não há espaço entre o conteúdo e a barra lateral).
(@airbjorn)
1 ano, 1 mês atrás
Mas eu tentei com Safari @macos. Agora eu vejo, o Firefox @windows renderiza a página de uma maneira diferente, a barra lateral continua sendo exibida à esquerda.
Então, para ter certeza do lado correto, adicionei
float: left;
para o código de conteúdo mais baixo.
Há mais alguma coisa que eu preciso cuidar ao alterar o código CSS?
(@fovoc)
Há 1 ano
Olá @airbjorn
Esta parece ser uma abordagem justa! ?
embora eu esteja um pouco confuso, não há espaço entre o conteúdo e a barra lateral
Com 64% de conteúdo e 33% de barras laterais, há uma diferença de 3% entre eles (para 100%). Você precisa abaixar qualquer um deles ainda mais para criar mais espaço entre eles.
Le Meas você, Dimitris
(@airbjorn)
Há 1 ano
Muito obrigado Dimitris – 64% vs 33% já é a minha solução. Fico feliz que você tenha confirmado que minhas alterações estão no lugar certo. Porque ao mesmo tempo tenho um pouco de medo de modificar as coisas no lugar errado, o que quebra o design em outras configurações que eu possa ter depois.
Le Meas te – Björn
Isto foi útil?
0 / 0