We are offering customer satisfaction survey to automotive industry and try to enabling Rich Snippets for Reviews and Ratings on Google Organic Search Result Page.
We don’t have access to the server code. We only have client code access.As we able to get their main website to implement the code below and include our JavaScript file.
<script type="text/javascript" src="//ukapi.xyzcorp.com/Scripts/xyz.js"></script>
<div id="DealerRating1" class="xyzDealerRating" data-xyz-action="GetDealerRatingHTMLBoxSmall" data-xyz-dealercode1="UK45199" data-xyz-dealercode2="UK45200"></div>
We are using jQuery and AJAX to amend the DOM to display the 5 stars reviews and also adding Rich Snippets for Reviews and Ratings when the document is ready, so the user and see the rating.
$(document).ready(function () {
GetDealerRatings();
});
function GetDealerRatings() {
var dealerRatings = $(".xyzDealerRating");
$.each(dealerRatings, function (i, dealerRating) {
GetWebAPI(dealerRating, sUrl + '/api/' + $(dealerRating).data("xyz-action") + '?dealercode1=' + $(dealerRating).data("xyz-dealercode1") + '&dealercode2=' + $(dealerRating).data("xyz-dealercode2"));
});
}
function GetWebAPI(dealerRating, sUrl) {
$.ajax({
url: sUrl,
type: 'GET',
dataType: 'json',
crossDomain: true,
cache: false,
contentType: 'application/json; charset=utf-8',
async: true,
success: function (data) {
WriteResponse(dealerRating, data);
});
}
function WriteResponse(dealerRating, data) {
$(dealerRating).empty();
//$(dealerRating).append(data);
document.getElementById("DealerRating1").innerHTML = data;
Unfortunately, this is not working because what Google can only see is this below
<div id="DealerRating1" class="auraDealerRating" data-aura-action="GetDealerRatingHTMLBoxSmall" data-aura-dealercode1="UK45968" data-aura-dealercode2="UK45969"></div>
The rich snippets code only loaded after the document is ready.
<div id="DealerRating1" class="auraDealerRating" data-aura-action="GetDealerRatingHTMLBoxSmall" data-aura-dealercode1="UK45968" data-aura-dealercode2="UK45969">
<div class="auradrsmall" itemscope="" itemtype="http://schema.org/Review">
<span class="header">Customer Recommendation</span>
<div itemprop="itemReviewed" itemscope="" itemtype="http://schema.org/LocalBusiness">
<span itemprop="name" class="auraGoogleReviewText">Hutchings Hyundai - Bridgend</span>
</div>
<span itemprop="author" itemscope="" itemtype="http://schema.org/Person">
<span itemprop="name" class="auraGoogleReviewText">Aura Corporation</span>
</span>
<meta itemprop="datePublished" content="2015-06-12">
<div class="section">
<div class="col type">Sales</div>
<div class="col auraratingsmall10" itemprop="reviewRating" itemscope="" itemtype="http://schema.org/Rating">
<span itemprop="ratingValue" class="auraGoogleReviewText">4.9</span>
</div>
<div class="col">
<ul>
<li>7 Customers</li>
<li><a href="javascript:openlightbox('UK45968');">2 with comments</a></li>
</ul>
</div>
</div>
<div class="footer">Real customer reviews from <span class="aura">aura</span> </div>
</div>
</div>
We did study ‘Guide to AJAX crawling for webmasters and developers’, but that only work if we can control the server code. But, we can’t as we only have access to client code https://support.google.com/webmasters/answer/174992?hl=en
Anyone have similar issue? Is there any way to get Google to crawl this? Or alternative solution for this?