Sunday, December 26, 2010

MAKE BREADCRUMB IN BLOGSPOT

Question: How to make breadcrumb navigation in blogger?
Answer:
  1. Log in to blogger.com
  2. Click Design
  3. Click Edit HTML
  4. Click Download Full Template and please back up your template first 
  5. Click or check the small box beside Expand Widget Template
  6. Find the code ]]></b:skin>
  7. Copy and paste the code below exactly above the code ]]></b:skin> .breadcrumbs{
    padding:5px 5px 5px 0;
    margin:0;font-size:95%;
    line-height:1.4em;
    border-bottom:4px double #cadaef;
    }
  8.  Next Find the following code in your template, Copy and paste the code below exactly below the code: <div class='post hentry uncustomized-post-template'> or <div class='post hentry'>
  9.  Example: <div class='post hentry'>
     <b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'> Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; <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 != &quot;true&quot;'> , </b:if> </b:loop> </b:if> &#187; <data:post.title/> </div> </b:if> </b:if>
  10. Click Save Template button.
  11. Finish.

0 comments:

Post a Comment