Personalizando a mensagem "mostrando postagens com marcador"

domingo, 24 de agosto de 20140 comentários

Conforme alguns já notaram, fiz algumas alterações na forma de exibição dos marcadores do blog. Antes os posts apareciam por completo e com aquela mensagem “Mostrando postagens com marcador Primeiros Passos. Mostrar todas as postagens” Agora, só aparecem os títulos dos posts e sem a referida mensagem.
Ao fazer essa alteração, minha intenção foi facilitar a vida dos visitantes, já que no caso de marcadores vinculados com muitos posts a página demorava muito pra carregar. Um exemplo é o marcador “informações”, com 94 posts até o momento.
Existem diversas formas de personalização, então escolha a que você mais gostar.  
Antes de começar as alterações, faça um backup do seu template e salve no pc.
1. Excluindo a mensagem padrão do marcador (Fonte: El Escaparate de Rosa )
mensagem padrão do marcador
Entre em editar html, marque expandir modelos de widgets e procure (Crtl+F) por:
<b:include data='top' name='status-message'/>
Apague essa linha inteira, visualize e se tudo estiver bem, clique em salvar modelo.
2. Ocultando a mensagem padrão do marcador
Você pode também ocultar a mensagem padrão, ao invés de excluí-la. Inclua no CSS do template, antes de ]]></b:skin> , o seguinte código:
.status-msg-wrap {
display:none;
}
Clique primeiro em visualizar e se tudo estiver bem, clique em salvar modelo.
3. Alterando a mensagem do marcador, sem excluí-la

Entre em editar html, marque expandir modelos de widgets e procure (Crtl+F) por:
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
Substitua todo o código acima por este:
<div class='status-msg-wrap'>
<li>Você está no marcador &quot;<data:blog.pageName/>&quot;:</li>
</div>
A parte assinalada em vermelho pode ser substituída pela frase que você quiser.
4. Para personalizar a nova mensagem

Aqui daremos um estilo para a frase acima, colocando cor, plano de fundo, borda e alinhamento no texto. Entre no html do template e procure por ]]></b:skin>
Cole, logo acima, o seguinte código:
.status-msg-wrap {
text-align: left;
margin:6px 0px;
background:#e6e6e6;
color: #cc0000;
padding:6px;
border:1px solid #ccc
}
.status-msg-wrap li {
list-style-type:none;
font-weight:bold
}
Você pode substituir a parte em vermelho por center (texto alinhado no meio) ou por right(texto alinhado à direita) e a parte em verde para normal ou italic. Para alterar o background (plano de fundo), a cor do texto (color) e a cor da borda (border) use uma tabela de cores e substitua pelos respectivos números.


5. Para mostrar apenas os títulos dos posts
Compartilhe :

Postar um comentário

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Ajudinha Blog - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger