Breadcrumb no Blogger

Breadcrumb é um menu de navegação para as páginas internas do blog. Serve para facilitar a navegação do blog.

Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.

Antes de  ]]></b:skin> cole o código abaixo.

/*Breadcrumbs-------------------------------*/

.breadcrumbs {
font-size: 14px;
padding:5px;
font-weight: bold;
border: 1px dashed $bordercolor;
line-height: 1.4em;
}
.breadcrumbs a {
font-weight: bold;
color:$textcolor;
}

.breadcrumbs a:link, a:hover, a:visited {
font-weight: bold;
color: $linkcolor;
}

SALVE !!!



Clique em "Expandir modelos de widget"

Procure por:


<b:includable id='main' var='top'>


Acima dele cole o seguinte código:

<b:includable id='breadcrumb' var='posts'>
  <b:if cond='data:blog.homepageUrl == data:blog.url'>
  <!-- No breadcrumb on front page -->
  <b:else/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
       <div class='breadcrumbs'>
         Browse &#187;  <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'>
               <b:if cond='data:label.isLast == &quot;true&quot;'> &#187;
                 <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
               </b:if>
             </b:loop>
             &#187; <span><data:post.title/></span>
           </b:if>
         </b:loop>
       </div>
    <b:else/>
      <b:if cond='data:blog.pageType == &quot;archive&quot;'>
        <div class='breadcrumbs'>
          Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
        </div>
      <b:else/>
        <b:if cond='data:blog.pageType == &quot;index&quot;'>
          <div class='breadcrumbs'>
          <b:if cond='data:blog.pageName == &quot;&quot;'>
            Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; All posts
          <b:else/>
            Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; Posts filed under <data:blog.pageName/>
          </b:if>
          </div>
        </b:if>
      </b:if>
    </b:if>
  </b:if>
</b:includable>

Agora procure por:


<!-- posts -->
<div class='blog-posts hfeed'>



E abaixo dele cole:

<!-- disable default status message
    <b:include data='top' name='status-message'/>
  default status message disabled -->
    <b:include data='posts' name='breadcrumb'/>
    <data:adStart/>

Salve e está pronto.


Se você usa o template do novo Blogger, a dica está aqui.