Primeiramente você sabe o que é um sitemap?
Bom, caso sua resposta seja "não". então vamos entender um pouquinho sobre: O sitemap de um script incrível que lista todos os posts de seu blog e os organiza de forma simultânea a que suas postagens são publicadas, isso também facilita o acesso aos seus posts. Veja um exemplo abaixo cujo se encontra aqui mesmo nesse site:
Agora depois de ver o exemplo acima você já deve saber mais ou menos o que é e como é e como funciona um sitemap.
Tem mais um coisa legal nesse script, quer saber qual então vá lá na minha página de exemplo acima e clique em cima do item Nome do post.
Veja que ele muda organizando os posts em ordem alfabética e se começarem com números e caracteres especiais eles serão mostrados em primeiro lugar.
isso porque o inglês considera assim e o script é originalmente em inglês.
Clique em Data e os posts voltam a ser exibidos por ordem de publicação.
Clique de novo em Data e a exibição passa a ser em ordem inversa, dos mais antigos para os mais recentes.
Agora depois vamos aprender a colocar este sitemap no seu blog:
São 2 passos simples: colar o código e editar cores, fontes, etc....
Para começar vá ao Painel de seu blog e clique na aba Páginas.
Crie uma nova página, coloque nome de "sitemap" ou como preferir defina para que ela não exiba comentários e a seguir clique em HTML, no alto do editor de texto.
Isso vai reverter o editor para o modo HTML.
Feito isso cole na área de postagem o código abaixo:
<div id="bp_toc">
</div>
<script src="https://sites.google.com/site/codigoselainegaspareto/scripts/sitemapbyelaine.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&max-results=9999&callback=loadtoc" type="text/javascript"></script>
<style scoped="" type="text/css">
#comments {display:none;}
</style>
<style type="text/css">
/* Código CSS */
#bp_toc {
background:#2469d9; /*COR DE FUNDO */
color:#666; /* COR DA FONTE */
margin:0 auto;
padding:5px;}
span.toc-note {
padding:20px;
margin:0 auto;
display:block;
text-center;
color:#fff; /* COR DA FONTE DO TÍTULO MOSTRANDO TODOS OS POSTS */
font-family:'Arial'; /* TIPO DA FONTE DO TÍTULO*/
font-weight:700;
text-transform:uppercase; /* COLOCA O TÍTULO EM CAPSLOCK */
font-size:32px; /* TAMANHO DA FONTE DO TÍTULO*/
line-height:normal;}
.toc-header-col1 {
padding:10px;
background-color:#f5f5f5; /* COR DE FUNDO DO SITEMAP */
width:250px;}
.toc-header-col2 {
padding:10px;
background-color:#f5f5f5; /* COR DE FUNDO DO SITEMAP */
width:75px;}
.toc-header-col3 {
padding:10px;
background-color:#f5f5f5; /* COR DE FUNDO DO SITEMAP */
width:125px;}
.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {
font-size:13px; /* TAMANHO DA FONTE DO TEXTO */
text-decoration:none;
color:#aaa; /* COR DA FONTE DO SITEMAP */
font-family:'Open Sans'; /* TIPO DE FONTE */
font-weight:700;
letter-spacing: 0.5px;}
.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {
text-decoration:none;}
.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {
background:#fdfdfd; /* COR DE FUNDO DOS POSTS */
padding:5px;
padding-left:5px;f
ont-size:100%}
.toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a{
color:#666;
font-size:13px;}
.toc-entry-col1 a:hover, .toc-entry-col2 a:hover, .toc-entry-col3 a:hover{
color:#e76e66; /* COR DA FONTE HOVER */
}
#bp_toc table {width:100%;margin:0 auto;counter-reset:rowNumber;}
.toc-entry-col1 {counter-increment:rowNumber;}
#bp_toc table tr td.toc-entry-col1:first-child::before {content: counter(rowNumber);min-width:1em;margin-right:0.5em;}
td.toc-entry-col2 {
background:#fafafa; /* COR DE FUNDO DO HEADER */
}
</style>
Clique em Publicar
Para editar coisas como cor de fundo, cor e tamanho de fonte, etc... você edita o código nos campos que deixei marcado em CAPSLOCK. Depois de pronto clique em Atualizar (se já tiver publicado).
Até a próxima.
Fonte: Elaine Gaspareto
0 Comentários