I added the schema.org rich snippets code inside the <head> and the text is showing up on my home page, what am I doing wrong?
DTD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0 Transitional//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
...
Snippet Code
<div itemscope itemtype="http://schema.org/EntertainmentBusiness">
<span itemprop="name">MySite.com</span>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
<span itemprop="ratingValue">4.5</span> stars -
based on <span itemprop="reviewCount">233</span> Reviews
</div>
</div>
div is not allowed in head.
Parser’s think that the body started since they encounter div, so this content is displayed.
See "Content model" for the allowed content of the head element.
The correct DTD to use for XHTML and MicroData is:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional with HTML5 microdata//EN" "xhtml1-transitional-with-html5-microdata.dtd">
Found a code example from schema.org that uses the 'meta' tag - although it's not recommended from an SEO point of view according to the articles I have read:
<div itemscope itemtype="http://schema.org/Offer">
<span itemprop="name">Blend-O-Matic</span>
<span itemprop="price">$19.95</span>
<div itemprop="reviews" itemscope itemtype="http://schema.org/AggregateRating">
<img src="four-stars.jpg" />
<meta itemprop="ratingValue" content="4" />
<meta itemprop="bestRating" content="5" />
Based on <span itemprop="ratingCount">25</span> user ratings
</div>
</div>
Related
In the Following the '#yield' function is not working,It is showing as normal words not like blade function keywords
#yield('content')
</div>
#yield('footer')
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Admin | #yield('title')</title>
<!--Has all the sylesheets attached already!-->
#include('Elements/_head')
<!--Custom CSS or CSS Files for particular page-->
#yield('styles')
</head>
<body class="hold-transition skin-blue sidebar-mini" onload="startTime()">
<div class="wrapper">
<!--Application Header-->
#include('Elements/_header')
<!--Application Sidebar-->
#include('Elements/_side')
<!--Page Content Main-->
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
#yield('title')
<small></small>
</h1>
</section>
<!-- Main content -->
<section class="content">
<img id="loader" src="{{url::asset('images/loading.gif')}}">
#yield('content')
</section>
</div>
<!--Footer of Application-->
#include('Elements/_footer')
</div>
<!--Has all the scripts already attached-->
#include('Elements/_base')
<!--Custom scripts for particular pages-->
#yield('scripts')
</body>
</html>
I'm new to Laravel and i'm not quite sure yet how everything works. I'm trying to break appart code into various sections by including the begining of the page, and then create a hero section followed by some html in that page.
Everything shows but the html code that is on the page is rendering on top of everything else.
This thread looked like it could be things not being closed but as i see it everything is working as it should
Including header in wrong place Laravel 4
#include('blocks/scripts')
#extends('blocks/hero')
#section('title')
text here
#stop
#section('subtitle')
another text
#stop
<div class="container">
<div class="row">
<div class="col-12">
more text
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
</div>
</div>
#include('blocks/footer')
This is the file. The HTML block is being rendered right after the "scripts", followed by "footer" and then it shows the "hero".
The order should be scripts->hero->html->footer
#include('blocks/scripts') just has html code
#extends('blocks/hero') has #yield('title') and #yield('subtitle')
#include('blocks/footer') just text
I changed the names of some templates because it is difficult to understand the code what you put in the comments. But I think it can help you to organize your code.
The template where you have the html, head and body tags, is not a template to be included, but to extend other templates from it, and make use of a yield. For example #yield ('main-content'):
blocks/main.blade.php:
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
</head>
<body>
#yield('main-content')
</body>
</html>
blocks/hero.blade.php
This is a template that you could extends from the main one and adding content to the #yield('main-content') with #section('main-content'):
#extends('blocks/main')
#section('main-content')
<div class="container-fuid mx-0 wlgx_hero">
<div class="row">
<div class="col-12">
#include('blocks/header')
<section id="hero_text">
<h1 class="text-center text-white py-5">
#yield('title')
</h1>
<hr class="purple_line pb-3">
<section id="subtitle">
<p class="text-center">
#yield('subtitle')
</p>
</section>
</section>
</div>
</div>
</div>
#yield('hero-content')
#endsection('main-content')
The blade in your question (I don't know the name) can, in turn, extends from hero, and fill their yields:
#extends('blocks/hero')
#section('title')
text here
#stop
#section('subtitle')
another text
#stop
#section('hero-content')
<div class="container">
<div class="row">
<div class="col-12">
more text
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
<div class="col-6">
<h2 class="text-center">header</h2>
<p class="text-center">more text</p>
</div>
</div>
</div>
#stop
The last one is the view that you have to return from a route or controller, so that everything works.
Hope it's help
In blade files, every direct HTML outside of #section('something') will be rendered at the top of the file.
You need to put #yield('something') in the extended file then wrap your HTML code with #section('something') and #endsection('something') like what you do with title and subtitle.
I tried Parcel Delivery and it worked, i can click on the little button on the right site in gmail and a cart shows up in google now.
However Order doesn't seem to work for me at all.
I used the google markup tester and it said its fine. I also do have the button on the right site in gmail, but no cart shows up in google now. Since i can't figure out what i'm doing wrong i know ask you this question.
This is the Code i use. It is the code you provide on your site, except that i changed the orderDate since that caused a problem while i tested Parcel Delivery.
<div itemscope itemtype="http://schema.org/Order">
<div itemprop="merchant" itemscope itemtype="http://schema.org/Organization">
<meta itemprop="name" content="Amazon.com"/>
</div>
<meta itemprop="orderNumber" content="123-4567890-1234567"/>
<meta itemprop="priceCurrency" content="USD"/>
<meta itemprop="price" content="539.00"/>
<div itemprop="acceptedOffer" itemscope itemtype="http://schema.org/Offer">
<div itemprop="itemOffered" itemscope itemtype="http://schema.org/Product">
<meta itemprop="name" content="Samsung Chromebook"/>
<meta itemprop="sku" content="B009LL9VDG"/>
<link itemprop="url" href="https://rads.stackoverflow.com/amzn/click/com/B009LL9VDG" rel="nofollow noreferrer"/>
<link itemprop="image" href="http://ecx.images-amazon.com/images/I/81H-DO3qX0L._SX522_.jpg"/>
</div>
<meta itemprop="price" content="249.99"/>
<meta itemprop="priceCurrency" content="USD"/>
<div itemprop="eligibleQuantity" itemscope itemtype="http://schema.org/QuantitativeValue">
<meta itemprop="value" content="2"/>
</div>
<div itemprop="seller" itemscope itemtype="http://schema.org/Organization">
<meta itemprop="name" content="Samsung Marketplace Store"/>
</div>
</div>
<div itemprop="acceptedOffer" itemscope itemtype="http://schema.org/Offer">
<div itemprop="itemOffered" itemscope itemtype="http://schema.org/Product">
<meta itemprop="name" content="Google Chromecast"/>
<meta itemprop="sku" content="B00DR0PDNE"/>
<link itemprop="url" href="https://rads.stackoverflow.com/amzn/click/com/B00DR0PDNE" rel="nofollow noreferrer"/>
<link itemprop="image" href="http://ecx.images-amazon.com/images/I/811nvG%2BLgML._SY550_.jpg"/>
</div>
<meta itemprop="price" content="29.99"/>
<meta itemprop="priceCurrency" content="USD"/>
<div itemprop="eligibleQuantity" itemscope itemtype="http://schema.org/QuantitativeValue">
<meta itemprop="value" content="1"/>
</div>
<div itemprop="seller" itemscope itemtype="http://schema.org/Organization">
<meta itemprop="name" content="Google Store # Amazon"/>
</div>
</div>
<div itemprop="priceSpecification" itemscope itemtype="http://schema.org/DeliveryChargeSpecification">
<meta itemprop="price" content="10.00"/>
<meta itemprop="priceCurrency" content="USD"/>
</div>
<link itemprop="url" href="https://www.amazon.ca/gp/css/summary/edit.html/orderID=123-4567890-1234567"/>
<link itemprop="orderStatus" href="http://schema.org/OrderStatus/OrderProcessing"/>
<link itemprop="paymentMethod" href="http://schema.org/CreditCard"/>
<meta itemprop="paymentMethodId" content="**** **** **** 1234"/>
<meta itemprop="orderDate" content="2014-12-02T23:30:00-08:00"/>
<meta itemprop="isGift" content="false"/>
<meta itemprop="discount" content="0.97"/>
<meta itemprop="discountCurrency" content="USD"/>
<div itemprop="customer" itemscope itemtype="http://schema.org/Person">
<meta itemprop="name" content="John Smith"/>
</div>
<div itemprop="billingAddress" itemscope itemtype="http://schema.org/PostalAddress">
<meta itemprop="name" content="Google"/>
<meta itemprop="streetAddress" content="1600 Amphitheatre Pkwy"/>
<meta itemprop="addressLocality" content="Mountain View"/>
<meta itemprop="addressRegion" content="CA"/>
<meta itemprop="addressCountry" content="USA"/>
</div>
<link itemprop="orderStatus" href="http://schema.org/OrderInTransit"/>
</div>
Google Now only displays parcel delivery cards, not order markups.
In Google now, if you go to settings->cards->Gmails-> Show cards based on Gmail ---- you see option for Package tracking only.
Hope that helps!
If I add some custom tags in my spring-boot project, is it possible use them inside a thymeleaf-based file? For instance, if I had this tag defined in my TLD file (place in the directory /src/main/resources/static):
<tag>
<name>Input</name>
<tag-class>org.store.custom.taglib.form_control.InputTag</tag-class>
</tag>
Do I could use this in my view like that:
<p th:case="'Input'"><f:Input/></p>
Anyone knows if this is possible?
UPDATE
I try that, but when I run the application, the custom tags are not processed into the corresponding tags:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:f="/form.tld" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
<title>cadastro</title>
</head>
<body>
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">cadastro</h3>
</div>
<div class="panel-body">
<f:form th:attr="action=#{/__${command.getClass().getSimpleName()}__/cadastra}">
<div th:each="item : ${command['class'].declaredFields}">
<div th:each="item2 : ${item.declaredAnnotations}">
<div th:switch="${item2.annotationType().simpleName}" th:with="index=${itemStat.index}">
<p th:case="'Checkbox'"><f:Checkbox/></p>
<p th:case="'DataList'"><f:DataList/></p>
<p th:case="'Input'"><f:Input/></p>
<p th:case="'Radiobutton'"><f:Radiobutton/></p>
<p th:case="'Select'"><f:Select/></p>
<p th:case="'Textarea'"><f:Textarea/></p>
</div>
</div>
</div>
</f:form>
</div>
</div>
</body>
</html>
No. Thymeleaf's fundamental principle is that no alien tags should exist. (Only standard html). All dynamic content is added via custom attributes.
You can use this way
<input th:attr="your string message ='\'' + #{yourObject.meesage}" + '\''"/>
More examples: https://attacomsian.com/blog/thymeleaf-custom-html-attributes
I am trying to add the schema.org meta tags to my product pages - having offers and ratings etc.
The code below works fine and I'm able to test it google rich snippet tool.
<div itemscope itemtype="http://schema.org/Product">
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
<meta itemprop="ratingValue" content="5">
<meta itemprop="reviewCount" content="20">
</div>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span itemprop="price">Rs.100</span>
</div>
</div>
Now I have a video of this product on this page and based on the page layout - it is positioned above the price. So when I insert the videoobject as shown below - the google rich snippet tool throws an error saying
Error: Page contains property "video" which is not part of the schema
This is the shorter version of the full code which gives the error.
<div itemscope itemtype="http://schema.org/Product">
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
<meta itemprop="ratingValue" content="5">
<meta itemprop="reviewCount" content="20">
</div>
<div itemprop="video" itemscope itemtype="http://schema.org/VideoObject">
<meta itemprop="name" content="Hello World"/>
<meta itemprop="duration" content="T1M33S" />
<meta itemprop="thumbnailUrl" content="v2.jpg" />
<meta itemprop="contentURL" content="www.viddler.com/player/xyz"/>
<meta itemprop="embedURL" content="http://viddler.com/flash/publisher.swf?key=xyz"/>
<meta itemprop="description" content="Hello world"/>
</div>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span itemprop="price">Rs.100</span>
</div>
</div>
Now if I remove the video object and put it outside the product tag - its valid. But the way my page is structured - the video will appear within the product tag.
I can close the product tag - start the video tag - close the video tag and then open another new product tag - but then it will show as 2 different products.
Any idea how I should go about this.
Thanks
http://www.schema.org/Product doesn’t define the property video.
You could omit itemprop="video".
Drawback: The video is not associated with the product.
You could use the property description instead.
Drawback: the expected type is "Text" (but see Expected types vs text in the schema.org documentation).
You could use itemref to split your markup into two parts without creating two products, leaving the video out of the product item.
Drawback: The video is not associated with the product.
Just in case anyone stumbles across this looking for an answer to the question like I was. I'm not sure if this has changed since the original question was answered, but here is an up-to-date Jan 2018 answer.
According to schema.org (see http://schema.org/Product) CreativeWorks (of which VideoObjects are a type of) can be referenced from within a product with the use of itemprop="subjectOf" instead of itemprop="video". See the example below. This should work with Google's Structured Data Testing Tool.
<div itemscope itemtype="http://schema.org/Product">
<img itemprop="image" src="dell-30in-lcd.jpg" alt="A Dell UltraSharp monitor" />
<span itemprop="name">Dell UltraSharp 30" LCD Monitor</span>
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
<span itemprop="ratingValue">87</span> out of <span itemprop="bestRating">100</span> based on <span itemprop="ratingCount">24</span> user ratings
</div>
<span itemprop="offers" itemscope="" itemtype="http://schema.org/Offer" class="price-excluding-tax">
<meta itemprop="availability" href="http://schema.org/InStock">
<meta itemprop="itemCondition" content="http://schema.org/NewCondition">
<span itemprop="priceSpecification" itemscope="" itemtype="http://www.schema.org/PriceSpecification" id="price-excluding-tax-1003">
<span class="price-currency" itemprop="priceCurrency" content="GBP">£</span> <span class="price" itemprop="price" content="999">999.00</span>
</span>
</span>
<div itemprop="subjectOf" itemscope itemtype="http://schema.org/VideoObject">
<meta itemprop="duration" content="PT1M7S" />
<meta itemprop="name" content="Opera® ProSafe Hospital Profiling Bed" />
<meta itemprop="description" content="The Opera® ProSafe is the flagship bed from the Opera® range. Its extra low height and high nursing height makes the bed an all-in-one bed, eliminating the need to use low profiling and standard profiling beds separately. The Opera® ProSafe accommodates up to a 10” mattress, allowing the bed to be used with deep airflow mattresses and comply with the BS EN 60601-2-52:2010 medical beds standard."
/>
<meta itemprop="thumbnailUrl" content="https://alpinehc.co.uk/media/import/prosafe-video-thumbnail.png" />
<meta itemprop="contentURL" content="https://vimeo.com/232354348" />
<meta itemprop="embedURL" content="https://player.vimeo.com/video/232354348" />
<meta itemprop="uploadDate" content="2017-09-04T11:37:00+08:00" />
<meta itemprop="height" content="340" />
<meta itemprop="width" content="190" />
<iframe src="https://player.vimeo.com/video/232354348?api=1&player_id=player1&autoplay=1&loop=1" height="240" width="320"></iframe>
</div>
</div>
Adding one more option to what unor already said.
You may consider your video as kind of review (overview of the product). You can even say (depending on your actual web page) that AggregateRating (you have in code)+reviews for it+video are all parts of this broad Review. Then markup may look like this:
<div itemscope itemtype="http://schema.org/Product">
<div itemprop="review" itemscope itemtype="http://schema.org/Review">
<div itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
<meta itemprop="ratingValue" content="5">
<meta itemprop="reviewCount" content="20">
</div>
<div itemprop="video" itemscope itemtype="http://schema.org/VideoObject">
<meta itemprop="name" content="Hello World"/>
<meta itemprop="duration" content="T1M33S" />
<meta itemprop="thumbnailUrl" content="v2.jpg" />
<meta itemprop="contentURL" content="www.viddler.com/player/xyz"/>
<meta itemprop="embedURL" content="http://viddler.com/flash/publisher.swf?key=xyz"/>
<meta itemprop="description" content="Hello world"/>
</div>
</div>
<div itemprop="offers" itemscope itemtype="http://schema.org/Offer">
<span itemprop="price">Rs.100</span>
</div>
</div>