Criador do tópico
pdpi
(@pdpi)
Bom, fui no Menu Aparencia/Personalizar/Css Adicional e inclui isto:
#site-title a {
color: #ff4b33;
background-color: white;
font-size: 1.2em;
font-weight: bold;
text-decoration: none;
}
#content .entry-title {
background-color: white;
color: #ff4b33;
font-size: 21px;
font-weight: bold;
line-height: 1.3em;
margin-bottom: 0;
}
#content .entry-meta {
color:#1b7a2b;
font-size:13px;
text-align:left;
}
Consegui 🙂
Porem no Navegador Microsoft EDGE ao lado do Titulo do site na Home inicial fica uma barra azul … 🙁
No navegado Safari ficou perfeito.
Alguma dica ?
Obrigado
Paulo
-
Esta resposta foi modificada 8 anos atrás por
pdpi.
olá @pdpi,
é por ai. apenas uma dica é que se essas configurações já estão no CSS do tema, não precisa repetir no CSS adicional. se torna redundante e é mais código para o navegador ler. e quanto a isso, menos é mais, ou seja, menos código é mais velocidade de carregamento.
hoje em dia os navegadores de internet levam em conta os desenvolvedores de site. com isso, todo navegador tem um Inspecionar Elemento. até o Edge! (que realmente não é o Internet Explorer, aff)
então para saber que código está gerando essa barra azul no Edge, vá nas Configurações (os … no canto superior direito) e clique em “Ferramentas de Desenvolvedor”. ai vai abrir uma janela que você verá o HTML e CSS. no canto superior esquerdo dessa janela tem uma seta estilo de mouse sobre um retângulo, que se você colocar o mouse em cima dirá “Selecionar elemento”. clique sobre essa opção e clique agora sobre a barra azul. então a linha onde está o código dessa barra será destacado na janela do Inspecionar Elemento.
com essa informações pode ir no CSS Adicional e no Seletor dessa barra colocar um “display: none” e barra sumirá. só precisa conferir o resultado disso nos outros navegadores, mas é por aí. 🙂
abraços e boa sorte,
Criador do tópico
pdpi
(@pdpi)
Ola,
Ok entendi sobre o código duplicado. Boa aula. Valeu.
Estou tentando entender para que serve cada arquivo do CSS ainda.
Sobre isto: “display: none”
Eu havia feito isso mas acontece que o nome do site que esta ao lado da barra desaparece também.
Nao consegui 🙁
Obrigado por alguma dica mais.
-
Esta resposta foi modificada 8 anos atrás por pdpi.
olá @pdpi,
a grande vantagem de usar o “Inspecionar Elemento” do navegador é que ele permite que você edite e veja o resultado, mas apenas naquela simulação. então quando você usa o “display:none”, precisa ter certeza que só sumiu exatamente aquilo que você queria.
se no seu caso o nome do site sumiu, significa que o Seletor que usou para colocar “display:none” estava errado, tinha mais elementos além daquele que queria fazer sumir. então precisa procurar o Seletor certo. e ir fazendo os testes no “Inspecionar Elemento”.
apenas quando o resultado é exatamente o que se deseja, aí sim se leva o código para o WordPress, em Aparência > Personalizar > CSS Adicional.
e se estudar CSS com o tempo aprenderá a lógica e ficará bem fácil. pois o CSS nasceu e se popularizou justamente por isso, facilitar a personalização do layout de sites.
abraços e boa sorte,
Criador do tópico
pdpi
(@pdpi)
Ralden,
Mais uma vez muito obrigado pela aula.
Vou atrás e tentar entender.
Valeu os caminhos ..
Abraço
Paulo
Criador do tópico
pdpi
(@pdpi)
Ralden,
Achei a solução.
Estava aqui o problema:
h1 {
color: #ff0;
background-color: blue;
}
Isto faz parte do Plugin TablePress. No CSS dele.
tablepress-combined.min.css (1,165)
Desativei o Plugin e sumiu a barra azul.
Claro, agora arrumei outro problema.
Se quiser usar o Tablepress a barra azul volta. 🙁
Abraço
-
Esta resposta foi modificada 8 anos atrás por pdpi.
