Skip to main content

Add Latest Version of Schema Breadcrumbs Markup in New Blogger Themes



In this post, I will explain how to correctly add the latest version of Schema Breadcrumbs in New Blogger Themes – Contempo, Soho, Emporio, Notable, and Essential, which will correctly validate in Google Structured Data Testing Tool and remove all errors appearing in the Search Console.
The method of adding Schema Breadcrumbs Markup in Blogger Posts and Pages is given below: The Breadcrumbs Trail will appear properly on screens of all resolutions, including Mobile, Tablets, Laptops, and Desktops. 

First Step:
Add - <b:include data='posts' name='breadcrumb'/>  in the template like this -

<b:includable id='main'>
<b:include name='noContentPlaceholder'/>
<b:include data='posts' name='breadcrumb'/>
<b:comment>Cap the total number of ads (widgets and inline ads).</b:comment>

See the reference image given below:


Second Step:
Add the Schema Breadcrumbs Code given below above  -  <b:includable id='commentAuthorAvatar'> See the refrence image given below the code. 

<b:includable id='breadcrumb' var='posts'><b:if cond='data:view.isPost'> <b:loop values='data:posts' var='post'> <div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'> <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'> <a expr:href='data:blog.homepageUrl' itemprop='item' title='Home'> <meta content='1' itemprop='position'/> <span itemprop='name'><b:switch var='data:blog.locale'><b:case value='id'/>Home<b:default/>Home</b:switch></span></a> </span> <b:if cond='data:post.labels'> <b:loop index='nomor' values='data:post.labels' var='label'> &amp;nbsp;&#8250;&amp;nbsp; <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'> <meta expr:content='data:nomor+2' itemprop='position'/> <a expr:href='data:label.url + &quot;?&amp;max-results=8&quot;' expr:title='data:label.name' itemprop='item'> <span itemprop='name'><data:label.name/></span> </a> </span> </b:loop> <b:else/> &amp;nbsp;&#8250;&amp;nbsp; <span itemprop='name'><data:blog.pageName/></span> </b:if> </div> </b:loop><b:elseif cond='data:view.isPage'/> <div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'> <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'> <a expr:href='data:blog.homepageUrl' itemprop='item' title='Home'> <meta content='1' itemprop='position'/> <span itemprop='name'><b:switch var='data:blog.locale'><b:case value='id'/>Home<b:default/>Home</b:switch></span></a> </span> &amp;nbsp;&#8250;&amp;nbsp; <span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'> <meta expr:content='data:num+2' itemprop='position'/> <a expr:href='data:blog.url' expr:title='data:post.url' itemprop='item'> <span itemprop='name'><data:blog.pageName/></span> </a> </span> </div></b:if> </b:includable>


Third Step:
Add the CSS Code given below above -

]]></b:skin>

.breadcrumbs { padding-top: 20px; padding-bottom: 0px; margin-left: 0px; padding-left: 40px; padding-right: 20px;font-size:90%; color: #000000; background: white;}.breadcrumbs a {color: #f3212d;}@media screen and (max-width:800px) {.breadcrumbs { margin-left: 0px; padding-left: 20px; padding-bottom: 10px; padding-right: 20px; color: inherit;font-size:90%;}}.breadcrumbs a:hover { color: #ea9999;}

You can change the colors and the font size as per your choice.

The Script given above is the latest version of the Breadcrumbs Trail for Blogger Blogs, which appears correctly on the New Themes released by Blogger and a few years back and other HTML5 Blogger Themes

Comments

Popular posts from this blog

DIRECT REALISATION

(1)I bow to that Ṣrî Hari (Vishṇu), the infinite bliss, the Teacher, the Supreme Lord, all-pervading, the prime-cause of all the worlds. Direct realisation is herein expounded as a means to liberation. It should be studied, again and again, with great effort, only by the wise. (2) By following the duties of one's own caste and order, by asceticism and by the propitiation of Hari, men will gain the four-fold requisite of freedom from desires, etc. (3) Spotless freedom from desires means such a dissatisfaction in respect of all objects from Brahman down to the inanimate as is felt in respect of the excrement of a crow. (4) Discrimination of the real means the determination that the nature of the self is eternal while, all that is perceptible is otherwise (5) The constant eradication of mental impressions is called control of mind. The restraint of external activities is called control of body. (6) Extreme abstention is the turning away from the objects of enjoyment. The

Symbol of the Indian Rupee

Udaya Kumar, a post graduate in Design from Indian Institute of Technology Bombay has designed the symbol of the Indian Rupee. This symbol has come into effect from 15th July, 2010.  The symbol is an amalgam of Devanagari "Ra" and the Roman Capital "R" with two parallel horizontal stripes running at the top representing the national flag and also the "equal to" sign.

National Emblem of India

The four lions which stand for power, courage, pride and confidence, these four lions resting on a circular abacus girded by four smaller animals who are the guardians of the four directions, lion of the north, the elephant of the east, the horse of the south and the bull of the west make up the National Emblem of India.  At the bottom is inscribed 'Satyameva Jayate' meaning’ truth alone triumphs'.

DEFINATION OF ONES SELF

I salute the two feet of the holy Master, which destroy (this) unendurable duality, and whose dust, like the sacred ashes, quell the demon of illusion. (1). I salute the merciful and most excellent Master who destroys all doubts and whose two feet reveal the enjoyment of one-ness as the meaning of the word "that". (2). Scorched by the forest-fire of phenomenal existence, the pupil, possessed of all necessary qualifications, is thus enlightened by the Master with words capable of revealing the true self. (3). Whoever doubts the fact that himself exists? If even this is doubted, he who doubts is only thyself. (4). When one knows "I am not", it is verily Brahman itself that knows "it is not." When one knows "I am", then (too) it is that Brahman itself that knows thus. (5). Thyself, therefore, art Brahman. "I am not Brahman" is a mere illusion. From illusion springs separation wherein all sorrows have root. (6). He who gains