I've added Microdata to web page HTML, but it shows up on publishing from CMS

Question

As explained in searchengineland.com, I've added the following navigation markup but it shows up on publishing the site above the header. I want it to show up like the attached image in Google search results:

I'm using Sandvox for Mac to publish the site. Where should I add the Microdata HTML?

I tried to put it inside this code and it just prints on the published page:

<div  itemscope itemtype="http://schema.org/LocalBusiness" id="sitemenu">
.....
<div itemscope itemtype="http://schema.org/SiteNavigationElement">
<ul itemscope itemtype="http://www.schema.org/SiteNavigationElement">
<li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/our-   advantage">Our Advantage</a></li>
<li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/our- travel-experts">Travel Experts</a></li>
<li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/destinations">Destinations</a></li>
<li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/cruises">Cruises</a></li>
<li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/interests">Interests</a></li>
<li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/explore-your-world/interests/hotels-and-resorts">Hotels</a></li>
<li itemprop="name"><a itemprop="url" href="http://www.travelstore.com/travel-guides">Travel Resources</a></li>
</ul>
</div>

Answer 1

Your screenshot of the Google Search result shows two features:

• a search field that searches the result site
• links to other pages of the site

You can provide structured data markup to get the first feature ( Sitelinks Searchbox ), you can't provide structured data markup to get the second feature ( sitelinks ).

Schema.org's SiteNavigationElement type doesn't seem to get used by Google Search for any of their result features. I recommend not to use SiteNavigationElement at all.

If you want to use SiteNavigationElement anyway, note that you are not using it correctly: you can only markup the whole navigation , not single navigation links. So the url and name properties of SiteNavigationElement are for the URL and the name of the navigation itself (and a navigation typically doesn't have these). So it would be:

<ul itemscope itemtype="http://schema.org/SiteNavigationElement">
  <li><a href="http://www.travelstore.com/our-advantage">Our Advantage</a></li>
  <li><a href="http://www.travelstore.com/our-travel-experts">Travel Experts</a></li>
  <li><a href="http://www.travelstore.com/destinations">Destinations</a></li>
</ul>

(Note that Schema.org URIs should be specified without the www subdomain.)