Ferramenta muito utiul que você deve ter visto e vários sites, ele permite exibir o caminha feito pelo o leitor que esta acessando o blog ou seja ele diz onde e que o leitor, em que pagina do blog
Para colocar o caminho basta você seguir as instrunções abaixo:
1° vá em layout, e editar html e marque a caixinha "Expandir Modelos de Widgets" e procure pelo código abaixo:
<b:includable id='main' var='top'>
2° E substitua pelo código abaixo:
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- Sem breadcrumb na página inicial -->
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb para a página do post -->
<p class='breadcrumbs'>Você está em: <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>»
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast == "true"'/>
</b:loop>
<b:else/>
»Sem Marcador
</b:if>
»<span><data:post.title/></span>
</b:loop>
</p><b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb para o arquivo e página de buscas.. -->
<p class='breadcrumbs'>Você está em: <a expr:href='data:blog.homepageUrl'>Home</a> » Arquivos de <data:blog.pageName/>
</p><b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>Você está em: <b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Todos os Posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts da Categoria <a expr:href='data:label.url' rel='tag'><data:blog.pageName/></a>
</b:if>
</p></b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
3° Agora procure pelo código abaixo:
<b:include data='top' name='status-message'/>
4° E substitua pelo o seguinte código:
<b:include data='top' name='status-message'/>
<b:include data='posts' name='breadcrumb'/>
Agora vamos inserir os estilos acss :
1° Procure pelo código abaixo:
]]></b:skin>
2° agora cole o código abaixo em cima do código:
/*-----Breadcrumbs-----*/
.breadcrumbs {
font-size: 14px;
padding:5px;
font-weight: bold;<br />
border-bottom:3px double #BEBEBE;
line-height: 1.4em;<br />
}
.breadcrumbs a {
font-weight: bold;
color:red;
}
3° Agora salve as alterações e visualize.
1 comentários:
uma dica de blogeiro designer,Da uma melhorada grafica no blog pois o conteudo é show se quiser ver meus blogs perfil agradeço pela dica acima otima.
Postar um comentário