Solved

Google Rich Snippets

Posted on 2013-10-22
11
406 Views
Last Modified: 2013-11-10
Hi,

I am trying to apply rich snippets into my webpage. The problem is my localBusiness schema contains some information. I also want to include a description and logo but they are on other parts of my html page so how can I include them. Something like this...
<div class="header"><img src="myLogo.png"/></div>
<div class="body">
<div class="description">Some descriptive text</div>
</div>
<div class="footerInfo" itemscope itemtype="http://schema.org/LocalBusiness"> 
   <h3 >Contact Details</h3>
   <div style="font-size:1.1em; margin-left:20px;">
       <span itemprop="name">My Company Ltd</span> 
       <div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
                                <span itemprop="streetAddress">25 Sycamore Rd</span>, <span itemprop="addressLocality">Deptford</span><br />
                                <span itemprop="addressRegion">London</span>, <span itemprop="postCode">SE18 1HH</span>.
                            </div>  
                            Tel:&nbsp;<span itemprop="telephone">+44 (0) 01250 224 663</span>
                            Email:&nbsp;<span itemprop="email">enquiries@myaddress.co.uk</span>
                            Web:&nbsp;<span itemprop="url">www.myaddress.co.uk</span>                 
     &#9;&#9;&#9;        </div>    &#9;&#9;    &#9;            
                   </div>

Open in new window


So I need to include description and myLogo in the itemtype="http://schema.org/LocalBusiness" though from what I understand I cannot duplicate. I have tried loads to do this over the past months. Any advise would be greatly appreciated.

Thanks
0
Comment
Question by:blackstarsystems
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 4
11 Comments
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39596136
The first thing that I noticed, using the Structured Data Testing Tool, is that there is an error:

Error: Page contains property "postcode" which is not part of the schema

<span itemprop="postCode">

should be

<span itemprop="postalCode">

according to the schema PostalAddress.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39596141
Extracted structured data:

Extracted structured data
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39596142
The second thing, is that I am not sure what you are asking, so I would like to make sure that I understand before commenting.

Are you trying to set "logo" and "description" for LocalBusiness schema?  

It is my understanding that you can combine formats for Structured Data, so you might be able to use RDFa attributes to achieve that you need, but I haven't figured that one out yet.
0
Moving data to the cloud? Find out if you’re ready

Before moving to the cloud, it is important to carefully define your db needs, plan for the migration & understand prod. environment. This wp explains how to define what you need from a cloud provider, plan for the migration & what putting a cloud solution into practice entails.

 

Author Comment

by:blackstarsystems
ID: 39597130
Hi TheLearnedOne,

For the purposes of this lets use logo. Basically I have the contact details in the footer of my page and I have added the rich snippets to them. See below in div called footer.

<div id="header"><img id="logo" src="logo.png" /></div>
<div id="body">Some text...</div>
<div id="footer" itemscope="" itemtype="http://schema.org/LocalBusiness">     		        
                            <span itemprop="name">Black Star Systems Ltd</span>
</div>

Open in new window


Now in above code I would like to a rich snippet to my logo image tag which is in header. The problem is that the img logo is not in footer div where I declare the schema. So how do I incorporate logo into rich snippets as I cant move the logo it needs to be at the top of my page. How will Google know what schema to use if its not inside and itemType element.
0
 
LVL 96

Accepted Solution

by:
Bob Learned earned 500 total points
ID: 39597449
Hmmm...I would think that you would need to define itemscope one level higher in the HTML hierarchy.  I used the Structured Data Markup Helper, which generated this HTML, with 1 itemscope for LocalBusiness, and another for PostalAddress.  I manually edited the HTML to add the <Title> element, and the description itemprop.

<!-- Microdata markup added by Google Structured Data Markup Helper. -->
<html>
    <head>
        <title></title>
    </head>
    <body>
        <div itemscope itemtype="http://schema.org/LocalBusiness">
            <div class="header">
                <img itemprop="image" src="myLogo.png" />
            </div>
            <div class="body">
                <div class="description" itemprop="description">Some descriptive text</div>
            </div>
            <div class="footerInfo">
                <h3>Contact Details</h3>
                <div style="font-size: 1.1em; margin-left: 20px;">
                    <span itemprop="name">My Company Ltd</span>
                    <div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">
                        <meta itemprop="addressRegion" content=", SE18">
                        <meta itemprop="postalCode" content="1HH.">
                        <span itemprop="streetAddress"><span>25 Sycamore Rd</span>, <span>Deptford</span></span><br />
                        <span itemprop="addressLocality">London</span>, <span>SE18 1HH</span>.
                    </div>
                    <br />
                    Tel: <span itemprop="telephone">+44 (0) 01250 224 663</span><br />
                    Email: <span itemprop="email">enquiries@myaddress.co.uk</span><br />
                    Web: <span>www.myaddress.co.uk</span>
                </div>
            </div>
        </div>
    </body>
</html>

Open in new window

0
 

Author Comment

by:blackstarsystems
ID: 39597517
Oh I see. Thank you learned one. I know its a bit basic I just couldn't get my head round it and couldn't understand what I was doing wrong. To top it off I couldn't convey what I mean at all very well. Thank you for your time. I just embed the whole page into the schema
then and see what that does. Thanks you.
0
 

Author Comment

by:blackstarsystems
ID: 39597527
Oh I see. Thank you learned one. I know its a bit basic I just couldn't get my head round it and couldn't understand what I was doing wrong. To top it off I couldn't convey what I mean at all very well. Thank you for your time. I just embed the whole page into the schema
then and see what that does. Thanks you.

Of course the problem above now is that thats basically my whole website inside that schema. Lat on I am going to want to do the Breadcrumb schema. Based on what you have provided then the breadcrumb schema will be inside Local Businesses schema. Thanks for your help.
0
 
LVL 96

Expert Comment

by:Bob Learned
ID: 39597537
The problem that I see with the Structured Data (new name for Rich Snippets) Markup Helper is that it doesn't support the full schemas from schema.org, and it doesn't have all the attributes from the objects, like LocalBusiness.Description, so you have to think about how to manually edit the HTML to add those attributes.
0
 

Author Closing Comment

by:blackstarsystems
ID: 39597579
Well thanks for all the help you have given me. I think I am getting a handle onit.
0

Featured Post

Optimize your web performance

What's in the eBook?
- Full list of reasons for poor performance
- Ultimate measures to speed things up
- Primary web monitoring types
- KPIs you should be monitoring in order to increase your ROI

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The purpose of this video is to demonstrate how to set up an RSS Feed on a WordPress Website. This will be demonstrated using a Windows 8 PC. Feedburner will be used for this demonstration. Go to your WordPress login page. This will look like the…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
Suggested Courses

623 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question