Ocultar Marcador e Personalizar o Menu dos Marcadores do Blog
Vamos falar sobre como melhorar o menu dos marcadores do blog, por exemplo: como ocultar o marcador do menu quando está visitando a pagina daquele marcador, como fazer aparecer um texto sobre os itens do menu marcadores do blog (tag title), veja como usar Descrição em Imagens e Textos - Tag Alt e Title em outras partes do blog. Ou ainda como colocar imagens ao lado dos itens do menu marcadores.
Para ocultar o marcador do menu quando visita a pagina do próprio marcador, ou seja, quando você está na pagina de um marcador ele não aparece no menu marcadores do seu blog. Entre na pagina editar html, marque para expandir o modelo de widgets, procure e apague esse trecho:
Agora só clicar para salvar e pronto quando estiver na pagina de um marcador ele não aparecerá mais no menu se quiser faça o teste clicando em qualquer item do nosso menu.
Fazer aparecer um texto quando passa o mouse por cima do menu marcador também é fácil de fazer. Volte a pagina editar html quase no mesmo trecho que estava e procure o trecho:
Apague e coloque esse no lugar
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' expr:title='"Dicas sobre:" + data:label.name'><data:label.name/></a>:
O texto Dicas sobre: (os dois pontos também) você pode alterar como quiser, mas cuidado com o restante do código, pois se apagar qualquer coisa dá erro na hora de salvar.
Colocar uma imagem ao lado dos links do menu marcadores é como personalizar qualquer outro menu. Na pagina editar HTML procure por ]]></b:skin> e coloque esse código antes dele:
#Label1 a{font-size:130%;display: block;background-image: url(endereço da imagem);text-indent: 12px;background-repeat: no-repeat;background-position: left center;padding:2px}
#Label1 a:hover{background-image: url(endereço da imagem);text-indent: 12px;background-repeat: no-repeat;background-position: left center;padding:2px}
Apenas cuidado para usar o endereço certo da imagem e o restante do código é formatação CSS normal. Apenas deve modificar o text-indent: 12px isso é o recuo de texto para que o nome do marcador não fique sobre a imagem de fundo, veja mais detalhes sobre como Fazer Menu com Imagens ao lado dos Links.
Mais dicas úteis sobre os Marcadores do blogger:
Ocultar mensagem mostrando postagens com o marcador
Marcadores em forma de menu suspenso
Esperamos que gostem dessas dicas sobre os marcadores do blogger e aproveitem para modificar o menu dos marcadores do jeito que achar melhor para o seu blog.
Para ocultar o marcador do menu quando visita a pagina do próprio marcador, ou seja, quando você está na pagina de um marcador ele não aparece no menu marcadores do seu blog. Entre na pagina editar html, marque para expandir o modelo de widgets, procure e apague esse trecho:
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
Agora só clicar para salvar e pronto quando estiver na pagina de um marcador ele não aparecerá mais no menu se quiser faça o teste clicando em qualquer item do nosso menu.
Fazer aparecer um texto quando passa o mouse por cima do menu marcador também é fácil de fazer. Volte a pagina editar html quase no mesmo trecho que estava e procure o trecho:
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
Apague e coloque esse no lugar
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' expr:title='"Dicas sobre:" + data:label.name'><data:label.name/></a>:
O texto Dicas sobre: (os dois pontos também) você pode alterar como quiser, mas cuidado com o restante do código, pois se apagar qualquer coisa dá erro na hora de salvar.
Colocar uma imagem ao lado dos links do menu marcadores é como personalizar qualquer outro menu. Na pagina editar HTML procure por ]]></b:skin> e coloque esse código antes dele:
#Label1 a{font-size:130%;display: block;background-image: url(endereço da imagem);text-indent: 12px;background-repeat: no-repeat;background-position: left center;padding:2px}
#Label1 a:hover{background-image: url(endereço da imagem);text-indent: 12px;background-repeat: no-repeat;background-position: left center;padding:2px}
Apenas cuidado para usar o endereço certo da imagem e o restante do código é formatação CSS normal. Apenas deve modificar o text-indent: 12px isso é o recuo de texto para que o nome do marcador não fique sobre a imagem de fundo, veja mais detalhes sobre como Fazer Menu com Imagens ao lado dos Links.
Mais dicas úteis sobre os Marcadores do blogger:
Ocultar mensagem mostrando postagens com o marcador
Marcadores em forma de menu suspenso
Esperamos que gostem dessas dicas sobre os marcadores do blogger e aproveitem para modificar o menu dos marcadores do jeito que achar melhor para o seu blog.
Marcadores: Códigos, Colocar Menu, Configurações Avançadas, Personalizar, Template