Different HTML markup for Structured Data Rich Snippets?

HTML Markup for Rich Snippets

Can I change the default html for Structured Data Rich Snippets?

For some reasons you may need to change the div and span HTML that comes with the default Rich Snippets. For example you may want to have a list instead or your Visual Builder strips out the span. In this case please see below the solution.

Default Rich Snippet Generator HTML Output:


<div itemscope itemtype="http://schema.org/Organization">

<div itemprop="name"><strong>FLDtrace</strong></div>

<div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
<span itemprop="streetAddress">123 Terminus Ave</span><br>
<span itemprop="addressLocality">Gotham</span><br>
<span itemprop="addressRegion">NYC</span><br>
<span itemprop="postalCode">19756</span><br>
<span itemprop="addressCountry">United States</span><br>
</div>

</div>

Does altering the HTML for Rich Snippets work?


<div itemscope itemtype="http://schema.org/Organization">

<h2 itemprop="name"><strong>FLDtrace</strong></h2>

<ul itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
    <li itemprop="streetAddress">123 Terminus Ave</li>
    <li itemprop="addressLocality">Gotham</li>
    <li itemprop="addressRegion">NYC</li>
    <li itemprop="postalCode">19756</li>
    <li itemprop="addressCountry">United States</li>
 </ul>

</div>

Testing the new HTML

Using the Structured Data testing Tool we can test the new format and as you can see below it still validates.

HTML Markup for Rich Snippets

Now you can go and use any HTML instead of default div and span as long you include the itemscope and itemprop schema.

I hope this helps anyone looking for this. Please consider reading next my other article why SEO friendly coding is good for your website.

Comments are closed.